.padding{ padding-top:150px; padding-bottom:150px;transition-duration: 0.3s; }
.pd{ padding-top: 150px;}
.padding-bottom-80{ padding-bottom:80px;}
.padding-top-0{ padding-top:0; }
.swiper{--swiper-theme-color:  var(--mc);/* 设置Swiper风格 */--swiper-navigation-color: #172259;/* 单独设置按钮颜色 */--swiper-navigation-size: 24px;/* 设置按钮大小 */}
.block80{  height: 80px;}
html{height: 100%;}

.btn a{ font-size: 16px; color:var(--mc); display:inline-flex; justify-content: space-between; grid-gap: 24px; align-items: center; border:var(--mc) solid 1px; border-radius:8px; padding: 10px 24px; transition-duration: 0.3s;  }
.btn a:hover{ color:var(--bg); background:var(--mc); }



.gradient{display: inline-block; background: linear-gradient(to right, #6320c7, #e42d50);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;}

.gradient-geo{display: inline-block; background: linear-gradient(to right, #baa1f8, #ffffff,#baa1f8);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;}

.gradient-gray{display: inline-block; background: linear-gradient(to right, #c3c4c2, #ffffff,#c3c4c2);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;}




.index_banner {position: relative; }
.index_banner .pagewidth{ position: relative}
.index_banner .swiper{height: 80vh}
.index_banner .swiper-slide{ position: relative;width: 100%;height: 100%;overflow:hidden; }
.index_banner .swiper-slide img.bg{width: 100%; height: 100%; object-fit: cover;}
.index_banner .swiper-slide .info{ width:var(--width);  position:absolute;left: 50%; top:50%;  transition-duration: 0.3s; z-index: 33; transform: translate(-50%, -50%); transition-delay:0.5s; }

.index_banner .swiper-slide .info h5{ margin-bottom: 16px; font-size: 20px; color: #fff;}
.index_banner .swiper-slide .info h5 strong{ background: #fff; padding:6px 12px;  border-radius: 40px;}
.index_banner .swiper-slide .info h3{margin-bottom: 24px;  font-size: 60px; text-align: left; color:#fff; line-height: 1; text-shadow: 0px 5px 10px rgba(0,78,162,0.3); }
.index_banner .swiper-slide .info p{ line-height: 1.6; text-align: left; color: #fff; padding-right: 66%; margin-bottom: 36px;}
.index_banner .swiper-slide .info .desc{ color: #000; font-size: 16px;line-height: 1.7; border-left: #000 solid 2px; padding-left: 16px; }
.index_banner .swiper-slide .info .button{ display: flex; justify-content:left}
.index_banner .swiper-slide .info .button a{ border: #fff solid 1px; transition-duration: 0.3s; padding: 10px 32px; color: #fff; border-radius: 40px; display: flex; justify-content: left; align-items: center; grid-gap: 6px;}
.index_banner .swiper-slide .info .button a:hover{ background: #fff; color: #333;}

.index_banner .swiper-slide .info > *{opacity: 0; transform: translateY(50px); transition: all 1s; }
.index_banner .swiper-slide .info.white h2{color: #fff; }
.index_banner .swiper-slide .info.white h3{color: #fff;}
.index_banner .swiper-slide .info.white p{color: #fff;}
.index_banner .swiper-slide-active .info > * {  opacity: 1; transform: none;}
.index_banner .swiper-slide-active .info > *:nth-child(1) { transition-delay: 0.4s;}
.index_banner .swiper-slide-active .info > *:nth-child(2) { transition-delay: 0.6s;}
.index_banner .swiper-slide-active .info > *:nth-child(3) { transition-delay: 0.8s;}
.index_banner .swiper-slide-active .info > *:nth-child(4) { transition-delay: 2s;}
.index_banner .swiper-button-box{  display: flex; justify-content: right; align-items: center; grid-gap: 20px; width: var(--width); left: 50%; transform: translateX(-50%);  position: absolute; bottom:44px; z-index: 14;}
.index_banner .swiper-button-box .swiper-button-next{ transition-duration: 0.2s; position:initial;background: #fff; color: var(--mc); border-radius: 50%; height:48px; width: 48px; font-size: 24px;}
.index_banner .swiper-button-box .swiper-button-prev{ transition-duration: 0.2s; position:initial;background: #fff; color: var(--mc); border-radius: 50%; height:48px; width: 48px; font-size: 24px;}
.index_banner .swiper-button-box .swiper-button-next:after{display: none!important;}
.index_banner .swiper-button-box .swiper-button-prev:after{display: none!important;}
.index_banner .swiper-pagination {color: #fff; text-align: left; width: var(--width) !important; left: 50% !important; transform: translateX(-50%); }
.index_banner .swiper-pagination{ bottom:40px!important;font-size: 16px;display: flex; justify-content: center; grid-gap: 10px}
.index_banner .swiper-pagination-bullet { background-color: rgba(255, 255, 255, 0.8); opacity: 0.9; border-radius: 3px;  position: relative;  transition-duration: 0.3s; height: 4px; width: 40px; }
.index_banner .swiper-pagination-bullet-active { opacity: 1; background:var(--mc); }
.index_banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {  }



.index_GEO{ background: #f5f7fb; padding-top: 240px; overflow: hidden; }
.index_GEO .pagewidth{ position: relative}
.index_GEO .title{ text-align: center}
.index_GEO .title h2{ font-size: 48px; line-height: 1.2; margin-bottom: 24px;}
.index_GEO .title p{ color: #333}
.index_GEO .title p a{ color: #c90915; display:inline-flex; justify-content: center; align-items: center; grid-gap: 6px;}
.index_GEO .content{ display: grid; grid-template-columns: repeat(5,1fr); grid-gap: 24px; padding-top: 48px;}
.index_GEO .content .item{ border:#ececec solid 1px; background: #fbfcfe; border-radius: 8px; box-shadow: 0px 10px 20px rgba(0,0,0,0.05); padding: 72px 36px; text-align: center;}
.index_GEO .content .item i{ margin: 0 auto; font-size: 56px; line-height: 1;}
.index_GEO .content .item h3{ font-size: 24px; margin-bottom: 12px; font-weight: 500; padding-top: 20px;}
.index_GEO .content .item p{ color: #666;}
.index_GEO .pagewidth .logo{ position: absolute; padding: 6px; border-radius: 120px; background: #fff; overflow: hidden;}
.index_GEO .pagewidth .logo img{ height: 100%; width: 100%;border-radius: 120px;transition-duration: 0.3s;}
.index_GEO .pagewidth .logo.logo_deepseek{ width:100px; height: 100px; left: -80px; top: -100px; z-index: 4;animation: flotage 4s ease-in-out infinite; /* 应用动画 */}
.index_GEO .pagewidth .logo.logo_doubao{ width:80px; height: 80px; right: -50px; top: -100px; z-index: 4;animation: flotage 6s ease-in-out infinite; /* 应用动画 */}
.index_GEO .pagewidth .logo.logo_yuanbao{ width:50px; height: 50px; left: -150px; top: 50px; z-index: 4;animation: flotage 7s ease-in-out infinite; /* 应用动画 */}
.index_GEO .pagewidth .logo.logo_kimi{ width:40px; height: 40px; right: -120px; top: 120px; z-index: 4;animation: flotage 9s ease-in-out infinite; /* 应用动画 */}
.index_GEO .pagewidth .logo.logo_wenxinyiyan{ width:40px; height: 40px; left: -120px; top: 250px; z-index: 4;animation: flotage 6s ease-in-out infinite; /* 应用动画 */}
.index_GEO .pagewidth .logo.logo_baiduaisou{ width:32px; height: 32px; right: -80px; top: 270px; z-index: 4;animation: flotage 5s ease-in-out infinite; /* 应用动画 */}


.index_service .title{ text-align: center}
.index_service .title h2{ font-size: 48px; line-height: 1.2; margin-bottom: 24px;}
.index_service .title p{ color: #333}
.index_service .title p a{ color: #c90915; display:inline-flex; justify-content: center; align-items: center; grid-gap: 6px;}
.index_service .content{ padding-top: 48px;}
.index_service .layui-colla-title{ border:none; background: none; height: 140px; line-height: auto; padding: 0;}
.index_service .layui-colla-title{display: grid; grid-template-columns: 40px 400px auto 52px; align-items: center; grid-gap: 40px;}
.index_service .layui-colla-title span{ font-size: 32px; font-family: 'Barlow';}
.index_service .layui-colla-title h2{font-size: 32px;}
.index_service .layui-colla-title p{ line-height: 1.4; color: #666;}
.index_service .layui-colla-title i{ font-size: 24px; border-radius: 50px; border: #ececec solid 1px; background: #fff; height: 50px; width: 50px; display:flex; justify-content: center; align-items: center; transition-duration: 0.3s;}
.index_service .layui-collapse{border: none; border-top: #eeeeee solid 1px;}
.index_service .layui-colla-content{border: none; position: relative; overflow: hidden}
.index_service .layui-colla-content .bg{ position: absolute; left: 0; bottom:-20%; width: 100%; right:0px; z-index: 1;}
.index_service .layui-colla-item i{ position: relative}
.index_service .layui-colla-item.layui-show .layui-colla-title i{ transform: rotate(180deg); color: #fff; background: linear-gradient(to right, #6320c7, #e42d50);}
.index_service .layui-colla-content{ padding: 0; background: #333; border-radius: 8px; padding: 48px;}
.index_service .layui-colla-content .info{ background:rgba(255,255,255,0.9); border: rgba(255,255,255,0.3) solid 1px; padding: 48px; width: 360px;  border-radius: 6px;-webkit-backdrop-filter:blur(15px); backdrop-filter: blur(15px);z-index: 2; position: relative }
.index_service .layui-colla-content .info h3{ font-size: 48px; font-weight: normal; line-height: 1; margin-bottom: 32px;}
.index_service .layui-colla-content .info p{ margin-bottom: 24px;}
.index_service .layui-colla-content .info .button{ padding-top:48px; display: flex; justify-content: left; align-items: center; grid-gap: 12px; }
.index_service .layui-colla-content .info .button a{transition-duration: 0.3s; padding-left: 20px; padding-right: 20px; border-radius: 40px; display: flex; align-items: center; justify-content: center; grid-gap: 8px; }
.index_service .layui-colla-content .info .button a.chat{ height: 56px; background: linear-gradient(to right, #6320c7, #e42d50); color: #fff;}
.index_service .layui-colla-content .info .button a.more{ height: 54px; border: #ddd solid 1px;  background:#f1f1f1; color: #333;}
.index_service .layui-colla-content .info .button a.chat:hover{filter: brightness(1.15);}
.index_service .layui-colla-content .info.button a.more:hover{filter: brightness(1.06);}


.index_case{ background: #f5f7fb;}
.index_case .title{ text-align: center}
.index_case .title h2{ font-size: 48px; line-height: 1.2; margin-bottom: 24px;}
.index_case .title p{ color: #333}
.index_case .title p a{ color: #c90915; display:inline-flex; justify-content: center; align-items: center; grid-gap: 6px;}
.index_case .content{ padding-top: 48px;}

.index_case .content{ display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 120px 72px;}
.index_case .content .item .img{aspect-ratio: 10/8; overflow: hidden; border-radius: 12px; margin-bottom: 24px;}
.index_case .content .item .img img{ width: 100%; height: 100%; object-fit: cover; transition-duration: 0.3s;}
.index_case .content .item .img:hover img{ transform: scale(1.1);}
.index_case .content .item .info{ padding: 10px;}
.index_case .content .item .info .label_name{display: flex; justify-content: left; grid-gap: 24px; align-items: center;}
.index_case .content .item .info .label_name .lable{ color: #e42d50}
.index_case .content .item .info .label_name .name{ color: #333}
.index_case .content .item .info h2{ font-size: 24px; color: #333; font-weight: normal; line-height: 1; padding-top: 16px; padding-bottom: 32px;}
.index_case .content .item .info .serviceconternt span{ color: #999; background: #fff; font-size: 14px; display: inline-block;  border-radius: 30px; padding:6px 16px;}
.index_case .content .item .info .serviceconternt{ display: flex; justify-content: left; align-items: center; grid-gap: 12px;}


.index_client{ background: #fff;}
.index_client .title{ text-align: center; margin-bottom: 48px;}
.index_client .title h2{ font-size: 48px; line-height: 1.2; margin-bottom: 24px;}
.index_client .title p{ color: #333}
.index_client .title p a{ color: #c90915; display:inline-flex; justify-content: center; align-items: center; grid-gap: 6px;}
.index_client .content{}

.marquee-wrapper {width: 100%;overflow: hidden;position: relative;transform: translateZ(0);will-change: transform; -webkit-mask: linear-gradient(-90deg, transparent 0%, #000 25%, #000 75%, transparent 100%);
    mask: linear-gradient(-90deg, transparent 0%, #000 25%, #000 75%, transparent 100%);}
.marquee-track {display: flex; animation: scroll-left 20s linear infinite; will-change: transform; transform: translate3d(0, 0, 0); grid-gap: 24px;}
.marquee-track2 {animation: scroll-left 40s linear infinite;}
.marquee-track2 .logo-card{ box-shadow: 0px 10px 10px rgba(0,0,0,0.05);}
.marquee-wrapper:hover .marquee-track { animation-play-state: paused; }
.marquee-content {display: flex;align-items: center;gap: 24px;flex-shrink: 0;  margin-bottom: 24px;}
.logo-card {flex-shrink: 0;width: 160px;height: 80px;background: #fff;border: 1px solid #ececec;border-radius: 6px;display: flex;align-items: center;justify-content: center;color: rgba(255, 255, 255, 0.5);font-size: 14px;font-weight: 500;letter-spacing: 1px;transition: all 0.3s ease;backdrop-filter: blur(10px);}
.logo-card img{ height: 50px;}


@keyframes scroll-left {
    0% {
        transform: translate3d(0, 0, 0);
    }
    100% {
        transform: translate3d(-50%, 0, 0);
    }
}


.index_article{ background: #f5f7fb;}
.index_article .title{ text-align: center; margin-bottom: 48px;}
.index_article .title h2{ font-size: 48px; line-height: 1.2; margin-bottom: 24px;}
.index_article .title p{ color: #333}
.index_article .title p a{ color: #c90915; display:inline-flex; justify-content: center; align-items: center; grid-gap: 6px;}


.index_article .content{ display: grid; grid-template-columns: repeat(3, 1fr); background: #fff;border: #ececec solid 1px; padding: 48px; box-shadow: 0px 20px 40px rgba(0,0,0,0.05);}
.index_article .content .item{ position: relative;}
.index_article .content .item:nth-child(1):after{ content: ""; position: absolute; right: 30px; top: 0px; bottom: 0px; height: 100%; width: 1px; background: #dee3ee }
.index_article .content .item:nth-child(2):after{ content: ""; position: absolute; right: 30px; top: 0px; bottom: 0px; height: 100%; width: 1px; background: #dee3ee }
.index_article .content .item h3 i{ position: relative; top: 3px; font-size: 22px; }
.index_article .content .subtitle{ display: flex; justify-content: left; align-items: center; grid-gap: 6px; font-weight: normal; font-size: 24px; color: #111;  margin-bottom: 15px;}
.index_article .content ul li{  line-height: 2.4em; }
.index_article .content ul li a{ color: #333; }
.index_article .content ul li a:hover{ color: #df010e; }















.index_news{background: linear-gradient(180deg, #eff2f7, #fff);}
.index_news .layui-tabs{ display: grid; grid-template-columns:3fr 9fr; grid-gap: var(--gg)}
.index_news .side{ padding-top: 0; padding-bottom: 0;}
.index_news .side .title{ text-align: left; margin-bottom: 48px;}
.index_news .side .title h3{ font-size: 18px; color:var(--sc); font-weight: normal; text-transform: uppercase; margin-bottom: 12px;}
.index_news .side .title h2{ font-size: 56px; color:var(--mc); line-height: 1; text-transform: uppercase; margin-bottom: 24px; }
.index_news .side .title p{ font-size: 20px; color:#666; font-weight: normal; }
.index_news .side .layui-tabs-header{height: auto; width: 120px;}
.index_news .side .layui-tabs-header li{display: flex; justify-content: center; align-items: center; background: #fff; border-radius: 24px; transition-duration: 0.3s; grid-gap: 5px; margin-bottom:15px!important; }
.index_news .side .layui-tabs-header li i{ opacity: 0; visibility: hidden;}
.index_news .side .layui-tabs-header li.layui-this{ justify-content: center; grid-gap:6px; background: var(--sc); color: #fff;}
.index_news .side .layui-tabs-header li.layui-this i{opacity:1; visibility: visible;}
.index_news .side .layui-tabs-header:after, .index_news .side .layui-tabs-scroll:after{ display: none}
.index_news .side .layui-tabs-header .layui-this:after{ display: none}
.index_news .layui-tabs-body{ padding: 0; }


.index_news .content .item{ padding: 16px; border-radius: 16px;background: rgba(255,255,255,0.5); transition-duration: 0.3s; display: grid;grid-template-columns: 160px 100px auto 80px; grid-gap: var(--gg); margin-bottom: 16px; align-items: center;}
.index_news .content .item .img{ width: 100%;aspect-ratio: 1; border-radius: 12px; overflow: hidden;}
.index_news .content .item .img img{ width: 100%; height: 100%; object-fit: cover; transition-duration: 0.3s;}
.index_news .content .item .time{ text-align: center}
.index_news .content .item .time span{ display: block; font-size: 14px; color:#666; font-weight: normal; text-transform: uppercase;}
.index_news .content .item .time p{ display: block; font-size: 14px; color:var(--sc); font-weight: normal; text-transform: uppercase;}
.index_news .content .item .info h2{ line-height: 1.2;}
.index_news .content .item .info h2 a{ color: #333; font-size: 20px; line-height: 1.2; text-decoration-thickness: 2px;  text-underline-offset: 3px;}
.index_news .content .item .info h2 a:hover{ text-decoration: underline}
.index_news .content .item:hover{ background: rgba(255,255,255,1);}
.index_news .content .item .more{ text-align: center;}
.index_news .content .item .more a{ color: var(--sc); font-size: 20px; }
.index_news .content .item:last-child{margin-bottom: 0;}





/*关于*/
.about_content{ padding-top: 240px;}
.about_content .pagewidth{ display: grid;grid-template-columns:auto 40%; grid-gap: 100px; align-items: center}
.about_content .title p{ font-family: 'Barlow'; text-transform: uppercase; font-size: 24px; line-height: 1; margin-bottom: 12px;}
.about_content .title h2{ text-transform: uppercase; font-size: 36px; font-weight: normal; line-height: 1; padding-bottom: 32px; position: relative; margin-bottom: 32px;}
.about_content .title h2::after{content: "";background: linear-gradient(90deg, #e42d50, #6320c7); position: absolute; left: 0px; bottom: 0px; width: 30px; height: 2px; }
.about_content .content h1{ font-weight: normal; font-size: 72px; line-height: 1; margin-bottom: 12px;}
.about_content .content h2{ font-weight: 500; font-size:36px; line-height: 1; margin-bottom: 32px;}
.about_content .content p{  color: #333; line-height: 1.8; margin-bottom: 12px;}
.about_content .img img{ width: 100%;}


.culture_content{ position: relative; overflow: hidden;}
.culture_content .bg{ z-index: -1; position: absolute; left: 0px; right: 0px; width: 100%; top: -20%}
.culture_content .title p{ font-family: 'Barlow'; color: #fff; text-transform: uppercase; font-size: 24px; line-height: 1; margin-bottom: 12px;}
.culture_content .title h2{ text-transform: uppercase; color: #fff; font-size: 36px; font-weight: normal; line-height: 1; padding-bottom: 32px; position: relative; margin-bottom: 32px;}
.culture_content .title h2::after{content: "";background:#fff; position: absolute; left: 0px; bottom: 0px; width: 30px; height: 2px; }
.culture_content .content{ height: 500px; position: relative;}
.culture_content .content h3{ font-size: 72px; color: #fff; line-height: 1.2; position: absolute; left: 0px; bottom: 0px;}


.client_content .pagewidth{ display: grid;grid-template-columns:3fr 1fr 8fr; grid-gap: 32px;}
.client_content .title p{ font-family: 'Barlow'; text-transform: uppercase; font-size: 24px; line-height: 1; margin-bottom: 12px;}
.client_content .title h2{ text-transform: uppercase; font-size: 36px; font-weight: normal; line-height: 1; padding-bottom: 32px; position: relative; margin-bottom: 32px;}
.client_content .title h2::after{content: "";background: linear-gradient(90deg, #e42d50, #6320c7); position: absolute; left: 0px; bottom: 0px; width: 30px; height: 2px; }
.client_content .title .desc{ font-size: 48px; line-height: 1.2;}
.client_content .content{ display: grid; grid-template-columns: repeat(4,1fr); grid-gap: 32px;}
.client_content .content .item{ padding: 16px; border-radius: 6px; border: #ececec solid 1px; box-shadow: 0px 10px 10px rgba(0,0,0,0.05); overflow: hidden}
.client_content .content .item img{ width: 100%}


/*网站建设*/
.web_case_recommend{ padding-top: 240px; }
.web_case_recommend .title{ text-align: center; margin-bottom:80px;}
.web_case_recommend .title h1{ text-align: center; font-size: 72px; font-weight: 500; line-height: 1; margin-bottom: 32px;}
.web_case_recommend .title h2{ font-size: 36px; text-align: center; line-height: 1; }

.web_case_recommend .content { display: grid; grid-template-columns:8fr 4fr; grid-gap: 32px; align-items: center}
.web_case_recommend .content .case_img{ position: relative;}
.web_case_recommend .content .case_img .pc{ width:80%;border: #adbac8 solid 3px; border-radius: 24px; overflow: hidden; }
.web_case_recommend .content .case_img .pc .box{ border: #000 solid 20px; height: 540px; background: #000; overflow: hidden; }
.web_case_recommend .content .case_img .pc img{ width:100%; height: 100%; object-fit: cover; border-radius: 6px;}

.web_case_recommend .content .case_img .mobile{ position: absolute; right: 100px; z-index: 2; bottom: -30px; width:224px;border: #adbac8 solid 2px; border-radius: 32px; overflow: hidden; }
.web_case_recommend .content .case_img .mobile .box{ border: #000 solid 6px; height: 460px; background: #000;overflow: hidden; }
.web_case_recommend .content .case_img .mobile img{ width:100%; height: 100%; object-fit: cover; border-radius: 24px;}


.web_case_recommend .content .case_info h3{ font-size: 48px; line-height: 1; margin-bottom: 32px;}
.web_case_recommend .content .case_info p{ line-height: 1.8em; color: #333;}
.web_case_recommend .content .case_info p a{ color: var(--mc); }
.web_case_recommend .content .case_info .button{ padding-top:48px; display: flex; justify-content: left; align-items: center; grid-gap: 24px; }
.web_case_recommend .content .case_info .button a{transition-duration: 0.3s; padding-left: 30px; padding-right: 30px; border-radius: 40px; display: flex; align-items: center; justify-content: center; grid-gap: 8px; }
.web_case_recommend .content .case_info .button a.chat{ height: 56px; background: linear-gradient(to right, #6320c7, #e42d50); color: #fff;}
.web_case_recommend .content .case_info .button a.more{ height: 54px; border: #ddd solid 1px;  background:#f1f1f1; color: #333;}
.web_case_recommend .content .case_info .button a.chat:hover{filter: brightness(1.15);}
.web_case_recommend .content .case_info .button a.more:hover{filter: brightness(1.06);}




.web_point{ position: relative; overflow: hidden; }
.web_point .bg{ z-index: -1; position: absolute; left: 0px; right: 0px; width: 100%; top: -20%}
.web_point .title{ text-align: center}
.web_point .title p{ font-family: 'Barlow'; color: #fff; text-transform: uppercase; font-size: 24px; line-height: 1; margin-bottom: 12px;}
.web_point .title h2{ text-transform: uppercase; color: #fff; font-size: 36px; font-weight: normal; line-height: 1; padding-bottom: 32px; position: relative; margin-bottom: 32px;}
.web_point .title h2::after{content: "";background:#fff; position: absolute; left: 50%; transform: translateX(-50%); bottom: 0px; width: 30px; height: 2px; }
.web_point .title .desc{ color: #fff; font-size: 60px; font-weight: 500; line-height: 1.2; text-align: center;}

.web_point .content{ padding-top: 120px; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 32px;}
.web_point .content .item{ background:rgba(255,255,255,0.5); border:rgba(255,255,255,0.3) solid 1px; padding: 36px; border-radius: 12px;-webkit-backdrop-filter:blur(15px); backdrop-filter: blur(15px);}
.web_point .content .item i{ font-size: 36px; line-height: 1; margin-bottom: 32px;}
.web_point .content .item h3{ font-size: 32px; font-weight: normal; line-height: 1; margin-bottom: 16px;}
.web_point .content .item p{ line-height: 1.8;}

.web_guarantee .title{ text-align: center; margin-bottom: 48px;}
.web_guarantee .title p{ font-family: 'Barlow'; text-transform: uppercase; font-size: 24px; line-height: 1; margin-bottom: 12px;}
.web_guarantee .title h2{ text-transform: uppercase; font-size: 36px; font-weight: normal; line-height: 1; padding-bottom: 32px; position: relative; margin-bottom: 32px;}
.web_guarantee .title h2::after{content: "";background: linear-gradient(90deg, #e42d50, #6320c7); position: absolute; left: 50%;transform: translateX(-50%); bottom: 0px; width: 30px; height: 2px; }

.web_guarantee .content{ display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 32px;}
.web_guarantee .content .item{ border:#ececec solid 1px; padding: 48px; padding-left: 120px; border-radius: 12px; position: relative; box-shadow: 0px 10px 20px rgba(0,0,0,0.05); overflow: hidden; }
.web_guarantee .content .item i{ font-size: 48px; position: absolute; line-height: 1; margin-bottom: 32px; left: 48px; top: 48px;}
.web_guarantee .content .item h3{ font-size: 32px; font-weight: normal; line-height: 1; margin-bottom: 16px;}
.web_guarantee .content .item p{ line-height: 1.8; color: #333;}



.web_case{background: #f6f8fa;}
.web_case .title{ text-align: center; margin-bottom: 48px;}
.web_case .title p{ font-family: 'Barlow'; text-transform: uppercase; font-size: 24px; line-height: 1; margin-bottom: 12px;}
.web_case .title h2{ text-transform: uppercase; font-size: 36px; font-weight: normal; line-height: 1; padding-bottom: 32px; position: relative; margin-bottom: 32px;}
.web_case .title h2::after{content: "";background: linear-gradient(90deg, #e42d50, #6320c7); position: absolute; left: 50%;transform: translateX(-50%); bottom: 0px; width: 30px; height: 2px; }

.web_case .content{ display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 120px 72px;}
.web_case .content .item .img{aspect-ratio: 10/8; overflow: hidden; border-radius: 12px; margin-bottom: 24px;}
.web_case .content .item .img img{ width: 100%; height: 100%; object-fit: cover; transition-duration: 0.3s;}
.web_case .content .item .img:hover img{ transform: scale(1.1);}
.web_case .content .item .info{ padding: 10px;}
.web_case .content .item .info .label_name{display: flex; justify-content: left; grid-gap: 24px; align-items: center;}
.web_case .content .item .info .label_name .lable{ color: #e42d50}
.web_case .content .item .info .label_name .name{ color: #333}
.web_case .content .item .info h2{ font-size: 24px; color: #333; font-weight: normal; line-height: 1; padding-top: 16px; padding-bottom: 32px;}
.web_case .content .item .info .serviceconternt span{ color: #999; background: #fff; font-size: 14px; display: inline-block;  border-radius: 30px; padding:6px 16px;}
.web_case .content .item .info .serviceconternt{ display: flex; justify-content: left; align-items: center; grid-gap: 12px;}



.web_process{background: #f6f8fa;}
.web_process .title{ text-align: center; margin-bottom: 48px;}
.web_process .title p{ font-family: 'Barlow'; text-transform: uppercase; font-size: 24px; line-height: 1; margin-bottom: 12px;}
.web_process .title h2{ text-transform: uppercase; font-size: 36px; font-weight: normal; line-height: 1; padding-bottom: 32px; position: relative; margin-bottom: 32px;}
.web_process .title h2::after{content: "";background: linear-gradient(90deg, #e42d50, #6320c7); position: absolute; left: 50%;transform: translateX(-50%); bottom: 0px; width: 30px; height: 2px; }
.web_process .content{ display: grid; grid-template-columns: repeat(7, 1fr); grid-gap: 124px; background: url("../images/line.png") no-repeat center 44px; background-size:1480px 153px}
.web_process .content .item .icon{height: 100px; margin-bottom: 24px; width: 100px;display: flex; justify-content: center; align-items: center; border-radius: 100px; background: #fff; border: #ececec solid 1px; box-shadow: 0px 10px 10px rgba(0,0,0,0.05); overflow: hidden}
.web_process .content .item .icon i{ font-size: 48px;}
.web_process .content .item:nth-child(2n){ padding-top: 144px;}
.web_process .content h3{ padding-left: 10px; font-size: 32px; line-height: 1; font-weight: normal; margin-bottom: 16px;}
.web_process .content p{ padding-left: 10px; line-height: 1.8; color: #333;}




/*GEO*/
.geo_banner{ position: relative; overflow: hidden; border-radius: 0px 0px 72px 72px;height: 600px; margin-left: 30px;margin-right: 30px;background: linear-gradient(to bottom, #010214, #44108f ,#bca4f9); }
.geo_banner .info h1{ width: 100%; margin-bottom: 24px;}
.geo_banner .info h1 span{ font-weight: 500; font-size: 72px; line-height: 1.2;}
.geo_banner .info h3{margin-bottom: 56px; line-height: 1; font-size:24px; font-weight: 400;}
.geo_banner .info .button{ display: flex; justify-content: left}
.geo_banner .info .button a{ height: 52px; border: #fff solid 2px; color: #fff; background: rgba(255,255,255,0); transition-duration: 0.3s; padding-left: 30px; padding-right: 30px; border-radius: 40px; display: flex; align-items: center; justify-content: center; grid-gap: 8px; }
.geo_banner .info .button a:hover{background: rgba(255,255,255,1); color: #333;}

.geo_banner .pagewidth{display: grid; grid-template-columns:auto 50%; grid-gap: 32px;}
.geo_banner .pc{ position:absolute; right: 0px; bottom: 0px;}
.geo_banner .pc .logo{ position: absolute; padding: 6px; border-radius: 120px; background: #fff; overflow: hidden;}
.geo_banner .pc .logo img{ height: 100%; width: 100%;border-radius: 120px;transition-duration: 0.3s;}
.geo_banner .pc .logo.logo_deepseek{ width:100px; height: 100px; left:90px; top: -50px; z-index: 4;animation: flotage 4s ease-in-out infinite; /* 应用动画 */}
.geo_banner .pc .logo.logo_doubao{ width:80px; height: 80px; left:300px; top: -100px; z-index: 4;animation: flotage 6s ease-in-out infinite; /* 应用动画 */}
.geo_banner .pc .logo.logo_yuanbao{ width:50px; height: 50px; left: 0px; top: -90px; z-index: 4;animation: flotage 7s ease-in-out infinite; /* 应用动画 */}
.geo_banner .pc .logo.logo_kimi{ width:48px; height: 48px; left: 520px; top: -180px; z-index: 4;animation: flotage 9s ease-in-out infinite; /* 应用动画 */}
.geo_banner .pc .logo.logo_wenxinyiyan{ width:40px; height: 40px; left: -30px; top: 150px; z-index: 4;animation: flotage 6s ease-in-out infinite; /* 应用动画 */}
.geo_banner .pc .logo.logo_baiduaisou{ width:32px; height: 32px; left: 740px; top: -50px; z-index: 4;animation: flotage 5s ease-in-out infinite; /* 应用动画 */}

/* 定义漂浮动画 */
@keyframes flotage { 0% {transform: translateY(0px); } 50% {transform: translateY(-20px);} 100% {transform: translateY(0px);} }

.geo_client .title{ text-align: center; padding-bottom: 72px;}
.geo_client .title h2{ color: #fff; font-size: 24px; font-weight: normal}


.geo_service{background: #100c29; border-radius:72px; margin-left: 30px;margin-right: 30px; position: relative; overflow: hidden;}
.geo_service::after{content: ""; position:absolute; z-index: 1;  width: 1000px; height: 500px; background: #3c0d81; left: 50%; transform: translateX(-50%); top: -40px;filter: blur(300px); -webkit-filter: blur(300px);}

.geo_service .title{ text-align: center; padding-bottom: 72px; position: relative; z-index: 2;}
.geo_service .title h2 span{font-size: 72px; font-weight: normal; line-height: 1; margin-bottom: 32px;}
.geo_service .title p{ font-size: 24px; font-weight: normal; line-height: 1;}
.geo_service .title h2 span,.geo_service .title p{display: inline-block; background: linear-gradient(to right, #f6f7f5,#dcd1fc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;}

.geo_service .content{ position: relative; z-index: 2; display: grid; grid-template-columns: repeat(5,1fr); grid-gap: 32px;}
.geo_service .content .item{transition-duration: 0.4s; border-radius: 24px; background: rgba(0,0,0,0.4);border: #310551 solid 1px; position: relative; overflow: hidden; padding: 48px;padding-top: 96px; text-align: center;}
.geo_service .content .item::after{ content: ""; position: absolute;transform: scale(0.8);  border-radius: 24px; opacity: 0; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, #bba3f9,#5a19b2,#030318);   transition-duration:0.3s}
.geo_service .content .item:hover::after{ opacity: 1;transform: scale(1)}
.geo_service .content .item .icon{ z-index: 2; margin-bottom: 12px;position: relative; top: 0px;transition-duration: 0.3s;}
.geo_service .content .item .icon i{display: inline-block; background: linear-gradient(to right, #f6f7f5,#dcd1fc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent; font-size: 48px;transition-duration: 0.3s;  }

.geo_service .content .item h3{ z-index: 2; position: relative; font-size: 32px; font-weight: normal; line-height: 1.2; margin-bottom: 24px;display: inline-block; background: linear-gradient(to right, #f6f7f5,#dcd1fc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent; position: relative; top: 0px;transition-duration: 0.3s;}

.geo_service .content .item:hover{}
.geo_service .content .item p{display: inline-block; z-index: 2; position: relative;  background: linear-gradient(to right, #f6f7f5,#dcd1fc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent; opacity: 0; color: rgba(255,255,255,0.8); transition-duration: 0.3s;position: relative; top: 0px;}

.geo_service .content .item:hover .icon{  top: -40px;}
.geo_service .content .item:hover h3{ top: -40px; }
.geo_service .content .item:hover p{ opacity: 1; top: -40px;}

.geo_service .subtitle{ text-align: center; padding-top: 48px; padding-bottom: 32px; }
.geo_service .subtitle h2{ font-weight: normal; font-size: 32px;display: inline-block; background: linear-gradient(to right, #f6f7f5,#dcd1fc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;}

.geo_service .subcontent{ padding-left: 10%; padding-right: 10%;}
.geo_service .subcontent{ display: grid; grid-template-columns:repeat(2,1fr); grid-gap: 32px;}
.geo_service .subcontent .item{ color: #fff;  display: flex; justify-content: left; grid-gap: 8px; align-items: center;}
.geo_service .subcontent .item i{ display: inline-block; font-size: 24px; background: linear-gradient(to right, #894ee1,#8a4fe2);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent }



.geo_guaranteed{background: linear-gradient(180deg, #010214 70%, #6226b8 85%,#bca4f9 100%); overflow: hidden; border-radius: 0px 0px 72px 72px; margin-bottom: 30px; margin-left: 30px;margin-right: 30px;}
.geo_guaranteed .title{ text-align: center; padding-bottom: 72px; position: relative; z-index: 2;}
.geo_guaranteed .title h2 span{font-size: 72px; font-weight: normal; line-height: 1; margin-bottom: 32px;}
.geo_guaranteed .title p{ font-size: 24px; font-weight: normal; line-height: 1;}
.geo_guaranteed .title h2 span,.geo_guaranteed .title p{display: inline-block; background: linear-gradient(to right, #f6f7f5,#dcd1fc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;}

.geo_guaranteed .content{ display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 32px;}
.geo_guaranteed .content .item{ position:relative; padding:72px 48px ;transition-duration: 0.3s; padding-left: 120px; border-radius: 24px; position: relative;  overflow: hidden; background: linear-gradient(to bottom, #1a1636,#010214);}
.geo_guaranteed .content .item:hover{ padding:62px 48px 82px 48px; padding-left: 120px;}
.geo_guaranteed .content .item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    opacity: 0.5;
    border-radius: 24px; /* 圆角 */
    padding: 1px; /* 边框粗细 */
    background: linear-gradient(45deg, #342c58, #342c58, #342c58);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: exclude;
}
.geo_guaranteed .content .item i{ z-index: 2; font-size: 48px; display: inline-block; background: linear-gradient(to right, #f6f7f5,#dcd1fc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;position: absolute; transition-duration: 0.3s; line-height: 1; margin-bottom: 32px; left: 48px; top: 72px;}
.geo_guaranteed .content .item:hover i{ top:62px;}

.geo_guaranteed .content .item h3{ position: relative; z-index: 2; font-size: 32px; font-weight: normal; line-height: 1; margin-bottom: 16px;display: inline-block; background: linear-gradient(to right, #f6f7f5,#dcd1fc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;}
.geo_guaranteed .content .item p{ position: relative; z-index: 2; line-height: 1.8; color: rgba(255,255,255,0.7);}

.geo_guaranteed .content .item::after{ content: ""; position: absolute;transform: scale(0.8); z-index: 1;  border-radius: 24px; opacity: 0; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, #bba3f9,#5a19b2,#030318);   transition-duration:0.3s}
.geo_guaranteed .content .item:hover::after{ opacity: 1;transform: scale(1)}

.geo_guaranteed .titlebottom{ text-align: center; padding-top: 150px; }
.geo_guaranteed .titlebottom h2{ margin-bottom: 24px; font-weight: normal}
.geo_guaranteed .titlebottom h2 span{ font-size: 24px; line-height: 1;}
.geo_guaranteed .titlebottom h1{ margin-bottom: 48px;font-weight: 500}
.geo_guaranteed .titlebottom h1 span{ font-size: 72px; line-height: 1;}
.geo_guaranteed .button{ text-align: center;}
.geo_guaranteed .button a{ display: inline-flex; transition-duration: 0.3s; border: #fff solid 2px; color: #fff; background: rgba(255,255,255,0);  justify-content: center; align-items: center; height: 56px; text-align: center; width: 260px; border-radius: 50px;}
.geo_guaranteed .button a:hover{background: rgba(255,255,255,1); color: #333;}



.contact_main{ position: relative; overflow: hidden; padding-top: 240px;}
.contact_main::after{content: ""; position: absolute; right: -400px; top: -400px; z-index: -1; width: 1400px; border-radius: 400px; height: 600px;filter: blur(170px); -webkit-filter: blur(170px); background: linear-gradient(to right, #6320c7, #e42d50);}
.contact_main .pagewidth{display: grid; grid-template-columns: 35% auto; grid-gap: 72px;}

.contact_main .info .title p{ font-family: 'Barlow'; text-transform: uppercase; font-size: 24px; line-height: 1; margin-bottom: 24px;}
.contact_main .info .title{ margin-bottom: 48px;}
.contact_main .info .title .desc{ font-size: 60px; line-height: 1.2;}
.contact_main .info .content .item{ margin-bottom: 48px;}
.contact_main .info .content .item h4{ color: #666666; font-weight: normal; line-height: 1; margin-bottom: 12px;}
.contact_main .info .content .item h2 { font-family: 'Barlow';color: var(--mc); font-size: 28px; line-height: 1.2;margin-bottom: 6px;}
.contact_main .info .content .item p { color: #333;  line-height: 1;}
.contact_main .info .content .item h3 { color: #333; font-size: 20px; line-height: 1.2; font-weight: normal}
.contact_main .info .content .wechat{ border-bottom: #ddd solid 1px; padding-bottom: 50px; margin-bottom: 50px;}

.contact_main .info .content .wechat a{transition-duration: 0.3s; padding-left: 30px; background: #0ac360; color: #fff; padding-right: 30px;height: 56px; border-radius: 40px; display: inline-flex; align-items: center; justify-content: center; grid-gap: 8px; }
.contact_main .info .content .wechat a:hover{filter: brightness(1.1);}
.contact_main .info .content .other{color: #333;}
.contact_main .info .content .other a{ color: var(--mc)}
.contact_main .info .content .other a:hover{ color: var(--sc)}


.contact_main .message{ border-radius: 24px; box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.05); background:rgba(255,255,255,0.4); padding: 60px;}
.contact_main .message .layui-form-label{ float: none; width: 100%; padding-left: 0; padding-right: 0; text-align: left}
.contact_main .message .layui-input-block{ margin-left: 0;}
.contact_main .message .checkbox-item-box{ display: grid;grid-template-columns: repeat(4,1fr); grid-gap: 10px}
.contact_main .message .row{ display: grid; grid-template-columns: repeat(2,1fr); grid-gap: 32px ;}
.layui-form-checkbox>div{font-size:16px;}

.layui-btn-disabled,.layui-btn-disabled:active,.layui-btn-disabled:hover{border-color:#ddd!important;background-color:#ddd!important;color:#f00!important;cursor:not-allowed!important;opacity:1}




.detail_banner{ position: relative;}
.detail_banner:after{content:""; position: absolute;left:0px; right: 0px;bottom: 0px;  width: 100%; height: 80px; background:url("../images/shade1.png") no-repeat; background-size:auto 80px; }
.detail_banner .pagewidth{position: relative; height: 700px;}
.detail_banner img.detailbg{  width: 100%; height: 100%; object-fit: cover; position: absolute; opacity:1; left: 0;right: 0px; top: 0px; bottom: 0px;}
.detail_banner .text{  text-align: left; position: absolute; left: 0px; right: 0px; bottom: 15%; z-index: 2; }
.detail_banner .text h1{ font-size: 60px; line-height: 1; color:#fff; margin-bottom: 20px; text-shadow: 0px 5px 10px rgba(0,78,162,0.3); }
.detail_banner .text h2{ font-size: 24px; line-height: 1; color:#fff;text-transform:uppercase; text-shadow: 0px 5px 10px rgba(0,78,162,0.3); }
.detail_banner .pagewidth .whirl{  display: flex; justify-content: center; align-items: center; width: 100px; height: 100px; border-radius: 100px; background: var(--mc); position: absolute; right:0px; bottom: 0px; z-index: 4;}
.detail_banner .pagewidth .whirl .font{ color: #fff; text-align: center;}
.detail_banner .pagewidth .whirl .font p{ line-height: 1;text-transform:uppercase; font-size: 14px; padding-top:15px;}
.detail_banner .pagewidth .whirl .font i{ font-size: 18px; line-height: 1;}
.detail_banner .pagewidth .whirl::after{ animation: rotate 20s linear infinite; position: absolute; content: ""; width: 150px; height:150px; left: 50%; top: 50%;transform: translate(-50%, -50%) rotate(0deg); background: url("../images/rounden.png") no-repeat center; background-size: 100% 100%;}

@keyframes rotate {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to   { transform: translate(-50%, -50%) rotate(360deg); }
}


.crumbs{ font-size:16px;  padding-top: 190px; padding-bottom: 100px; }
.crumbs i{color:#666; }
.crumbs span{ margin-left:5px;margin-right:5px; }
.crumbs span a{ color:#666; }
.crumbs span a:hover{ color:var(--mc); }
.crumbs span.line{ color:#999; }
.crumbs i:last-child{display: none;}


.page_title{padding-bottom: 100px; padding-top: 190px;}
.page_title .pagewidth{ display: grid; grid-template-columns: 65% 35%; border-bottom: #ddd solid 1px; padding-bottom: 50px; }
.page_title .pagewidth .title h4{ font-size: 24px; text-transform: uppercase; line-height: 1; margin-bottom: 32px;font-family: 'Barlow'; font-weight: 500;}
.page_title .pagewidth .title h1{ font-size: 60px; font-weight: normal; line-height: 1.2;}
.page_title .pagewidth .info{ border-left: #ddd solid 1px; margin-top: 50px;padding-left: 50px; }
.page_title .pagewidth .info h3{ font-weight: normal; font-size:24px; line-height: 1.3; color: #333333; text-transform: uppercase; margin-bottom: 50px;}
.page_title .pagewidth .info .contact a{ grid-gap: 12px; display: flex; color: var(--mc); justify-content: left; align-items: center;  font-size: 18px; line-height: 1; }
.page_title .pagewidth .info .contact a i{ transition-duration: 0.3s; border-radius: 20px; height: 32px; width: 32px; background: linear-gradient(90deg, #6521c5, var(--mc)); color: #fff; display: flex; justify-content: center; align-items: center; }
.page_title .pagewidth .info .contact a:hover i{ transform:rotate(45deg)}
.page_title .pagewidth .info .contact a:hover { color: var(--sc); }


/*案例*/
.list_case{ padding-bottom: 100px;}
.list_case .menu{ display: flex; justify-content: left;align-items: center; grid-gap: 10px; margin-bottom: 50px;}
.list_case .menu span{ color: #666; font-size: 16px;}
.list_case .menu ul{display: flex; justify-content: left; align-items: center; gap: 16px;}
.list_case .menu ul li a{ background: #eff2f7; padding: 10px 32px; display: block; border-radius: 28px; color: #333;}
.list_case .menu ul li a.active{ background:linear-gradient(90deg, #6521c5, var(--mc)); color: #fff;}

.list_case .article-list{ display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 120px 72px;}
.list_case .article-list .item .img{aspect-ratio: 10/8; overflow: hidden; border-radius: 12px; margin-bottom: 24px;}
.list_case .article-list .item .img img{ width: 100%; height: 100%; object-fit: cover; transition-duration: 0.3s}
.list_case .article-list .item .img:hover img{ transform: scale(1.1);}
.list_case .article-list .item .info{ padding: 10px;}
.list_case .article-list .item .info .label_name{display: flex; justify-content: left; grid-gap: 24px; align-items: center;}
.list_case .article-list .item .info .label_name .lable{ color: #e42d50}
.list_case .article-list .item .info .label_name .name{ color: #333}
.list_case .article-list .item .info h2{ font-size: 24px; color: #333; font-weight: normal; line-height: 1; padding-top: 16px; padding-bottom: 32px;}
.list_case .article-list .item .info .serviceconternt span{ color: #999; background: #f6f6f6; font-size: 14px; display: inline-block;  border-radius: 30px; padding:6px 16px;}
.list_case .article-list .item .info .serviceconternt{ display: flex; justify-content: left; align-items: center; grid-gap: 12px;}



.case_banner{ position: relative; }
.case_banner .pagewidth{ position: absolute; left: 50%; height: 100%;transform: translateX(-50%);}
.case_banner .pagewidth .title{ position: absolute; left: 0px; bottom: 100px;}
.case_banner .pagewidth .title h1{ font-weight: normal;  font-size: 72px;  color: #fff; line-height: 1; margin-bottom: 24px;}
.case_banner .pagewidth .title p{ color: #fff;  font-family: 'Barlow'; text-transform: uppercase; font-size: 24px; line-height: 1; }
.case_banner img{ width: 100%;  object-fit: cover;}

.case_info{  padding-top: 90px; padding-bottom: 90px;}
.case_info .pagewidth{ display: grid; grid-template-columns:repeat(2,1fr); color: #fff;}
.case_info .left{ display: flex; justify-content: left;align-items: center;  grid-gap: 150px;}
.case_info .right{ display: flex; justify-content: right;align-items: center;  grid-gap: 150px;}
.case_info span{ font-size: 15px;}
.case_info strong{ font-size: 18px; font-weight: normal}
.case_info strong span{ font-size: 18px; font-weight: normal; margin-right: 20px;}
.case_info .right i{ color: #0acd67; font-size: 18px; margin-right: 5px;}
.case_info .right a{ color: #fff;}
.case_info .right a:hover{ text-decoration: underline}

.case_projectinfo .title{ border-bottom:rgba(255,255,255,0.2) solid 1px; margin-bottom: 60px;}
.case_projectinfo .title h3{ font-size: 24px; font-weight: normal; color:#fff; line-height: 1; padding-bottom: 32px;}
.case_projectinfo .content{ display: grid; grid-template-columns: 40% auto; padding-bottom: 100px;}
.case_projectinfo .content .html p{ font-size: 32px; color: #fff; line-height: 1.4}
.case_projectinfo .content .number{ padding-top: 60px;}
.case_projectinfo .content .number{ display: grid; grid-template-columns:repeat(2,1fr); color: #fff;}
.case_projectinfo .content .number p{ font-size: 16px;}
.case_projectinfo .content .number h4{ font-size: 90px; font-family: 'Barlow'; line-height: 1}
.case_projectinfo .content .number i{ font-size: 36px; color: #0acd67; position: relative; top: -10px;}
.case_projectinfo .content .number sup{ line-height: 1;}

.case_uishow{ height: 720px; position: relative; overflow: hidden; margin-bottom:90px;}
.case_uishow .bg{ position: absolute; left: 0; top:-20%; width: 100%; right:0px;}


.case_diy .title{ border-bottom:rgba(255,255,255,0.2) solid 1px; margin-bottom: 60px;}
.case_diy .title h3{ font-size: 24px; font-weight: normal; color:#fff; line-height: 1; padding-bottom: 32px;}
.case_diy .content{ display: grid; grid-template-columns: 40% auto; padding-bottom: 100px;}
.case_diy .content .html h3{ font-size: 32px; font-weight: normal; color: #fff; line-height: 1.4; margin-bottom: 6px;}
.case_diy .content .html p{ color: #fff;}

.case_diy .content .html .item{ margin-bottom: 24px; position: relative; padding-left: 120px;}
.case_diy .content .html .item .numb{-webkit-text-stroke: 1px #ffffff;color: rgba(0,0,0,0);  text-stroke: 1px #ffffff; font-style:italic; font-size: 120px; font-family: 'Barlow';font-weight: bold; line-height: 1; position: absolute; left: 0; top:-10px;}


.case_listimg{ padding-top: 90px; padding-bottom: 90px; background: #f6f8fa;}
.case_listimg .title{ border-bottom:#ddd solid 1px; margin-bottom: 60px;}
.case_listimg .title h3{ font-size: 24px; font-weight: normal;line-height: 1; padding-bottom: 32px;}
.case_listimg .content{
    column-count: 2; /* 一行2列，想3列就改 3 */
    column-gap: 32px; /* 图片之间的间距 */
}
.case_listimg .content .item img{ width: 100%; margin-bottom: 32px;height: auto; border-radius: 4px;}

.case_listimg .content .item{break-inside: avoid;}


.case_other{padding-top: 90px; padding-bottom: 90px; background: #fff;}
.case_other .title{ border-bottom:#ddd solid 1px; margin-bottom: 60px;}
.case_other .title h3{ font-size: 24px; font-weight: normal;line-height: 1; padding-bottom: 32px;}
.case_other .content{ display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 120px 72px;}
.case_other .content .item .img{aspect-ratio: 10/8; overflow: hidden; border-radius: 12px; margin-bottom: 24px;}
.case_other .content .item .img img{ width: 100%; height: 100%; object-fit: cover; transition-duration: 0.3s}
.case_other .content .item .img:hover img{ transform: scale(1.1);}
.case_other .content .item .info{ padding: 10px;}
.case_other .content .item .info .label_name{display: flex; justify-content: left; grid-gap: 24px; align-items: center;}
.case_other .content .item .info .label_name .lable{ color: #e42d50}
.case_other .content .item .info .label_name .name{ color: #333}
.case_other .content .item .info h2{ font-size: 24px; color: #333; font-weight: normal; line-height: 1; padding-top: 16px; padding-bottom: 32px;}
.case_other .content .item .info .serviceconternt span{ color: #999; background: #f6f6f6; font-size: 14px; display: inline-block;  border-radius: 30px; padding:6px 16px;}
.case_other .content .item .info .serviceconternt{ display: flex; justify-content: left; align-items: center; grid-gap: 12px;}





.case_chat{ height: 400px; position: relative; overflow: hidden; }
.case_chat .text{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2;}
.case_chat .text h4{color:#fff; font-size: 60px; line-height: 1;  margin-bottom: 24px; }
.case_chat .bg{ position: absolute; left: 0; bottom:-20%; width: 100%; right:0px; z-index: 1;}

.case_chat .text .button{ display: flex; justify-content: center}
.case_chat .text .button a{ height: 52px; color: #111; border: #fff solid 2px; background:#fff; transition-duration: 0.3s; padding-left:40px; padding-right: 40px; border-radius: 40px; display: flex; align-items: center; justify-content: center; grid-gap: 8px; }
.case_chat .text .button a:hover{ padding-left: 45px;  padding-right: 45px;}


/*新闻*/
.list_news{ padding-bottom: 100px;}
.list_news .menu{ display: flex; justify-content: left;align-items: center; grid-gap: 10px; margin-bottom: 50px;}
.list_news .menu span{ color: #666; font-size: 16px;}
.list_news .menu ul{display: flex; justify-content: left; align-items: center; gap: 16px;}
.list_news .menu ul li a{ background: #eff2f7; padding: 10px 22px; display: block; border-radius: 28px; color: #333;}
.list_news .menu ul li a.active{ background: var(--mc); color: #fff;}
.list_news .article-list{ display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 32px;}
.list_news .article-list .item{ position: relative; overflow: hidden; transition-duration: 0.3s;margin-bottom: 32px; }
.list_news .article-list .item .time{ text-align: left; position: relative; z-index: 2; margin-bottom: 10px; color: #999; font-size: 14px;}
.list_news .article-list .item .img{ position: relative; z-index: 2; overflow: hidden; aspect-ratio: 16/11; border-radius: 8px;transition-duration: 0.3s; margin-bottom: 20px; }
.list_news .article-list .item .img img{ width: 100%; height: 100%; object-fit: cover; transition-duration: 0.3s;}
.list_news .article-list .item:hover .img img{ transform: scale(1.1)}
.list_news .article-list .item .info{ position: relative; z-index: 3;}
.list_news .article-list .item .info h2{ line-height: 1.2; margin-bottom: 12px; font-size: 20px; }
.list_news .article-list .item .info h2 a{ line-height: 1.2;color: #333;}
.list_news .article-list .item:hover .info h2 a{ background-size: 100% 2px;}
.list_news .article-list .item .info .description{ transition-duration: 0.3s; color: #666; font-size: 16px; line-height: 1.6;display: -webkit-box;  -webkit-line-clamp:2;  -webkit-box-orient: vertical; overflow: hidden;text-overflow: ellipsis;}

.show_news{ padding-bottom: 100px;}
.show_news .pagewidth{ position: relative }
.show_news .pagewidth .back { position: absolute; left: 0; top: 20px;}
.show_news .pagewidth .back  a{ display: block; width: 56px; height: 56px;border:var(--sc) solid 2px; color: var(--sc); font-size: 24px; border-radius: 50px; display: flex; justify-content: center; align-items: center; transition-duration: 0.3s;}
.show_news .pagewidth .back  a:hover{background:var(--sc); color:#fff; text-decoration: none; transform: scale(1.1);}
.show_news .content{ width: 900px; margin: 0 auto; }
.show_news .title{line-height: 1.2; font-size: 36px; margin-bottom:24px; font-weight: 700; }
.show_news .info{border-bottom:#ddd solid 1px; padding-bottom: 32px;font-size: 16px; color: #999; font-size: 14px; }
.show_news .html { padding-top: 32px; padding-bottom: 32px; font-size: 18px; line-height: 1.6}
.show_news .html img{ max-width: 100%; border-radius: 4px; margin-top: 16px; margin-bottom: 16px; }
.show_news .html h3{ font-size: 24px; margin-bottom: 12px;}
.show_news .other{ border-top:#ddd solid 1px; padding-top:30px;}
.show_news .other p{ margin-bottom:10px; color:#333;}
.show_news .other p a{ color:#333; }
.show_news .other p a:hover{color:var(--mc);}
.show_news .other p.left{text-align: left;}
.show_news .other p.right{text-align: left;}

/*单页面*/
.pagecontent h1{font-size:48px;color:#111;margin-bottom:50px;text-align:left; padding-top: 30px;}
.pagecontent h2{font-size:20px;color:#111;margin:25px 0 10px}
.pagecontent p{margin-bottom:12px;font-size:15px;color:#111;}
.pagecontent ul{padding-left:20px;margin-bottom:12px; }
.pagecontent li{margin-bottom:6px; position: relative}
.pagecontent li::after{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: -14px; width: 4px; border-radius: 4px; height: 4px; background: rgba(0, 0, 0, 0.6); }






.show_case .name{ margin-bottom: 24px;}
.show_case .name h1{ text-align: center;  font-size: 32px; }
.show_case .swiper-slide img{ width: 100%;}
.show_case .swiper{ margin-bottom: 32px;border-radius: 4px; overflow: hidden;  }
.show_case .swiper-slide {}
.show_case .swiper-button-next:after{ display: none; }
.show_case .swiper-button-prev:after{ display: none; }
.show_case .swiper-button-next,.show_case .content .swiper-button-prev{ transition-duration: 0.3s; border-radius: 40px; height: 48px; width: 48px; border-radius: 40px; background: var(--mc); color: #fff; display: inline-flex; align-items: center; justify-content: center;  font-size: 24px;}
.show_case .swiper-button-disabled{ opacity: 0;}
.show_case .other{display: flex; justify-content: space-between; align-items: center; background: #f5f6f8;border-radius: 8px; padding: 12px;  }
.show_case .other .left{display: flex;justify-content: left; align-items: center; grid-gap: 24px;}
.show_case .other .right{display: flex;justify-content: right; align-items: center;grid-gap: 24px;}
.show_case .other .right .info{ text-align: right}
.show_case .item .img{ width: 120px; aspect-ratio: 16/11; overflow: hidden;border-radius: 4px;}
.show_case .item .img img{ width: 100%; height: 100%; object-fit: cover; transition-duration: 0.3s;}
.show_case .item .img:hover img{ transform: scale(1.05)}
.show_case .item .info p{ color: #666; font-size: 14px;}
.show_case .item .info h3 a{ color:#333; font-size: 18px; }
.show_case .item .info h3 a:hover{ color:var(--mc);  }


/*招聘有内页*/
.list_job .item{ margin-bottom: 50px;}
.list_job .item .job_title{ display: flex; justify-content: space-between; align-items: center}
.list_job .item .job_title h2 a{ font-size: 20px;}
.list_job .item .job_title h2 a i{ color: #666;}
.list_job .item:hover .job_title h2 a i{ color: var(--mc);}
.list_job .item .job_title span{ color: var(--sc); font-size: 20px;}
.list_job .item .job_info{display: flex; justify-content: space-between; align-items: center; color: #999;}

.show_job .job_info{background: #fbfcfd; padding: 32px; border-radius: 4px; margin-bottom: 32px;}
.show_job .job_info h2{ font-size: 32px; margin-bottom: 16px;}
.show_job .job_info ul{ display: grid; grid-template-columns: repeat(5,1fr); grid-gap:0px var(--gg);}
.show_job .job_info ul li{  color: #666;}
.show_job .subtitle{ color:#111; font-size: 18px; ; position: relative;line-height: 1; padding-bottom: 24px; margin-bottom: 24px;}
.show_job .subtitle::after{ content: ""; width: 20px; height: 2px; background: var(--mc); position: absolute; left: 0px; bottom: 0px;}




#container{ width: 100%; height: 520px; position: relative;}
#container .button-container{ position: absolute; left: 50%;transform: translateX(-50%); bottom: 20px; z-index: 100;}
#container .button-container .layui-btn{background: #fff;color: #666; border: #ddd solid 1px; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);}
#container .button-container .layui-btn.active{background: var(--mc); color: #fff; border:var(--mc) solid 1px;}



@media screen and (max-width: 1920px) {

}

@media screen and (max-width: 1600px) {
    .index_banner .swiper-slide .info h1{ font-size: 60px;}
    .index_banner .swiper-slide .info h2{ font-size: 24px;}
    .index_business .title p{ font-size: 18px;}
    .list_advantage_a .title p{ padding-left:15%;; padding-right: 15%;}

    .list_advantage_b .item .content .img{}
    .list_advantage_b .item .content .img img{  width: 100%; height:100%; object-fit:contain; }
    .list_advantage_b .item .content .info .name{ font-size: 32px;}
    .list_advantage_b .item .content{grid-template-columns: 440px auto; grid-gap: 50px;}


    .list_about .pagewidth{ position: relative; display:  grid; grid-template-columns: auto 200px; grid-gap: 70px;}
    .list_about .main .about_b .box img{ width: 100%;}


    .list_news .article-list .item{ grid-template-columns: 160px 240px auto 80px; grid-gap:var(--gg);margin-bottom: 24px; align-items: center; }






}
@media screen and (max-width: 1440px) {
    .detail_banner .pagewidth{  height: 600px;}
    .padding{ padding-top:120px; padding-bottom:120px;transition-duration: 0.3s; }
    .index_business .title h2{ font-size: 48px;}
    .index_advantage .content .info .title h2{ font-size: 48px;}
    .index_news .side .title h2{ font-size: 48px;}
    .index_about .pagewidth .title h2{ font-size: 48px;}
    .index_about .pagewidth .title{ margin-bottom: 24px;}
    .index_about .pagewidth .content .row{ margin-bottom: 48px;}
    .index_about .pagewidth .content{ font-size: 16px;}
    .index_about .pagewidth .content{ width: 60%;}
    .detail_banner .text h1{ font-size: 48px;}
    .index_business .content .item .name{ font-size: 24px;}
    .list_service_a .content .item .info h3{ font-size: 24px;}
    .list_about .main .about_a .content{ font-size: 16px;}

    .list_about .main .about_b .box{ margin-top:-30px;}
    .index_business .content .item{background: #eff2f7; border:#eff2f7 solid 2px;  position: relative; transition-duration: 0.3s; border-radius: 24px; text-align: center; padding:60px 32px 40px 32px; height: 230px;}
    .index_business .content .item:hover{background: #fff;border:var(--mc) solid 2px; position: relative; border-radius: 24px; text-align: center; padding:40px 32px 40px 32px; height: 250px;}
    .index_business .content .item .icon img{ width: 80px;}
    .index_business .content .item .name{ padding-top: 24px; font-size: 28px; line-height: 1; color: var(--mc); font-weight: 700; text-transform: uppercase; margin-bottom: 20px;}
    .index_business .content .item .desc{ font-size: 16px; color:#666; font-weight: normal; }
    .index_business .content .item .more{ position: absolute; left: 50%; transform: translateX(-50%); bottom: 0px; opacity: 0; visibility: hidden; transition-duration: 0.3s;}
    .index_business .content .item .more a{ color: #fff; background: var(--mc);  font-size: 16px; border-radius: 20px; width: 140px; display: block; height: 40px; display: flex; justify-content: center; align-items: center;  grid-gap: 10px; transition-duration: 0.3s;}
    .index_business .content .item .more a:hover{ width: 150px;}
    .index_business .content .item:hover .more{ position: absolute; left: 50%; transform: translateX(-50%); bottom: -20px; opacity: 1; visibility: initial; }

    .list_advantage_b .item .content{grid-template-columns: 400px auto; grid-gap: 20px;}


    .list_advantage_b{ position: relative; font-size: 22px; padding-top: 0; padding-bottom: 0;}
    .list_advantage_b .item_1{ position: sticky; top: 160px; background: #ebf2f9; margin-bottom: 40px; margin-right: 0px; z-index: 3;}
    .list_advantage_b .item_2{ position: sticky; top: 160px; background: #dae5f2; margin-bottom: 40px; margin-right: 40px; z-index: 3;}
    .list_advantage_b .item_3{ position: sticky; top: 160px; background: #c4d7ea; margin-bottom: 40px; margin-right: 80px; z-index: 3;}
    .list_advantage_b .item_4{ position: sticky; top: 160px;  background: #b1c8e2; margin-bottom: 40px; margin-right: 120px; z-index: 3;}
    .list_advantage_b .item_5{ position: sticky; top: 160px; background: #9ebada; margin-bottom: 40px; margin-right: 160px; z-index: 3;}
    .list_advantage_b .item{ border-radius: 0px 24px 24px 0px; position: sticky}
    .list_advantage_b .item .content{  width:var(--width); margin: 0 auto; position: relative}
    .list_advantage_b .item_2 .content{ right: -20px;}
    .list_advantage_b .item_3 .content{ right: -40px;}
    .list_advantage_b .item_4 .content{ right: -60px;}
    .list_advantage_b .item_5 .content{ right: -80px;}

    .list_advantage_b .item .title { position: absolute; width:40px; right: 0px; top: 20px;}
    .list_advantage_b .item .title .number{ width: 24px; height: 24px; margin: 0 auto; margin-bottom: 12px; line-height: 1; background: var(--mc); border-radius: 18px; color: #fff; font-size: 12px; display: flex; justify-content: center; align-items: center;}
    .list_advantage_b .item .title .name{ color: #333; font-size: 14px; width: 18px; line-height: 1.2; margin: 0 auto;}

}
@media screen and (max-width: 1360px) {

    .list_message .layui-form-checkbox>div{ font-size: 14px;}
    .index_advantage .content .layui-colla-item .layui-colla-content{ font-size: 14px; }
    .index_advantage .content .layui-colla-item .layui-colla-title h2{ font-size: 20px;}
    .index_news .content .item .info h2 a{ font-size: 18px;}
    .index_about .pagewidth { width: auto; padding-left: 80px;}
    .detail_banner .pagewidth{height: 500px;}
    .list_advantage_b{ position: relative; font-size: 22px; padding-top: 0; padding-bottom: 0;}
    .list_advantage_b .item_1{ position: sticky; top: 150px;  background: #ebf2f9; margin-bottom: 40px; margin-right: 0px; z-index: 3;}
    .list_advantage_b .item_2{ position: sticky; top: 150px; background: #dae5f2; margin-bottom: 40px; margin-right: 50px; z-index: 3;}
    .list_advantage_b .item_3{ position: sticky; top: 150px; background: #c4d7ea; margin-bottom: 40px; margin-right: 100px; z-index: 3;}
    .list_advantage_b .item_4{ position: sticky; top: 150px;  background: #b1c8e2; margin-bottom: 40px; margin-right: 150px; z-index: 3;}
    .list_advantage_b .item_5{ position: sticky; top: 150px; background: #9ebada; margin-bottom: 40px; margin-right: 200px; z-index: 3;}
    .list_advantage_b .item .title { position: absolute; width:50px; right: 0px; top: 20px;}
    .list_advantage_b .item .title .number{ width: 28px; height: 28px; margin: 0 auto; margin-bottom: 12px; line-height: 1; background: var(--mc); border-radius: 18px; color: #fff; font-size: 12px; display: flex; justify-content: center; align-items: center;}
    .list_advantage_b .item .title .name{ color: #333; font-size: 14px; width: 18px; line-height: 1.2; margin: 0 auto;}
    .list_advantage_b .item .content{ display:flex; justify-content: right;grid-gap:60px; align-items: center;}
    .list_advantage_b .item .content .info{ padding-left: 80px;}
    .list_advantage_b .item .content .info .number{ width: 48px; height: 48px; margin-bottom: 24px; background: var(--mc); border-radius: 24px; color: #fff; line-height: 1; font-size: 24px; display: flex; justify-content: center; align-items: center;}
    .list_advantage_b .item .content .info .name{ font-size: 32px; margin-bottom: 24px; line-height: 1; color: var(--mc); font-weight: 700;}
    .list_advantage_b .item .content .info .desc{ font-size: 16px; color: #333;text-align: justify}
    .list_advantage_b .item .content .img img{  height: 680px }
    .list_about .main .about_b .content .item .desc{ font-size: 14px;}
    .list_news .article-list .item .info .description{ font-size: 14px;}
    .list_news .article-list .item .info h2 a{ font-size: 20px;}
}
@media screen and (max-width: 1024px) {


}
@media screen and (max-width: 720px) {

    .padding{ padding-top:60px; padding-bottom:60px;}
    .index_banner{ overflow: hidden;}
    .index_banner .swiper-slide .info{left: 20px; width: auto; right: 20px; transform: translateY(-50%); top: 60%;}
    .index_banner .swiper-slide .info h1{ font-size: 28px;}
    .index_banner .swiper-slide .info h2{ font-size: 16px; line-height: 1.4;}
    .index_banner .swiper{height: 50vh}
    .index_banner .whirl{ display: none;}
    .index_business .title h3{ font-size: 14px;}
    .index_business .title h2{ font-size: 32px;}
    .index_business .title p{ font-size: 14px;}
    .index_business .content{ grid-template-columns: repeat(1,1fr);}
    .index_business .content .item{ height: 220px;}
    .index_business .content .item:hover{ height: 240px;}
    .index_business .content .item .more{ margin-bottom: 20px; opacity: 1;visibility: visible}
    .index_business .content .item:hover .more { bottom: 20px;}

    .index_advantage:after{ display: none}
    .index_advantage .content{ display: grid; grid-gap: 24px; grid-template-columns: repeat(1,1fr)}
    .index_advantage .content .img{}


    .index_news .layui-tabs{ display: block;}
    .index_news .side .layui-tabs-header{ width: auto;}
    .index_news .side .layui-tabs-header{ display: grid; grid-template-columns: repeat(2,1fr); grid-gap: 0px var(--gg)}
    .index_business .title{ margin-bottom: 16px;}

    .index_advantage .content .info .title{ margin-bottom: 16px;}
    .index_advantage .content .info .title h3{ font-size: 14px;}
    .index_advantage .content .info .title h2{ font-size: 32px;}

    .index_news .side .title{ margin-bottom: 16px;}
    .index_news .side .title h3{ font-size: 14px;}
    .index_news .side .title h2{ font-size: 32px; }
    .index_news .content .item{ display: block; grid-template-columns: repeat(1,1fr)}
    .index_news .content .item .img{ aspect-ratio: 10/7; margin-bottom: 12px;}
    .index_news .content .item .time p{ display: none}
    .index_news .content .item .time{ text-align: left; margin-bottom: 12px;}
    .index_news .content .item .more{ display: none}

    .index_about{ margin-left: 0; margin-right: 0; border-radius: 0;}
    .index_about .pagewidth{ padding: 50px 20px}
    .index_about .pagewidth .title h3{ font-size: 14px;}
    .index_about .pagewidth .title h2{ font-size: 32px;}
    .index_about .pagewidth .content{ width: auto;}
    .index_about .pagewidth .content .row{ display: block; text-align: left; margin-bottom: 24px;}
    .index_about .pagewidth .content .row .item{ text-align: left; margin-bottom: 12px;}

    .detail_banner .pagewidth{ height: 320px;}
    .detail_banner .pagewidth .whirl{ display: none}
    .detail_banner .text h1{ font-size: 32px;}
    .detail_banner .text h2{ font-size: 16px;}

    .list_service_a .title h2{ font-size: 32px; line-height: 1.4}
    .list_service_a .title p{ padding-left: 0; padding-right: 0;}
    .list_service_a .content{ grid-template-columns: repeat(1,1fr)}
    .list_service_a .content .item{ padding: 32px; grid-gap: var(--gg)}
    .list_service_a .content .item{ grid-template-columns: repeat(1,1fr);}
    .list_service_a .content .item .img img{ width: 72px; margin: 0 auto;}

    .list_service_a .content .item .img{ text-align: center}

    .list_service_b .title h2{font-size: 32px;}
    .list_service_b .content .item{ padding: 20px; grid-template-columns: repeat(1,1fr); grid-gap: var(--gg)}
    .list_service_b .content .item .info .desc{ font-size: 14px;}
    .list_service_b .content .item .img{ border-radius: 12px;}
    .list_service_b .content .item:nth-child(2n){ grid-template-columns: repeat(1,1fr); grid-gap: var(--gg)}
    .list_service_b .content .item:nth-child(2n) .img{ order: 2; }
    .list_service_b .content .item:nth-child(2n) .info{ order: 1}

    .list_advantage_b{padding-top: 0px!important; padding-bottom: 0!important;}
    .list_advantage_a{ padding-bottom: 0!important; }
    .list_advantage_a .title h2{font-size: 32px;}
    .list_advantage_a .title p{ padding-left: 0; padding-right: 0;}



    .list_advantage_b .item_1{ position: initial; top: 200px;  background: #ebf2f9; margin-bottom: 24px; margin-right: 0px; z-index: 3;}
    .list_advantage_b .item_2{ position: initial; top: 200px; background: #dae5f2; margin-bottom: 24px; margin-right: 0px; z-index: 3;}
    .list_advantage_b .item_3{ position: initial; top: 200px; background: #c4d7ea; margin-bottom: 24px; margin-right: 0px; z-index: 3;}
    .list_advantage_b .item_4{ position: initial; top: 200px;  background: #b1c8e2; margin-bottom: 24px; margin-right: 0px; z-index: 3;}
    .list_advantage_b .item_5{ position: initial; top: 200px; background: #9ebada; margin-bottom: 24px; margin-right: 0px; z-index: 3;}
    .list_advantage_b .item .title{ display: none}


    .list_advantage_b .item .content{ display: block;}

    .list_advantage_b .item .content .info{ padding: 20px;}
    .list_advantage_b .item .content .img img{ height: auto; width: 100%;}
    .list_advantage_b .item .content .info .name{ font-size: 24px;}
    .list_advantage_b .item .content .info .desc{ font-size: 14px;}


    .list_about .side{ display: none;}
    .list_about .pagewidth{ display: block;}
    .list_about .main .about_a .title h3{ font-size: 12px; margin-bottom: 0;}
    .list_about .main .about_a .title h2{ font-size: 24px; margin-bottom: 16px;}
    .list_about .main .about_a .content{ font-size: 14px;}
    .list_about .main .about_a .content .row{ padding: 20px; grid-template-columns: repeat(1,1fr); grid-gap: var(--gg) }
    .list_about .main .about_a .content .row .item{ text-align: left}
    .list_about .main .about_b .title h3{ font-size: 12px; margin-bottom: 0;}
    .list_about .main .about_b .title h2{ font-size: 24px; margin-bottom: 16px;}
    .list_about .main .about_b .box{ margin-top: 0;}
    .list_about .main .about_b .box img{ display: none}
    .list_about .main .about_b .content{ position: initial;}
    .list_about .main .about_b .content{ grid-template-columns: repeat(1,1fr); padding-left: 0; padding-right: 0;}
    .list_about .main .about_b .content .item{ height: auto!important; display:grid; grid-template-columns: auto auto 50%; grid-gap: var(--gg) ; align-items: center;}
    .list_about .main .about_b .content .item h3{ order:2; font-size: 18px;}
    .list_about .main .about_b .content .item .year { order:1; position: initial; font-size: 16px;}
    .list_about .main .about_b .content .item .desc{ order: 3;}
    .list_news .menu{ display: block}
    .list_news .menu ul{ display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: var(--gg); }
    .list_news .menu ul li{ text-align: center}
    .list_news .menu span{ display: none}

    .list_news .article-list .item{ display: grid; grid-template-columns: repeat(1, 1fr); grid-gap: var(--gg); }
    .list_news .article-list .item .img{ order: 1;}
    .list_news .article-list .item .time{ order: 2;  display: flex; }
    .list_news .article-list .item .time .top{order: 2; font-size: 14px;}
    .list_news .article-list .item .time .top::before{content: "-"}
    .list_news .article-list .item .time .bottom{order: 1; font-size: 14px;}
    .list_news .article-list .item .info{ order:3;}
    .list_news .article-list .item .more{ display: none}

    .list_partner .article-list{ display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: var(--gg); }

    .list_contact_1 .content{ grid-template-columns: repeat(1, 1fr); grid-gap: var(--gg); }
    .list_contact_1 .content .item .info{ padding: 20px;}
    .list_contact_1 .content .item .info h3{ font-size: 24px;}


    .list_contact_1  .title h3{ font-size: 12px; margin-bottom: 0;}
    .list_contact_1  .title h2{ font-size: 24px; margin-bottom: 16px;}

    .list_contact_2  .title h3{ font-size: 12px; margin-bottom: 0;}
    .list_contact_2  .title h2{ font-size: 24px; margin-bottom: 16px;}
    .list_contact_2 .content .row{grid-template-columns: repeat(1, 1fr); }
    .list_contact_2 .content  .layui-form-checkbox>div{ font-size: 14px;}
    .list_contact_2 .content .layui-input{ font-size: 14px; height: 56px;}
    .list_contact_2 .content .layui-textarea{ font-size: 14px; padding: 15px}
    .list_contact_2 .content .row-button{grid-template-columns: repeat(1, 1fr);grid-gap: var(--gg); }


    .show_news .pagewidth .back{ display:none;}
    .show_news .content{ width: auto;}
    .show_news .title{ font-size: 24px;}
    .show_news .info{ font-size: 14px;}
    .show_news .html h3{ font-size: 18px;}
    .list_advantage_b .item .content{ display: block; right: 0;}
    .list_advantage_b .item .content .img{ height: 90%; width: 90%; margin: 0 auto;}
    .pagecontent h1{font-size:32px; padding-top: 50px;margin-bottom: 30px;}


}

/*小尺寸手机*/
@media screen and (max-width: 320px) {

}
/*横屏*/
@media all and (orientation : landscape) {}
/*竖屏*/
@media all and (orientation : portrait){}