:root {
    --primary-color: #d11d24;
    --color-gray-dark: #363333;
    --color-gray: #666;
    --color-gray-light: #999;
}
.no-select {
    user-select: none; /* 标准写法 */
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE 10及以下 */
}
* {
    margin: 0;
    padding: 0;
}
body,h1,h2,h3,h4,h5,p{
    margin: 0;
    padding: 0;
    font-size: inherit;
}
body {
    background: #f7f8fb;
    font-family: Arial, Helvetica, Microsoft Yahei, sans-serif;
}
a {
    text-decoration: none;
}
ul li {
    list-style: none;
}
body.indexBody {
    position: relative;
    background-color: #ffffff;
}
.red_c {
    color: var(--primary-color);
}
.flexStyle {
    display: flex;
    align-items: center;
}
.flexStyleCenter {
    display: flex;
    justify-content: center;
    align-items: center;
}
.flexStyleRight {
    display: flex;
    justify-content: right;
    align-items: center;
}
.flexStyleStart {
    display: flex;
    align-items: flex-start;
}
.flexBetweenStyle {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.flexBetweenBase {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}
.flexColumn {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.flexColumnStart {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.flexColumnBetween {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
}
.prevArrow,.nextArrow {
    width: 28px;
    height: 60px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
@keyframes fadeInOut {
    from { opacity: .5; }
    to { opacity: 1; }
}
.prevArrow {
    background: url("../images/left.png");
}
.prevArrow:hover {
    background: url("../images/leftHover.png");
    animation: fadeInOut .5s forwards;
}
.nextArrow {
    background: url("../images/right.png");
}
.nextArrow:hover {
    background: url("../images/rightHover.png");
    animation: fadeInOut .5s forwards;
}

.titleContainerWrap {
    max-width: 1500px;
    margin: 0 auto;
}

.viewMore {
    float: right;
    margin-top: -42px;
    color: var(--color-gray-light);
    font-size: 14px;
    text-decoration: none;
    transition: color .3s ease;
}

.viewMore:hover {
    color: var(--primary-color);
}

/* 默认最大宽度 */
.header-container {
    margin: 0 auto;
}

/* Header 整体容器 */
.header {
    position: fixed;
    top: 0;
    width: 100%;
    background-color: #ffffff;
    box-shadow: 0 2px 8px rgba(209,29,36,0.1);
    z-index: 100;
}

.header-container {
    margin: 0 auto;
    display: flex;
    align-items: center;     /* 垂直居中 */
    justify-content: space-between; /* 左中右分布 */
    gap: 20px;               /* 各部分间距 */
}

/* Logo 样式 */
.logo img {
    height: 40px;
}

.nav-menu {
    flex-shrink: 0;
}

/* 导航菜单样式 */
.nav-menu > ul {
    margin: 0;
    padding: 0;
    display: flex;
    gap: 20px;
}

.nav-menu li {
    position: relative;
}

/*.nav-menu li.active a::after {*/
/*    content: '';*/
/*    position: absolute;*/
/*    left: 0;*/
/*    bottom: 0;*/
/*    width: 100%;*/
/*    height: 4px;*/
/*    background-color: var(--primary-color);*/
/*}*/

.nav-menu > ul > li.active > a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 4px;
    background-color: var(--primary-color);
}

.nav-menu > ul > li.active > a {
    color: var(--primary-color);
}

.nav-menu a {
    display: block;
    text-decoration: none;
    color: var(--color-gray);
    font-size: 14px;
    transition: color 0.3s ease;
}

.nav-menu > ul > li > a {
    height: 68px;
    padding: 0 2px;
    line-height: 68px;
}

.nav-menu a:hover {
    color: var(--primary-color);
}

.more-dropdown {
    display: none;
}

.more-menu,
.dropdown-menu {
    display: none;
    position: absolute;
    top: 68px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;;
    background-color: white;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    min-width: 160px;
    padding: 0;
    z-index: 999;
    border-radius: 4px;
    text-align: center;
}

.more-menu li,
.dropdown-menu li {
    width: 100%;
}

.more-menu a,
.dropdown-menu a {
    display: block;
    padding: 10px;
    text-decoration: none;
    color: #333;
}

/* 鼠标悬停显示 */
.more-dropdown:hover .more-menu {
    display: block;
}

/* 下拉菜单样式 */
.dropdown:hover .dropdown-menu {
    display: block;
}

.dropdown-menu {
    display: none;
    position: absolute;
    top: 68px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;;
    background-color: white;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    min-width: 160px;
    padding: 0;
    z-index: 999;
    border-radius: 4px;
    text-align: center;
}

.dropdown-menu li {
    width: 100%;
}

.dropdown-menu a {
    padding: 10px 15px;
    color: var(--color-gray);
    font-weight: normal;
    display: block;
}

.dropdown-menu a:hover {
    background-color: #f0f0f0;
}

/* 搜索框样式 */
.search-box form {
    display: flex;
    align-items: center;
}

.search-box input[type="text"] {
    padding: 6px 10px;
    width: 110px;
    height: 26px;
    background: #f7f7f7;
    border: none;
    outline: none;
    color: var(--color-gray);
}

.search-box input::placeholder {
    color: #cccccc;
}

.search-box .searchButton {
    border: none;
    width: 40px;
    height: 36px;
    background: url("../images/searchIcon.jpg");
    cursor: pointer;
}

.search-box .searchButton:hover {
    background: url("../images/searchIconHover.jpg");
}

/* 轮播 */
.carousel-container {
    position: relative;
    max-width: 100%;
    height: 380px;
    margin: 68px auto 0 auto;
    overflow: hidden;
    cursor: pointer;
}

.carousel-slide {
    display: flex;
    width: 100%;
    height: 380px;
    transition: transform 1s ease-in-out;
}

.carousel-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0; /* 默认隐藏 */
    transition: opacity .5s ease-in-out; /* 将过渡时间改为1秒 */
}

.carousel-slide img.active {
    opacity: 1; /* 显示当前图片 */
    transition: opacity .5s ease-in-out; /* 同样应用到显示时 */
}

/* 小圆点样式 */
.dots {
    text-align: center;
    margin-bottom: 36px;
    padding: 10px 0;
    position: absolute;
    bottom: 16px;
    width: 100%;
    z-index: 2;
}

.dot {
    display: inline-block;
    width: 22px;
    height: 3px;
    margin: 0 5px;
    background-color: #ffffff;
    border-radius: 2px;
    cursor: pointer;
    opacity: .8;
}

.dot.active {
    background-color: var(--primary-color);
}

/* 公司介绍 */
.introWrap {
    position: relative;
    width: 1500px;
    margin: -50px auto 0 auto;
    padding: 30px 50px 50px 40px;
    background: #ffffff;
    box-shadow: 0 6px 16px rgba(153, 21, 26, 0.1);
    box-sizing: border-box;
}

.introImg {
    margin-right: 30px;
}

.introWrap h2 {
    margin-top: 26px;
    color: var(--color-gray-dark);
    font-size: 26px;
}

.introWrap h3 {
    margin-top: 30px;
    margin-left: 10px;
    color: var(--color-gray-dark);
    font-size: 26px;
    opacity: .06;
}

.introWrap .introInfo {
    margin-top: 12px;
    color: var(--color-gray);
    font-size: 15px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 2;
    max-height: calc(2em * 5);
}

.introWrap .introInfo:hover a {
    color: var(--color-gray-dark);
}

.introWrap span {
    font-size: 14px;
    line-height: 26px;
    color: var(--color-gray-light);
}

.introDataWrap {
    padding-right: 30px;
}

.introData {
    width: 96px;
    margin-top: 26px;
    font-size: 15px;
    color: var(--color-gray);
}

/* 公司产品 */
.productWrap {
    margin: 46px auto;
    width: 1500px;
    box-sizing: border-box;
    text-align: center;
}

.productWrap a {
    width: 165px;
    margin-top: -6px;
    font-size: 15px;
    color: var(--color-gray-dark);
    cursor: pointer;
    transition: all 0.3s ease;
}

.productWrap > div:hover .product01,
.productWrap > div:hover .product02,
.productWrap > div:hover .product03,
.productWrap > div:hover .product04,
.productWrap > div:hover .product05,
.productWrap > div:hover .product06,
.productWrap > div:hover .product07 {
    transform: translateY(-3px);
    opacity: 0.9;
}

.productWrap > div:hover a {
    color: var(--primary-color); /* 高亮颜色 */
}

.product01,.product02,.product03,.product04,.product05,.product06,.product07 {
    transition: all 0.3s ease;
}

.product01 {
    height: 108px;
    background: url("../images/product01.jpg") no-repeat center;
    cursor: pointer;
}

.product02 {
    height: 108px;
    background: url("../images/product02.jpg") no-repeat center;
    cursor: pointer;
}

.product03 {
    height: 108px;
    background: url("../images/product03.jpg") no-repeat center;
    cursor: pointer;
}

.product04 {
    height: 108px;
    background: url("../images/product04.jpg") no-repeat center;
    cursor: pointer;
}

.product05 {
    height: 108px;
    background: url("../images/product05.jpg") no-repeat center;
    cursor: pointer;
}

.product06 {
    height: 108px;
    background: url("../images/product06.jpg") no-repeat center;
    cursor: pointer;
}

.product07 {
    height: 108px;
    background: url("../images/product07.jpg") no-repeat center;
    cursor: pointer;
}

/* 公司资质 */
.certsWrap {
    position: relative;
    text-align: center;
    z-index: 1;
}

.certsWrap h2{
    margin-top: 60px;
    color: var(--color-gray-dark);
    font-size: 26px;
}

.certsWrap h3{
    margin-top: -16px;
    color: var(--color-gray-dark);
    font-size: 26px;
    opacity: .06;
}

.carouselWrap {
    position: relative;
    width: 1500px;
    margin: 0 auto;
}

.certsCarousel {
    margin: 0 auto;
    overflow: hidden;
}

/*.carouselControls {*/
/*    position: absolute;*/
/*    top: 136px;*/
/*    left: 0;*/
/*    right: 0;*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*    transform: translateY(-50%);*/
/*}*/

.prev, .next {
    position: absolute;
    top: 134px;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    z-index: 10;
}

.prev {
    left: -40px;
}

.next {
    right: -40px;
}

.carouselItem {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-top: 20px;
    padding-bottom: 16px;
    width: 1500px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.8s ease, visibility 0.8s ease;
    z-index: 1;
}

/* 显示时的状态 */
.carouselItem.active {
    opacity: 1;
    visibility: visible;
    z-index: 2;
}

.certificateWrapper {
    position: relative;
    height: auto;
}

.certificate, .borderImage {
    width: 100%;
    height: auto;
    display: block;
}

.certInfo {
    max-width: 338px;
    margin-top: 16px;
    font-size: 14px;
    color: var(--color-gray-light);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    transition: color .3s ease;
}

.certificateWrap:hover .certInfo {
    color: var(--primary-color);
}

/* 让边框图比证书图宽一点 */
.borderImage {
    position: absolute;
    top: -2px;
    left: -14px;
    width: calc(100% + 32px);
    height: calc(100% + 14px);
    z-index: 2;
    pointer-events: none;
}

.certificate {
    position: relative;
    width: 338px;
    height: 238px;
    z-index: 1;
}

.certsBg {
    height: 156px;
    margin-top: 226px;
    background: url("../images/certBg.png") no-repeat center;
}

/* 全过程工程咨询产品与服务 */
.consultBg {
    width: 100%;
    padding: 50px 0;
    background: #f7f8fb;
}

.consultWrap {
    width: 1500px;
    margin: 0 auto;
    text-align: center;
}

.consultWrap h2{
    color: var(--color-gray-dark);
    font-size: 26px;
}

.consultWrap h3{
    margin-top: -16px;
    color: var(--color-gray-dark);
    font-size: 26px;
    opacity: .06;
}

.consultContent {
    width: 1500px;
    margin: 12px auto 0 auto;
}

.consultBox {
    position: relative;
    width: calc(100% / 7 - 6px); /* 自动计算宽度，留出间距 */
    transition: all 0.5s ease;
}

.consultBox .consultTxt,
.consultBox .consultHoverTxt {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: opacity 0.5s ease;
    font-size: 14px;
    color: #ffffff;
}

.consultBox h5 {
    margin: 46px 0 10px 0;
    font-size: 20px;
}

.consultBox .consultEng {
    font-size: 12px;
    line-height: 16px;
    opacity: .9;
}

.consultBox .consultLine {
    width: 32px;
    height: 3px;
    margin-bottom: 50px;
    background: #ffffff;
}

.consultBox .consultHoverTxt {
    opacity: 0;
    pointer-events: none;
    line-height: 26px;
}

.consultBox:hover .consultTxt {
    opacity: 0;
    pointer-events: none;
}

.consultBox:hover .consultHoverTxt {
    opacity: 1;
    pointer-events: auto;
    line-height: 26px;
}

.consult01 {
    /*width: 210px;*/
    height: 350px;
    background: url("../images/consult01.jpg") no-repeat center;
    transition: all 0.5s ease;
}
.consult01:hover {
    background: url("../images/consultHover01.jpg") no-repeat center;
}

.consult02 {
    /*width: 210px;*/
    height: 350px;
    background: url("../images/consult02.jpg") no-repeat center;
    transition: all 0.5s ease;
}
.consult02:hover {
    background: url("../images/consultHover02.jpg") no-repeat center;
}

.consult03 {
    /*width: 210px;*/
    height: 350px;
    background: url("../images/consult03.jpg") no-repeat center;
    transition: all 0.5s ease;
}
.consult03:hover {
    background: url("../images/consultHover03.jpg") no-repeat center;
}

.consult04 {
    /*width: 210px;*/
    height: 350px;
    background: url("../images/consult04.jpg") no-repeat center;
    transition: all 0.5s ease;
}
.consult04:hover {
    background: url("../images/consultHover04.jpg") no-repeat center;
}

.consult05 {
    /*width: 210px;*/
    height: 350px;
    background: url("../images/consult05.jpg") no-repeat center;
    transition: all 0.5s ease;
}
.consult05:hover {
    background: url("../images/consultHover05.jpg") no-repeat center;
}

.consult06 {
    /*width: 210px;*/
    height: 350px;
    background: url("../images/consult06.jpg") no-repeat center;
    transition: all 0.5s ease;
}
.consult06:hover {
    background: url("../images/consultHover06.jpg") no-repeat center;
}

.consult07 {
    /*width: 210px;*/
    height: 350px;
    background: url("../images/consult07.jpg") no-repeat center;
    transition: all 0.5s ease;
}
.consult07:hover {
    background: url("../images/consultHover07.jpg") no-repeat center;
}

/* 全过程工程咨询产品与服务 */
.processWrap {
    width: 1500px;
    margin: 16px auto 50px auto;
    box-sizing: border-box;
}

.leftPanel {
    margin-right: 16px;
}

.rightPanel {
    margin-left: 16px;
}

.leftPanel, .rightPanel {
    position: relative;
    width: 82px;
    height: 430px;
    padding: 8px 12px;
    box-sizing: border-box;
    background-image: linear-gradient(0deg, #d11d24 40%, #d95857 100%);
    border-radius: 4px;
    box-shadow: inset 0 1px 1px 0 rgba(255,255,255,0.6), inset 0 -2px 2px 0 rgba(209,29,36,0.3), 0 4px 14px rgba(209,29,36, 0.3);
    font-size: 22px;
    line-height: 26px;
    letter-spacing: 4px;
    writing-mode: vertical-rl;
    color: #fff;
    cursor: default;
}

.leftPanel h3, .rightPanel h3 {
    position: absolute;
    font-size: 18px;
    letter-spacing: 2px;
    opacity: .2;
}

.stageOutWrap {
    flex-grow: 1;
}

.stageWrap,
.infoService {
    width: 100%;
    flex-shrink: 0;
    box-sizing: border-box;
}

.stageItem {
    position: relative;
    flex: 1 0 auto;
    margin-right: 10px;
    padding: 30px 16px 36px 16px;
    background: url("../images/stageBg.jpg") no-repeat center center;
    background-size: cover, auto;
    border-radius: 4px;
    box-shadow: inset 0 2px 1px 0 rgba(255,255,255,0.8), inset 0 -1px 2px 0 rgba(209,29,36,0.1), 0 6px 16px rgba(209,29,36, 0.1);
    text-align: center;
}

.stageItem:last-child {
    margin-right: 0;
}

.stageItem img {
    width: 100%;
    object-fit: scale-down;
}

.stageItem h3 {
    padding: 8px 12px;
    background-image: linear-gradient(90deg, #d11d24 50%, #d95857 100%);
    border-radius: 4px;
    box-shadow: inset 0 1px 1px 0 rgba(255,255,255,0.2), 0 6px 16px rgba(209,29,36, 0.1);
    font-size: 20px;
    line-height: 26px;
    color: #fff;
}

.stageContent {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-bottom: 6px;
    box-sizing: border-box;
    background: url("../images/stageHoverBg.jpg") no-repeat center center;
    background-size: cover, auto;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px 0 rgba(255,255,255,0.6), 0 6px 16px rgba(209,29,36, 0.3);
    font-size: 14px;
    line-height: 28px;
    color: #fff;
    text-align: center;
    cursor: default;
    opacity: 0;
    transition: opacity .3s ease;
}

.stageItem:hover .stageContent {
    opacity: 1;
}

.infoService {
    margin-top: 16px;
    padding: 16px 24px;
    background: #ffeeee;
    border-radius: 4px;
    box-shadow: inset 0 2px 1px 0 rgba(255,255,255,0.8), inset 0 -1px 2px 0 rgba(209,29,36,0.1), 0 6px 16px rgba(209,29,36, 0.1);
    text-align: center;
    cursor: default;
}

.infoService a {
    margin-right: 16px;
    cursor: pointer;
}

.infoService h2 {
    background: linear-gradient(90deg, #d11d24 50%, #fff 100%);
    text-shadow: 0 4px 8px rgba(209,29,36, 0.2);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 24px;
    z-index: 2;
}

.infoService h3 {
    margin-top: -26px;
    margin-bottom: 10px;
    font-size: 24px;
    color: var(--primary-color);
    opacity: .1;
    z-index: 1;
}

.infoServiceItem {
    padding: 6px 20px;
    margin-right: 16px;
    background: #fff8f8;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px 0 rgba(255,255,255,0.6), 0 6px 16px rgba(209,29,36, 0.1);
    font-size: 18px;
    font-weight: bold;
    line-height: 28px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: var(--primary-color);
    transition: all .1s ease;
}

.infoServiceItem:last-child {
    margin-right: 0;
}

.infoServiceItem:hover {
    background-image: linear-gradient(90deg, #d11d24 50%, #d95857 100%);
    box-shadow: inset 0 1px 1px 0 rgba(255,255,255,0.2), 0 6px 16px rgba(209,29,36, 0.1);
    color: #fff;
}

/* 项目案例 */
.projectWrap {
    height: 514px;
    background: url("../images/projectBg.jpg") no-repeat center;
    text-align: center;
}

.projectWrap h2{
    padding-top: 40px;
    color: var(--color-gray-dark);
    font-size: 26px;
}

.projectWrap h3{
    width: 500px;
    margin: -16px auto 0 auto;
    color: var(--color-gray-dark);
    font-size: 26px;
    opacity: .06;
}

.tabButton {
    width: 116px;
    height: 34px;
    margin: 6px 6px 0 0;
    border: none;
    border-radius: 4px;
    background: #f0f0f0;
    font-size: 14px;
    line-height: 18px;
    color: var(--color-gray);
    cursor: pointer;
    transition: all .3s ease;
}

.tabButton:last-child {
    margin-right: 0;
}

.tabButton:hover {
    background: var(--primary-color);
    color: #ffffff;
}

.tabButtons .active {
    background: var(--primary-color);
    color: #ffffff;
}

.projectCarouselWrap {
    position: relative;
    width: 1500px;
    margin: 20px auto;
}

.projectCarousel {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 300px;
    display: flex;
}

.projectCarouselItem {
    min-width: 32%; /* 控制每行展示 3 张 */
    height: auto;
    transition: left 0.5s ease-in-out;
    position: absolute;
    top: 0;
    left: 100%;
    visibility: hidden;
}

.projectCarouselItem.active {
    left: 0;
    visibility: visible;
}

.projectCarouseControls {
    position: absolute;
    top: 136px;
    left: 60px;
    right: 60px;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
}

.projectItemWrap {
    position: relative;
    display: flex;
    justify-content: center;
    gap: 20px;
    width: 1500px;
    margin: 30px auto 0 auto;
}

.projectItem {
    position: relative;
    width: 486px;
    height: 300px;
    cursor: pointer;
    z-index: 9;
}

.projectItem img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.projectItem:hover .projectInfo {
    color: var(--primary-color);
}

.projectItem:hover .projectInfoBg {
    opacity: .85;
}

.projectInfoBg {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 50px;
    background: #ffffff;
    opacity: .8;
    transition: opacity .3s ease;
}

.projectInfo {
    position: absolute;
    overflow: hidden;
    max-width: 95%;
    bottom: 14px;
    color: var(--color-gray);
    white-space: nowrap;
    text-overflow: ellipsis;
    z-index: 2;
    transition: color .3s ease;
}

.projectPrev, .projectNext {
    background: none;
    border: none;
    cursor: pointer;
}

.projectPrev {
    position: absolute;
    top: 42%;
    left: 5.8%;
    z-index: 99;
}

.projectNext {
    position: absolute;
    top: 42%;
    right: 5.8%;
    z-index: 99;
}

/* 联系我们 */
.contactWrap {
    height: 390px;
    padding: 40px 0;
    box-sizing: border-box;
    background: url("../images/map.jpg") no-repeat center;
    background-size: inherit;
    text-align: center;
}

.contactWrap h2{
    color: var(--color-gray-dark);
    font-size: 26px;
}

.contactWrap h3{
    margin-top: -16px;
    color: var(--color-gray-dark);
    font-size: 26px;
    opacity: .06;
}

.contactList {
    width: 1500px;
    margin: 0 auto;
}

.contactList h5 {
    margin-left: 10px;
    font-size: 18px;
    color: var(--color-gray-dark);
}

.contactLeft {
    flex-shrink: 0;
}

.contactRight {
    margin-left: 60px;
    flex-shrink: 0;
}

.contactJoin {
    margin-bottom: 62px;
}

.contactLine {
    margin-top: 26px;
}

.contactValue {
    margin-top: 10px;
}

.contactName {
    color: var(--color-gray-dark);
}
.contactNum {
    color: var(--primary-color);
}

.contactLocation {
    width: 100%;
}

.contactLocation img {
    margin: 20px 50px 0 0;
    cursor: pointer;
    transition: all 0.3s ease;
}

.contactLocation img:hover {
    transform: translateY(-3px);
}

/* 底部 */
.footerBg {
    margin-top: 30px;
    padding: 36px 0;
    background: #262626;
}

.footerWrap {
    width: 1500px;
    margin: 0 auto;
    font-size: 14px;
    color: #b8b8b8;
}

.footerInfo {
    margin-top: -16px;
}

.footerWrap a {
    color: #b8b8b8;
    transition: all 0.3s ease;
}

.footerWrap a:hover {
    color: var(--primary-color);
}

.footerTxt {
    margin: -5px 0 0 40px;
    line-height: 22px;
}

.footerCode {
    margin-right: 10px;
    font-size: 12px;
    text-align: center;
}

.footerCode:last-child {
    margin-right: 0;
}

.footerCode p {
    margin-top: 8px;
}

.footerLine {
    width: 100%;
    height: 1px;
    margin: 26px 0;
    background: #474747;
}

.footerCopyright {
    margin-top: 6px;
    font-size: 14px;
}

.footerMap {
    flex-shrink: 0;
}

.friendLinkDropdown {
    position: relative;
    display: inline-block;
}

.dropdownHeader {
    cursor: pointer;
    padding: 8px 14px;
    border: 1px solid #474747;
    font-size: 14px;
    transition: background-color 0.3s ease;
}

.dropdownHeader:hover {
    background-color: #2e2e2e;
}

.dropdownContent {
    display: none;
    position: absolute;
    bottom: 100%;
    right: 0;
    width: 180px;
    max-height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #262626;
    border: 1px solid #474747;
    border-top: none;
    border-radius: 0 0 4px 4px;
    list-style: none;
    color: #b8b8b8;
    transition: max-height 0.4s ease-out;
    z-index: 1000;
}

.dropdownContent li {
    padding: 8px 12px;
}

.dropdownContent li a {
    text-decoration: none;
    color: #b8b8b8;
    display: block;
    font-size: 12px;
}

.dropdownContent li:hover {
    background-color: #474747;
    color: var(--primary-color);
}

.dropdownContent.open {
    display: block;
    max-height: 300px; /* 控制最大高度 */
    transition: max-height 0.4s ease-in;
}

/* 栏目详情 */
.column01,.column02,.column03,.column04,.column05,.column06,.column07,.column08,.column09 {
    height: 130px;
    margin: 68px 0 22px 0;
}
.column01 {
    background: url("../images/column01.jpg") center;
}
.column02 {
    background: url("../images/column02.jpg") center;
}
.column03 {
    background: url("../images/column03.jpg") center;
}
.column04 {
    background: url("../images/column04.jpg") center;
}
.column05 {
    background: url("../images/column05.jpg") center;
}
.column06 {
    background: url("../images/column06.jpg") center;
}
.column07 {
    background: url("../images/column07.jpg") center;
}
.column08 {
    background: url("../images/column08.jpg") center;
}
.column09 {
    background: url("../images/column09.jpg") center;
}

/* 左侧导航 */
.leftNavWrap {
    position: sticky;
    top: 88px;
    width: 260px;
    height: fit-content;
    margin-right: 20px;
    background: #ffffff;
    box-shadow: 0 6px 16px rgba(153, 21, 26, 0.1);
}

.leftNavHead {
    position: relative;
    width: 260px;
    padding: 20px 36px;
    background: var(--primary-color);
    color: #ffffff;
    box-sizing: border-box;
}

.leftNavHead h3 {
    font-size: 18px;
}
.leftNavHead h5 {
    position: absolute;
    right: 36px;
    font-size: 18px;
    opacity: .2;
}

.leftNav li{
    font-size: 16px;
    line-height: 60px;
}

.leftNav li a {
    display: block;
    padding-left: 36px;
    color: var(--color-gray-dark);
    transition: color .3s ease;
}

.leftNav li a:hover {
    color: var(--primary-color);
}

.leftNav li a.on {
    padding-left: 36px;
    background: url("../images/rightArrow.png") no-repeat right 30px center;
    color: var(--primary-color);
    box-shadow: 0 6px 16px rgba(153, 21, 26, 0.1);
}

/* 右侧内容 */
.columnWrap {
    width: 1500px;
    margin: 0 auto;
}

.columnDetailWrap {
    width: 100%;
    padding: 46px 50px;
    background: #ffffff;
    box-shadow: 0 6px 16px rgba(153, 21, 26, 0.1);
}

.columnContactDetailWrap {
    width: 100%;
    margin-left: 280px;
    padding: 46px 50px;
    background: #ffffff;
    box-shadow: 0 6px 16px rgba(153, 21, 26, 0.1);
}

.columnDetail iframe {
    margin-top: 20px;
    width: 100%;
}

.columnDetailHead {
    /*margin-bottom: 10px;*/
}

.columnDetailPath {
    float: right;
    font-size: 15px;
    color: var(--color-gray-light);
}


.columnDetailTitle h3 {
    padding-left: 10px;
    border-left: 6px solid var(--primary-color);
    font-size: 20px;
    line-height: 23px;
    color: var(--color-gray-dark);
}

.columnBook {
    margin-bottom: 30px;
}

.columnListPage {
    min-height: 580px;
    padding-top: 20px;
}

.columnList li {
    display: flex;
    justify-content: space-between;
    line-height: 80px;
    border-bottom: 1px solid #e6e7eb;
}

.columnList li a {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--color-gray-dark);
}

.columnList li a:hover {
    color: var(--primary-color);
}

.columnList .time {
    color: var(--color-gray-light);
}

.columnList .columnListBtn {
    display: flex;
    align-items: center;
    padding: 0 14px;
    border: 1px solid var(--primary-color);
    border-radius: 2px;
    color: var(--primary-color);
    line-height: 36px;
    transition: all .3s ease;
}

.columnList .columnListBtn:hover {
    background: var(--primary-color);
    color: #fff;
}

.hireList {
    align-items: center;
    color: var(--color-gray);
}

.hireList:hover .hireListJob {
    color: var(--primary-color);
}

.hireListJob {
    width: 400px;
    text-align: left;
}

.hireListItem {
    width: 80px;
    text-align: center;
}

.hireListCity {
    width: 150px;
    text-align: center;
}

.detailPageBtn {
    width: 130px;
    margin: 0 auto;
    padding: 0 16px;
    color: var(--primary-color) !important;
    background: #fff;
    border: 1px solid var(--primary-color);
    border-radius: 2px;
    line-height: 36px;
    text-align: center;
    cursor: pointer;
    transition: all .3s ease;
}

.detailPageBtn:hover {
    color: #fff !important;
    background: var(--primary-color);
}

.detailPageTable {
    border-collapse: collapse;
}

.detailPageTable th,
.detailPageTable td {
    padding: 8px;
    border: 1px solid #e6e7eb;
}

.detailPageTable th {
    background-color: #f7f7f7;
}

/* 关于我们 */
.columnAboutDetailPage {
    min-height: 580px;
    margin-top: 30px;
}

.columnAboutDetailPage .aboutDetailPageText * {
    max-width: 100%;
    font-size: 16px !important;
    line-height: 36px !important;
    color: var(--color-gray-dark);
}

.columnDetailPage {
    min-height: 580px;
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid #e6e7eb;
}

.columnDetailPage .detailPageHead {
    font-size: 22px;
    line-height: 32px;
    text-align: center;
    color: var(--color-gray-dark);
}

.columnDetailPage .releaseDate {
    margin-bottom: 16px;
    font-size: 14px;
    line-height: 30px;
    text-align: center;
    color: var(--color-gray-light);
}

.columnDetailPage .detailPageText * {
    font-size: 16px !important;
    line-height: 36px !important;
    color: var(--color-gray-dark)!important;
}

.columnDetailPage .detailPageText a {
    color: #226acd !important;
}

.columnDetailPage .detailPageText a:hover {
    color: #317add !important;
}

.columnDetailPage .detailPageText img {
    max-width: 80%;
    margin: 16px 0 6px 0;
}

.detailPageText .detailHead {
    font-size: 20px;
    text-align: center;
    color: var(--color-gray-dark);
}

.detailPageText .detailInfo {
    font-size: 18px;
    text-align: center;
    color: var(--color-gray-dark);
}

.columnPicWrap {
    min-height: 580px;
    margin-top: 30px;
}

.columnPicList {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 30px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.columnPicExpertList {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 30px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.columnPic {
    width: 100%;
}

.columnPic:hover .columnPicItem::after {
    opacity: .1;
}

.columnPic a p {
    margin: 10px 0;
    font-size: 15px;
    text-align: center;
    color: var(--color-gray);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.3s ease;
}

.columnPic:hover a p {
    color: var(--primary-color);
}

.columnPicItem {
    position: relative;
    aspect-ratio: 4 / 2.6;
    overflow: hidden;
    border: 1px solid #e6e7eb;
}

.columnPicItem a {
    display: block;
    width: 100%;
    height: 100%;
}

.columnPicItem img {
    width: 100%;
    height: 100%;
}

.columnPicItem::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--primary-color);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.columnCarouselWrap {
    width: 100%;
    margin-top: 20px;
}

.columnCarouselPart {
    position: relative;
    width: 100%;
}


.columnCarouselPart ul.slides li a {
    display: inline-block;
    width: 32%;
    box-sizing: border-box;
}

.columnCarouselPart ul.slides li a img {
    width: 100%;
    height: 240px;
    border: 1px solid #e6e7eb;
    object-fit: cover;
}

.columnCarouselPart ul.slides:after {
    display:block;
    visibility:hidden;
    height:0;
    clear:both;
    content:"";
}

.columnCarouselPart .flex-prev,
.columnCarouselPart .flex-next {
    display: block;
    position: absolute;
    top: 90px;
    width: 48px;
    height: 60px;
    overflow: hidden;
    background-repeat: no-repeat;
    z-index: 99;
}

.columnCarouselPart .flex-prev {
    left: -32px;
    background: url(../images/left.png) no-repeat;
}
.columnCarouselPart .flex-next {
    right: -50px;
    background: url(../images/right.png) no-repeat;
}
.columnCarouselPart .flex-prev:hover {
    background: url(../images/leftHover.png) no-repeat;
}
.columnCarouselPart .flex-next:hover {
    background: url(../images/rightHover.png) no-repeat;
}
.columnCarouselPart .flex-control-nav {
    display: none;
}

/* 技术实力 */
.columnPic:hover .columnCertItem::after {
    opacity: .1;
}

.columnCertItem {
    position: relative;
    aspect-ratio: 4 / 2.6;
    overflow: hidden;
    border: 1px solid #e6e7eb;
}

.columnCertItem a {
    display: block;
    width: 100%;
    height: 100%;
}

.columnCertItem img {
    width: 100%;
    height: 100%;
}

.columnCertItem::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--primary-color);
    mix-blend-mode: hard-light;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.columnExpertItem {
    position: relative;
    aspect-ratio: 3 / 4;
    overflow: hidden;
    border: 1px solid #e6e7eb;
}

.columnExpertItem a {
    display: block;
    width: 100%;
    height: 100%;
}

.columnExpertItem img {
    width: 100%;
    height: 100%;
}

.columnExpertItem::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--primary-color);
    mix-blend-mode: hard-light;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.columnHonorWrap {
    margin-top: 20px;
}

.columnHonorMenu li {
    width: 100%;
    margin-right: 16px;
    border-radius: 4px;
    background: #f0f0f0;
    box-shadow: inset 0 1px 2px 0 rgba(255,255,255,0.2), inset 0 -1px 2px 0 rgba(230,231,235,0.5);
    font-size: 14px;
    line-height: 38px;
    text-align: center;
    color: var(--color-gray);
    cursor: pointer;
    transition: all 0.3s ease;
}

.columnHonorMenu li:last-child {
    margin-right: 0;
}

.columnHonorMenu li:hover {
    background: var(--primary-color);
    box-shadow: inset 0 2px 2px 0 rgba(255, 255, 255, 0.3), 0 2px 6px rgba(209,29,36,0.2);
    color: #ffffff;
}

.columnHonorMenu .honorSelected {
    background: var(--primary-color);
    box-shadow: inset 0 2px 2px 0 rgba(255, 255, 255, 0.3), 0 2px 6px rgba(209,29,36,0.2);
    color: #ffffff;
}

/* 造价观察 */
.columnCostObDetailPage {
    min-height: 580px;
}

.columnCostObDetailPage h1 {
    font-size: 22px;
    color: var(--color-gray-dark);
}

.columnCostObDetailPage .releaseDate {
    margin-bottom: 16px;
    font-size: 14px;
    line-height: 30px;
    color: var(--color-gray-light);
}

.columnCostObDetailPath {
    margin-top: 4px;
    float: right;
    font-size: 15px;
    color: var(--color-gray-light);
}

.costYear {
    font-size: 15px;
    color: var(--color-gray);
}

.costObInput {
    width: 80px;
    padding: 6px 10px;
    border-radius: 4px;
    border: 1px solid #e6e7eb;
    outline: none;
    text-align: center;
    color: var(--color-gray-dark);
}

/* 年份选择 */


/* 华联世纪宣传片 */

.columnDetailVideo {
    text-align: center;
}

.columnDetailVideo .adverVideo {
    width: 100%;
}

.columnDetailVideo p {
    padding: 10px 0 12px 0;
    background: var(--primary-color);
    font-size: 16px;
    color: #fff !important;
}

.columnDetailVideo p span {
    color: #fff !important;
}

/* 联系我们 */
#allmap {
    width: 100%;
    height: 460px;
}

.contactInfoWrap {

}

.contactInfoWrap ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.contactInfoWrap li {
    min-height: 160px;
    padding: 26px 30px;
    box-shadow: 0 6px 16px rgba(153, 21, 26, 0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.contactInfoWrap li p,
.contactInfoWrap li span{
    font-size: 15px !important;
    line-height: 26px !important;
    color: var(--color-gray) !important;
}

.contactInfoWrap li:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 16px rgba(153, 21, 26, 0.1);
}

.contactInfoWrap h2 {
    margin: 40px 0 20px 0;
    font-size: 20px;
    color: var(--color-gray-dark);
}

.contactInfoWrap h5 {
    margin-left: 10px;
    font-size: 18px;
    color: var(--color-gray-dark);
}

.contactInfoWork {
    margin-bottom: 30px;
}

.contactInfoValue {
    margin-left: 30px;
}

.postCode {
    margin-top: 30px;
}

.contactInfoHead {
    margin-bottom: 10px;
    font-size: 18px;
    color: var(--primary-color);
}

/* 联系我们地图 */
.BMapLib_SearchInfoWindow {
    bottom: -240px !important;
    left: 362px !important;
    width: 390px !important;
    height: 208px;
    border: 1px solid #e6e7eb;
    border-radius: 4px;
    box-shadow: 0 6px 16px rgba(153, 21, 26, 0.1);
    font-family: Arial, Helvetica, Microsoft Yahei, sans-serif;
    color: var(--color-gray-dark);
}

.BMapLib_SearchInfoWindow .BMapLib_bubble_top {
    border-bottom: #e6e7eb;
}

.BMapLib_SearchInfoWindow .BMapLib_bubble_title {
    height: 40px;
    padding: 0 16px;
    font-size: 13px;
    font-weight: bold;
    line-height: 40px;
}

.BMapLib_SearchInfoWindow .BMapLib_bubble_tools {
    top: 4px;
    right: 2px;
}

.BMapLib_sendToPhone {
    display: none;
}

.BMapLib_SearchInfoWindow .BMapLib_bubble_content {
    height: 66px !important;
    padding: 14px;
    font-size: 13px;
}

.BMapLib_bubble_content div {
    line-height: 24px !important;
}

.BMapLib_nav_tab li.BMapLib_current {
    background: #fff;
}

.BMapLib_nav_tab {
    height: 36px;
    background: #f9f9f9;
    border: 1px solid #e6e7eb;
    border-left: 0;
    border-right: 0;
}

.BMapLib_nav_tab li {
    height: 32px;
    border-left: 1px solid #e6e7eb;
    line-height: 26px;
}

.BMapLib_nav_tab .BMapLib_icon {
    display: none;
}

.BMapLib_search_text,.BMapLib_trans_text {
    height: 24px;
    border: 1px solid #e6e7eb;
    outline: none;
}

.BMapLib_SearchInfoWindow .BMapLib_trans {
    display: none;
}

#BMapLib_stationText0 {
    font-family: Arial, Helvetica, Microsoft Yahei, sans-serif;
}

.BMapLib_SearchInfoWindow .iw_bt, .BMapLib_SearchInfoWindow .iw_bt_down, .BMapLib_SearchInfoWindow .iw_bt_over {
    background: #f1f1f1;
    color: var(--color-gray);
    transition: all .3s ease;
}

#BMapLib_search_nb_btn0:hover,
#BMapLib_search_bus_btn0:hover,
#BMapLib_search_drive_btn0:hover {
    background: var(--primary-color);
    color: #fff;
}

/* 网站地图 */
.columnSitemap {

}

.columnSitemap li {
    width: 100%;
    font-size: 14px;

}

.columnSitemap li a.title {
    font-weight: bold;
    color: #fff;
    background: var(--primary-color);
}

.columnSitemap li a {
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box;
    display: inline-block;
    line-height: 40px;
    background: #f0f0f0;
    border-bottom: 1px solid #fff;
    transition: all .3s ease;
}

.columnSitemap li a:hover {
    background: var(--primary-color);
    color: #fff;
}

/* 翻页样式 */
.pageTurnWrap {
    margin-top: 20px;
    font-size: 13px;
    color: var(--color-gray);
}

.custom-select {
    padding: 4px 8px;
    border: 1px solid #e6e7eb;
    border-radius: 4px;
    background-color: #fff;
    color: #666;
    outline: none;
}

.custom-select:hover,.custom-select:focus {
    border-color: var(--primary-color);
}

.page-nav {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 20px;
}

.page-nav a, .page-nav span {
    padding: 4px 8px;
    text-decoration: none;
    border-radius: 2px;
    transition: all 0.2s ease;
}

.page-nav a {
    min-width: 30px;
    height: 28px;
    padding: 0 5px;
    box-sizing: border-box;
    background-color: #f0f0f0;
    font-weight: bold;
    line-height: 28px;
    text-align: center;
    transition: all 0.3s ease;
}

.page-nav a:hover {
    background-color: #f0f0f0;
}

.page-nav .current {
    min-width: 30px;
    height: 28px;
    padding: 0 5px;
    box-sizing: border-box;
    background-color: var(--primary-color);
    color: white;
    line-height: 28px;
    text-align: center;
    font-weight: bold;
    border-radius: 2px;
}

.page-nav .nav-btn-left,
.page-nav .nav-btn-right {
    background-image: url("../images/pageLeft.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-color: #f0f0f0;
    text-align: center;
    font-weight: bold;
    color: #666;
    cursor: pointer;
}

.page-nav .nav-btn-left {
    background-image: url("../images/pageLeft.png");
}

.page-nav .nav-btn-left:hover {
    background-image: url("../images/pageLeftHover.png");
}

.page-nav .nav-btn-right {
    background-image: url("../images/pageRight.png");
}

.page-nav .nav-btn-right:hover {
    background-image: url("../images/pageRightHover.png");
}

.go-btn {
    padding: 0 14px;
    background: var(--primary-color);
    border-radius: 2px;
    line-height: 26px;
    text-align: center;
    color: #fff;
}

.go-btn:hover {
    background: #da4a50;
    color: #fff;
}