/* 公用样式 */
@import url('https://font.sec.miui.com/font/css?family=MiSans:300,400,500,600,700,900:MiSans'); /* 字体引入 */
body {font-family: 'MiSans', "PingFang SC", "Microsoft YaHei", Arial, sans-serif !important;}

/* 字体渐变色 */
.text-gradient {
    background: linear-gradient(90deg, #6b5ba0 0%, #37a5d0 100%);
    background-size: 200% 200%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    animation: gradientMove 3s ease infinite;
}
/* 渐变动画 */
@keyframes gradientMove {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}


.txt-c {text-align: center;}
.flex {display: flex;}
.flex-c {display: flex; align-items: center;}
.flex-cc {display: flex; align-items: center; justify-content: center;}

.gap-10 {gap: .1rem;}
.gap-15 {gap: .15rem;}
.gap-20 {gap: .2rem;}
.gap-25 {gap: .25rem;}
.gap-30 {gap: .3rem;}
.gap-40 {gap: .4rem;}
.gap-50 {gap: .5rem;}

.header2 {position: fixed;  width: 100%; left: 0; top: 0; z-index: 99; background: rgba(138, 151, 161, 0.36); transition: background .5s;}
.header2::after {content: ''; position: absolute; bottom: 1px; left: 0; width: 100%; height: 1px; background: transparent;}
/*.header2 .container {width: 1730px;}*/
.header2 .box {display: flex; align-items: center; justify-content: space-between;height: 1.2rem;}
.header2 .box > .logo {height: 100%; display: flex; align-items: center;}
.header2 .box > .logo > a {height: 100%; display: flex; align-items: center; padding: .3rem 0;}
.header2 .box > .logo > a img {max-height: 100%; object-fit: contain; filter: brightness(100); -webkit-filter:brightness(100);}
.header2 .hot a {font-size: .26rem; color: #fff;}
.header2 .box > .nav {width: 50%; height: 100%; }
.header2 .nav > ul {display: flex; justify-content: space-between; height: 100%;}
.header2 .nav > ul > li {height: 100%; display: flex; align-items: center;}
.header2 .nav > ul > li > a {color: #fff; font-size: .26rem;font-weight: 300; position: relative; height: 100%; display: flex; align-items: center;}
.header2 .nav > ul > li > a::after {content: ''; position: absolute; bottom: 2px; left: 50%; transform: translateX(-50%); width: 0; height: 1px; background: #fff; transition: .5s;}
.header2 .head_re .search img {width: .24rem; height: .24rem; object-fit: contain; cursor: pointer;}
.header2 .head_re .more a {font-size: .18rem; padding: .1rem .2rem; line-height: 1; display: block; border: 2px solid #fff; transition: .5s; border-radius: 6.25rem; color: #fff; position: relative; z-index: 1;}
.header2 .head_re .more a::after {content: ''; z-index: -1; opacity: 0;transition: .5s; position: absolute;top: 0;left: 0;width: 100%;height: 100%;border-radius: 6.25rem;background: linear-gradient(105deg, #6b5ba0 0%, #37a5d0 100%);}
.header2 .head_re .web {cursor: pointer; position: relative; padding: .25rem 0;}
.header2 .head_re .web i {font-size: .28rem; color: #fff;} 
.header2 .nav ul li.on a::after {width: 80%;}
@media (any-hover: hover) { 
    .header2 .nav ul li:hover a::after {
        width: 80%;
    }
    .header2  .head_re .more:hover a {
        border-color: transparent;
        color: #fff !important;
    }
    .header2  .head_re .more:hover a::after {
     opacity: 1;
    }
}

/* 导航下拉菜单交互 */
.header2.fh {background: rgba(255, 255, 255, 1);}
.header2.fh::after {background: #ddd;}
.header2.fh .logo a img {filter: none; -webkit-filter:none;}
.header2.fh .nav > ul > li > a {color: #333;}
.header2.fh .nav > ul > li > a::after {background: #333;}
.header2.fh .head_re .search img {filter: brightness(0); -webkit-filter:brightness(0);}
.header2.fh .head_re .more a {background: #eaeaea; border-color: #eaeaea; color: #333;}
.header2.fh .head_re .web i {color: #333;}
.header2.fh .mobmenu {color: #333;}
.header2.fh .mobmenu dl dd {background: #333;}

/* 产品下拉 */
/* 下拉菜单容器 */
.nav ul li .submenu {position: absolute;top: 99%;left: 0;width: 100%;background: #fff;box-shadow: 0 .1rem .1rem rgba(0, 0, 0, 0.05);padding: .6rem 0 .9rem;display: none;z-index: 999;}
.nav ul li .submenu .container {width:1750px;}
.submenu .list {display: grid;grid-template-columns: repeat(8, 1fr);gap: .2rem;}
/* 下拉菜单列 */
.submenu .submenu-column {display: flex;flex-direction: column;gap: .1rem;}
.submenu .submenu-column h4 {font-size: .2rem;color: #333; margin-bottom: .1rem; font-weight: 500;}
.submenu .submenu-item a {display: inline-flex;align-items: center;gap: .1rem;font-size: .16rem;color: #333;transition: color 0.3s;}
/*.submenu .submenu-item a span {font-size: .14rem;}*/
.submenu .submenu-item .imgBox {width: .4rem; height: .6rem; display: flex; align-items: center; justify-content: flex-start;}
.submenu .submenu-item .imgBox img {max-width: 100%; max-height: 100%; object-fit: contain; transition: transform 0.3s;}
@media (any-hover: hover) { 
    .submenu .submenu-item a:hover {
        color: #37a5d0;
    }
    .submenu .submenu-item a:hover .imgBox img {
        transform: scale(1.05);
    }
}

/* 产业网络下拉 */
.nav ul li .industry-submenu {display: none;  width: 50%; left: 50%; transform: translateX(-50%); padding: .6rem;}
.industry-submenu .list {display: flex; flex-direction: column; row-gap: .6rem;}
.industry-submenu .submenu-column {row-gap: .3rem;}
.industry-submenu .submenu-column .submenu-title {font-size: .24rem;}
.industry-submenu .submenu-column .submenu-title a {display: inline-flex; align-items: center; gap: .1rem; font-weight: 500; transition: color 0.3s;}
.industry-submenu .submenu-column .submenu-title i {font-size: .24rem;}
.industry-submenu .submenu-group {display: flex; justify-content: space-between; gap: .2rem;}
.industry-submenu .submenu-group .submenu-column-item {display: flex; flex-direction: column; row-gap: .1rem;}
.industry-submenu .submenu-group .submenu-column-item h5 {font-size: .18rem; font-weight: 500;}
.industry-submenu .submenu-group .submenu-column-item .submenu-item a { color: #666666; transition: color 0.3s; font-size: .15rem;}
@media (any-hover: hover) { 
    .industry-submenu .submenu-column .submenu-title a:hover {
        color: #37a5d0;
    }
    .industry-submenu .submenu-group .submenu-column-item .submenu-item a:hover {
        color: #37a5d0;
    }
}

/* 关于我们下拉 */
.nav ul li .about-submenu {display: none; width: 65%; left: 50%; transform: translateX(-50%); padding: .6rem;}
.about-submenu .list {background: #fff; display: flex; justify-content: space-between; gap: .2rem;}
.about-submenu .submenu-column {row-gap: .3rem;}
.about-submenu .submenu-column h4 {font-size: .18rem;}
.about-submenu .submenu-item a { color: #666666; transition: color 0.3s; font-size: .15rem;}


/* 语言选择弹窗 */
.lang-pop {}
.lang-dialog {max-width: 600px; width: 90%;}
.lang-dialog .layui-layer-content {padding: 20px 30px !important;  width: 100% !important;  box-sizing: border-box;}
.lang-dialog .layui-layer-title {font-weight: 500;  font-size: 16px;  background: #fff;  border-bottom: 1px solid #e6e6e6;}
.lang-dialog .layui-layer-close {color: #999 !important;}
.lang-options {display: flex;  gap: 15px;  justify-content: center;  align-items: center;  flex-wrap: wrap;}
.lang-item {flex: 1;  min-width: 80px;  height: 45px;  line-height: 45px;  text-align: center;  border: 1px solid #e6e6e6;  border-radius: 4px;  background: #f8f8f8;  cursor: pointer;  font-size: 14px;  color: #333;  transition: all 0.2s;}
.lang-item:hover {background: #f2f2f2 !important;  border-color: #d9d9d9 !important;}

/* 语言选择鼠标经过交互 */
.header2 .head_re .web .lang-pop {z-index: 12; max-width: max-content; box-shadow: 0 0 0.1rem rgb(0, 0, 0,.2);position: absolute;background: #fff;border-radius: 5px;padding: 15px 20px;left: 50%;top: 100%; text-align: center;transform:translateX(-50%) translateY(35%);opacity: 0;visibility: hidden;transition: .5s; width:max-content;}
.header2 .head_re .web .lang-pop::before {content: "";width: 20px; height: 10px; background: #fff; clip-path: polygon(50% 0%, 0% 100%, 100% 100%);-webkit-clip-path: polygon(50% 0%, 0% 100%, 100% 100%); background: #fff;  position: absolute;left: 50%;top: -1%;transform: translate(-50%, -50%);}
.header2 .head_re .web .lang-options {flex-direction: column; gap: 10px;}
.header2 .head_re .web .lang-options .lang-item {width: auto; min-width: 110px; min-height: 36px; background: none;}
@media (any-hover: hover) { 
.header2 .head_re .web:hover .lang-pop {opacity: 1; transform:translateX(-50%) translateY(0%); visibility: visible;}
}


/* 手机端导航按钮 */
.mobmenu {color: #fff; margin-left: 0 !important;}
.mobnav {position:relative; z-index:99;}
.mobnavBox .top {height: 1.2rem; min-height: 60px;}
.mobnavBox .top .logo a {height: 100%; display: block; padding:.1rem 0;}
.mobnavBox .bottom .nav > li {margin: 10px 0;}
.mobnavBox .bottom .nav .nav-item {position: relative;}
/* 导航链接样式 */
.mobnavBox .bottom .nav .nav-link {display: flex;align-items: center;justify-content: space-between;width: 100%;color: #333;padding: 5px 0;font-size: var(--font28);transition: all 0.3s;}
/* 带子菜单的导航链接 */
.mobnavBox .bottom .nav .has-submenu > .nav-link {cursor: pointer;}
/* 箭头图标样式 */
.mobnavBox .bottom .nav .nav-link i {display: flex;align-items: center;justify-content: center;width: 16px;height: 16px;color: #333;font-size: 12px;transition: transform 0.3s;}
.mobnavBox .bottom .nav .has-submenu.open > .nav-link i {transform: rotate(90deg);}
/* 子菜单容器 */
.mobnavBox .bottom .nav .nav-submenu {padding: 10px 0;display: none;background: #f8f9fa;}
/* 展开状态 */
/* .mobnavBox .bottom .nav .has-submenu.open > .nav-submenu {display: block;
} */

/* 二级菜单样式 */
.mobnavBox .bottom .nav .nav-item[data-level="2"] .nav-link {font-size: var(--font24);padding: 8px 20px;}
/* 三级菜单样式 */
.mobnavBox .bottom .nav .nav-item[data-level="3"] .nav-link {font-size: var(--font18);padding: 6px 30px;padding-right: 20px;}
/* 四级菜单样式 */
.mobnavBox .bottom .nav .nav-item[data-level="4"] .nav-link {font-size: var(--font16);padding: 6px 40px;}
/* 悬停效果 */
.mobnavBox .bottom .nav .nav-link:hover {color: #1484d2;}
/* 活动状态 */
.mobnavBox .bottom .nav .nav-item.active > .nav-link {color: #1484d2;}




/* =====首页===== */
.index2_banner {position: relative; }
.index2_banner .mySwiper2 {height: 100%;}
.index2_banner .mySwiper2 .slide {height: auto;}
.index2_banner .mySwiper2 .slide .imgBox {height: 100%;}
.index2_banner .mySwiper2 .slide .imgBox a {display: block; height: 100%;}
.index2_banner .mySwiper2 .slide .videoBox {height:100%;}
.index2_banner .mySwiper2 .slide .videoBox video {display:block;width: 100%; height: 100%; object-fit: cover; }
.index2_banner .mySwiper2 .slide img {width: 100%; height: 100%; object-fit: cover; }
.index2_banner .pagination {display:none;}
.index2_banner .mySwiper2 .swiper-pagination-bullet-active {background: #37a5d0;}
.index2_banner .thumb_box {position: absolute; width: 100%; bottom: 0; left: 0; background: #f6f6f6; z-index: 1; }
.index2_banner .mySwiper .slide {text-align: center; cursor: pointer; z-index: 1;padding: .2rem 0 .28rem; height: auto;}
.index2_banner .mySwiper .slide .t1 {font-size: var(--font18); font-weight: 500;}
.index2_banner .mySwiper .slide .t2 {color: #9d9d9d; font-weight: 300;}
.index2_banner .mySwiper .slide::after {content: ''; z-index: -1; left: 0; bottom: 0; width: 0; height: 2px; position: absolute;  background: linear-gradient(105deg, #6b5ba0 0%, #37a5d0 100%); transition: background .5s ease-in-out;}
@keyframes moveLine {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}

.index2_banner .mySwiper .slide.swiper-slide-thumb-active::after {
    animation: moveLine 3s linear forwards;
}

.index2_tle .t1 {font-size: .4rem; font-weight: 600;}
.index2_tle .t2 {font-size: .8rem; font-weight: 600;}

.index2_One {margin-top: 1.4rem; overflow: hidden;}
/* .index2_One .box {margin-top: .8rem;} */
.index2_One .sec_item { position: relative; z-index: 2; overflow: hidden;}
.index2_One .sec_item .video-background {position: absolute; width: 100%; height: 100%; aspect-ratio: 16 / 9; transition: opacity .3s ease-in-out, visibility .3s ease-in-out;}
.index2_One .sec_item .video-background::after {content: ''; width: 100%; height: 100%; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 100%);}
.index2_One .sec_item video {inset: 0;height: 100%; width: 100%; object-fit: cover;}
.index2_One .sec_item .content-wrapper {width: 100%; min-height: 100svh; padding: .8rem; display: flex;  align-items: center; justify-content: center; z-index: 2; position: relative;}
/* .index2_One .sec_item .content-wrapper .content {width: 30%;} */
.index2_One .sec_item .content-wrapper .content .heading {color: #fff; font-size: .6rem;}
.index2_One .sec_item .content-wrapper .content .text {color: #fff; font-size: .18rem; line-height: 1.8; margin-top: .3rem;}
/* .index2_One .sec_item:nth-child(even) .content-wrapper {justify-content: flex-end;} */

.index2_Two {position: relative;margin-top: 1.6rem;}
.index2_Two .container {width: 100%;}
.index2_Two .list {margin-top: .8rem;}
.index2_Two .list ul {display: grid; grid-template-columns: repeat(2,1fr); gap: .4rem;}
.index2_Two .list li {position: relative; overflow: hidden;}
.index2_Two .list li .imgBox {position: relative; padding-bottom: 90%;}
.index2_Two .list li .imgBox img {width: 100%; height: 100%; transition: .5s; position: absolute; inset: 0; object-fit: cover;}
.index2_Two .list li .tit_con {position: absolute; left: 50%; transform: translateX(-50%); top: 12%; z-index: 1;}
.index2_Two .list li .tit_con .tit {font-size: .5rem; font-weight: 600;}
@media (any-hover: hover) { 
    .index2_Two .list li:hover .imgBox img {
        transform: scale(1.05);
    }
}


.index2_Thre {padding: 1.6rem 0;}
.index2_Thre .container {width: 100%;}
.index2_Thre .list {margin-top: .8rem;}
.index2_Thre .list ul {display: grid; grid-template-columns: repeat(3,1fr); gap: .12rem;}
.index2_Thre .list li {background: #f8f8f8; border-radius: .1rem; overflow: hidden;}
.index2_Thre .list li .con {padding: .2rem .28rem; padding-bottom: .35rem;}
.index2_Thre .list li .imgBox {position: relative; padding-bottom: 70%; overflow: hidden;}
.index2_Thre .list li .imgBox img {position: absolute; height: 100%; width: 100%; object-fit: cover; transition: .5s;}
.index2_Thre .list li .time {color: #adadad; font-size: .18rem;}
.index2_Thre .list li .tit {font-size: .28rem; margin-top: .2rem; font-weight: 500;}
.index2_Thre .list li .more {margin-top: .8rem; color: #202020; font-size: .18rem; font-weight: 500;}
.index2_Thre .moreLinks {margin-top: .8rem;}
.index2_Thre .moreLinks a {font-size: .18rem; color: #fff; line-height: 1;display: block; padding: .14rem .28rem; background: #000; border-radius: 100px; transition: .5s;}
@media (any-hover: hover) { 
    .index2_Thre .list li:hover .imgBox img {
        transform: scale(1.05);
    }
    .index2_Thre .moreLinks a:hover {
        background: #f8f8f8;
        color: #202020;
    }
}
