style: 调整多个页面的样式,优化布局和响应式设计

调整了多个页面的样式,包括间距、字体大小、背景颜色等,以优化布局和响应式设计。具体修改包括:
- 调整了 `.box_1` 在移动设备下的高度。
- 修改了 `.bottom_imgss` 的背景颜色。
- 在 `AppFooter` 组件中添加了分隔线并调整了背景颜色。
- 优化了 `phone_index.vue` 中的边距和高度设置。
- 在 `phone_concatUs.vue` 中调整了 padding 和背景颜色。
- 在 `phone_info/[id].vue` 中优化了标题和内容的边距。
- 在 `phone_societyDuty.vue` 和 `phone_societyDutyNew.vue` 中添加了顶部导航栏和分隔线。
- 在 `phone_aboutUs.vue` 中调整了文本对齐方式和边距。
- 在 `phone_proServices_con.vue` 和 `phone_proServices.vue` 中优化了布局和样式。

这些修改旨在提升用户体验和界面一致性。
This commit is contained in:
王创世 2025-05-24 10:44:22 +08:00
parent c6c977e4d0
commit 9bf2ef8ed5
11 changed files with 154 additions and 101 deletions

View File

@ -16,6 +16,11 @@
height: 90px; height: 90px;
justify-content: center; justify-content: center;
} }
@media screen and (max-width: 786px) {
.box_1 {
height: 60px;
}
}
.image_1 { .image_1 {
width: 154px; width: 154px;

View File

@ -45,6 +45,7 @@
<!-- 移动端布局 --> <!-- 移动端布局 -->
<div class="mobile-footer flex-col"> <div class="mobile-footer flex-col">
<div style="background-color: #eeeeee;width:100%;height: 0.5px;margin-bottom: 20px;"></div>
<div class="mobile-nav flex-col"> <div class="mobile-nav flex-col">
<span class="mobile-nav-item">企业首页</span> <span class="mobile-nav-item">企业首页</span>
<span class="mobile-nav-item">产品&amp;服务</span> <span class="mobile-nav-item">产品&amp;服务</span>
@ -87,8 +88,7 @@
.mobile-footer { .mobile-footer {
display: flex; display: flex;
padding: 20px; background-color: #ffffff;
background-color: #f8f8f8;
width: 100%; width: 100%;
} }

View File

@ -29,15 +29,15 @@
</span> </span>
</div> </div>
<span class="text_top_12" style="height: auto;font-size: 14px;margin-top: 20px;"> <span class="text_top_12" style="text-align: justify;height: auto;font-size: 16px;margin-top: 20px;">
洛阳灵睿网络技术有限公司成立于2006年深耕互联网行业专注智慧信息化与数字内容服务领域19年是集技术研发创意策划全媒体运营于一体的高新技术企业公司以技术赋能场景内容驱动价值为核心使命专注于为大型公立医院教育机构企事业单位品牌营销策略提供一站式智慧化解决方案与品牌数字化升级服务助力客户实现效率提升品牌增值与精准传播 洛阳灵睿网络技术有限公司成立于2006年深耕互联网行业专注智慧信息化与数字内容服务领域19年是集技术研发创意策划全媒体运营于一体的高新技术企业公司以技术赋能场景内容驱动价值为核心使命专注于为大型公立医院教育机构企事业单位品牌营销策略提供一站式智慧化解决方案与品牌数字化升级服务助力客户实现效率提升品牌增值与精准传播
</span> </span>
<span class="textss13"> <span class="textss13" style="text-align: justify;font-size: 16px;">
专注互联网领域发散新媒体创思执着深耕口碑服务扎实落地品牌内容共创新信息化与内容服务业态 专注互联网领域发散新媒体创思执着深耕口碑服务扎实落地品牌内容共创新信息化与内容服务业态
</span> </span>
<div class="group_28 flex-row justify-between numberTopBox" <div class="group_28 flex-row justify-between numberTopBox"
style="width: 100%;text-align: center;"> style="width: 100%;text-align: center;margin-top: 30px;">
<div class="text-group_9 flex-col justify-between" style="width: auto;height: 80px;"> <div class="text-group_9 flex-col justify-between" style="width: auto;height: 70px;">
<div class="text_55" style="font-size: 28px;text-align: center;width: auto;"> <div class="text_55" style="font-size: 28px;text-align: center;width: auto;">
<n-number-animation :duration="5000" ref="numberAnimationInstRef" :active="false" <n-number-animation :duration="5000" ref="numberAnimationInstRef" :active="false"
:from="0" :to="1000"></n-number-animation> :from="0" :to="1000"></n-number-animation>
@ -47,7 +47,7 @@
</div> </div>
<div class="text-group_10 flex-col justify-between" style="width: auto;height: 80px;"> <div class="text-group_10 flex-col justify-between" style="width: auto;height: 70px;">
<div class="text_58" style="font-size: 28px;text-align: center;width: auto;"> <div class="text_58" style="font-size: 28px;text-align: center;width: auto;">
<n-number-animation :duration="5000" ref="numberAnimationInstRefKH" :active="false" <n-number-animation :duration="5000" ref="numberAnimationInstRefKH" :active="false"
:from="0" :to="19"></n-number-animation> :from="0" :to="19"></n-number-animation>
@ -56,7 +56,7 @@
<span class="">技术沉淀</span> <span class="">技术沉淀</span>
</div> </div>
<div class="text-group_11 flex-col justify-between" style="width: auto;height: 80px;"> <div class="text-group_11 flex-col justify-between" style="width: auto;height: 70px;">
<div class="text_61" style="font-size: 28px;text-align: center;width: auto;"> <div class="text_61" style="font-size: 28px;text-align: center;width: auto;">
<n-number-animation :duration="5000" ref="numberAnimationInstRefJS" :active="false" <n-number-animation :duration="5000" ref="numberAnimationInstRefJS" :active="false"
:from="0" :to="100"></n-number-animation> :from="0" :to="100"></n-number-animation>
@ -66,7 +66,7 @@
</div> </div>
<div class="text-group_12 flex-col justify-between" style="width: auto;height: 80px;"> <div class="text-group_12 flex-col justify-between" style="width: auto;height: 70px;">
<div class="text_64" style="font-size: 28px;text-align: center;width: auto;"> <div class="text_64" style="font-size: 28px;text-align: center;width: auto;">
<n-number-animation :duration="5000" ref="numberAnimationInstRefHY" :active="false" <n-number-animation :duration="5000" ref="numberAnimationInstRefHY" :active="false"
:from="0" :to="30"></n-number-animation> :from="0" :to="30"></n-number-animation>
@ -98,29 +98,29 @@
</div> </div>
<div class="group_2 flex-col"> <div class="group_2 flex-col">
<div class="box_2 flex-col"> <div class="box_2 flex-col">
<div class="group_3 flex-row justify-center align-center" <div class="group_3 "
style="background: #F8F8F8;flex-wrap: wrap;padding:40px 20px;"> style="background: #F8F8F8;flex-wrap: wrap;padding:40px 20px;">
<div class="group_4 flex-col leftBox" style="width: 100%;"> <div class="group_4 leftBox" style="width: 100%;">
<div class="text-group_1 flex-col justify-between" style="width: 100%;height: auto;"> <div class="text-group_1 justify-between" style="width: 100%;height: auto;">
<span class="text_7" style="position: relative;margin: 0 auto;width: auto;"> <span class="text_7" style="position: relative;margin: 0px auto;width: auto;">
睿创团队介绍 睿创团队介绍
<img :src="`${cdnUrl}/img/about/xing.png`" alt="" <img :src="`${cdnUrl}/img/about/xing.png`" alt=""
style="position: absolute;top: -10px; right: -30px;" /> style="position: absolute;top: -10px; right: -30px;" />
</span> </span>
</div> </div>
<span class="text_12" style="width: 100%;;height: auto;font-size: 14px;"> <div class="text_12" style="text-align: justify;width: 100%;;height: auto;font-size: 16px;padding-top: 10px;">
灵睿基因一直是一群年轻的青年人组成我们致力打造专业的团队化运营模式集合程序猿设计狗运营喵的创作者联盟年轻不是资本敢重新定义年轻才是在互联网领域我们致力做一支专业积极上进的年轻团队80后主导90后主力00后紧随为客户创造价值 用互联网思维打造品牌为使命正直诚信实干勇敢协作共赢创业精神为价值观努力发展破茧成蝶 灵睿基因一直是一群年轻的青年人组成我们致力打造专业的团队化运营模式集合程序猿设计狗运营喵的创作者联盟年轻不是资本敢重新定义年轻才是在互联网领域我们致力做一支专业积极上进的年轻团队80后主导90后主力00后紧随为客户创造价值 用互联网思维打造品牌为使命正直诚信实干勇敢协作共赢创业精神为价值观努力发展破茧成蝶
</span> </div>
</div> </div>
<div class="group_5 flex-col justify-center align-center rightBox" style="width: 100%;"> <div class="group_5 rightBox" style="width: 100%;margin-top: 30px;">
<div class="flex-col section_1sb"></div> <div class="flex-col section_1sb"></div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="box_7 flex-col"> <div class="box_7 flex-col">
<span class="text_24 topBox">著作权和荣誉证书</span> <span class="text_24 topBox" style="margin: 40px 0px 10px 0px;">著作权和荣誉证书</span>
<span class="text_15 topBox">Company&nbsp;environment</span> <span class="text_15 topBox">Company&nbsp;environment</span>
<div class="dswper" style="margin-top: 30px;width: 100%;"> <div class="dswper" style="margin-top: 30px;width: 100%;">
<swiper ref="swiper_exp" :slidesPerView="2" loop :loopedSlides="2" :autoplay="{ delay: 2000 }" <swiper ref="swiper_exp" :slidesPerView="2" loop :loopedSlides="2" :autoplay="{ delay: 2000 }"
@ -129,7 +129,7 @@
<img :src="`/img/about/${item}.jpg`" style="width: 100%;"> <img :src="`/img/about/${item}.jpg`" style="width: 100%;">
</swiper-slide> </swiper-slide>
</swiper> </swiper>
<div class="rongyu_cla flex-row justify-center align-center absolute w-full" style="gap: 30px;"> <div class="rongyu_cla flex-row justify-center align-center absolute w-full" style="gap: 10px;">
<div v-for="(_, index) in 3" :key="index" style="width: 25px; height: 5px;" <div v-for="(_, index) in 3" :key="index" style="width: 25px; height: 5px;"
:style="{ backgroundColor: activeSlideIndex === index ? '#fc7428' : '#C1C1C1' }"> :style="{ backgroundColor: activeSlideIndex === index ? '#fc7428' : '#C1C1C1' }">
</div> </div>
@ -346,7 +346,7 @@ const animate = () => {
border-radius: 0px 0px 0px 0px; border-radius: 0px 0px 0px 0px;
align-items: center; align-items: center;
margin: 0 auto; margin: 0 auto;
margin-bottom: 70px; margin-bottom: 40px;
.spanst { .spanst {
height: 32px; height: 32px;
@ -381,11 +381,11 @@ const animate = () => {
.box_7 { .box_7 {
background: var(--ruanzhu) 100% no-repeat; background: var(--ruanzhu) 100% no-repeat;
height: 512px; height: 458px;
} }
.rongyu_cla { .rongyu_cla {
margin-top: 50px; margin-top: 30px;
} }
.text_top_12 { .text_top_12 {

View File

@ -13,7 +13,7 @@
</div> </div>
<div class="group_2 flex-col" > <div class="group_2 flex-col" >
<div class="box_2 flex-col"> <div class="box_2 flex-col">
<div class="group_3 flex-wrap" style="padding: 20px;"> <div class="group_3 flex-wrap" style="padding:20px 20px 40px 20px;">
<div class="group_5 flex-col justify-center align-center rightBox" style="width: 100%;"> <div class="group_5 flex-col justify-center align-center rightBox" style="width: 100%;">
<div class="section_1s flex-col"></div> <div class="section_1s flex-col"></div>
</div> </div>
@ -41,7 +41,7 @@
</div> </div>
<div class="box_17s flex-col" style="overflow: hidden;"> <div class="box_17s flex-col" style="overflow: hidden;">
<span class="text_53" style="margin-top: 30px">热门岗位</span> <span class="text_53" style="margin-top: 40px">热门岗位</span>
<span class="text_54" style="margin-top: 20px;">Company&nbsp;environment</span> <span class="text_54" style="margin-top: 20px;">Company&nbsp;environment</span>
<div class="hbform"> <div class="hbform">
<div class="flex boxgs"> <div class="flex boxgs">
@ -365,6 +365,7 @@ const animate = () => {
@media (max-width: 768px) { @media (max-width: 768px) {
.group_3 { .group_3 {
background: #ffffff;
gap: 0px; gap: 0px;
height: 100%; height: 100%;
} }

View File

@ -136,7 +136,7 @@ const animate = () => {
} }
.bottom_imgss { .bottom_imgss {
background: var(--bg-s); background: #f7f7f7;
background-repeat:no-repeat; background-repeat:no-repeat;
height: auto; height: auto;
background-size: 100% 100%; background-size: 100% 100%;

View File

@ -277,7 +277,7 @@
<div class="text-wrapper_10"> <div class="text-wrapper_10">
<span class="text_41">新闻动态</span> <span class="text_41">新闻动态</span>
</div> </div>
<div class="text-wrapper_11"> <div class="text-wrapper_11" style="margin-bottom: 20px;">
<span class="text_42">news information</span> <span class="text_42">news information</span>
</div> </div>
<div v-for="item in newsList"> <div v-for="item in newsList">
@ -782,7 +782,7 @@ const openUrl = (id: number) => {
.group_7 { .group_7 {
padding: 10px !important; padding: 10px !important;
margin: 0px 0 !important; margin: 0px 0 !important;
height: auto!important; height: 100%!important;
} }
.text-group_3{ .text-group_3{
height: auto; height: auto;
@ -793,9 +793,12 @@ const openUrl = (id: number) => {
.image-wrapper_5 { .image-wrapper_5 {
width: 40px !important; width: 40px !important;
height: 40px !important; height: 40px !important;
margin-right: 10px !important; margin-top: 0px;
margin-right: 20px !important;
}
.text-group_3_3{
height: auto;
} }
.text-group_3, .text-group_3_3 { .text-group_3, .text-group_3_3 {
flex: 1 !important; flex: 1 !important;
} }
@ -822,6 +825,7 @@ const openUrl = (id: number) => {
.text_19{ .text_19{
width: 100%; width: 100%;
line-height: 25px; line-height: 25px;
height: auto;
} }
.box_12{ .box_12{
height: 100%; height: 100%;

View File

@ -1,12 +1,13 @@
<template> <template>
<div style="width: 100%;"> <div style="width: 100%;">
<div style="height:90px;background-color: #ffffff;"></div> <div style="height:60px;background-color: #ffffff;"></div>
<div style="background-color: #eeeeee;width:100%;height: 0.5px;"></div>
<div style="background-color: #F8F8F8;"> <div style="background-color: #F8F8F8;">
<div class="content_class" style=""> <div class="content_class" style="">
<div style="font-size: 20px;font-weight: 700;color: #323232;">{{ info.title }}</div> <div style="font-size: 20px;font-weight: 700;color: #323232;">{{ info.title }}</div>
<div style="font-size: 14px;font-weight: 400;margin-top: 30px;color: #768597;"> <div style="font-size: 14px;font-weight: 400;margin-top: 15px;color: #768597;">
<div>布人{{ info.author }}</div> <div>&nbsp;&nbsp;&nbsp;&nbsp;{{ info.author }}</div>
<div>发布时间{{ info.release_time_text }} </div> <div style="margin-top: 5px;">发布时间{{ info.release_time_text }} </div>
</div> </div>
<div style="width: 100%;margin:20px 0px 0px 0px;height: 1px;background-color: #EEEEEE;"></div> <div style="width: 100%;margin:20px 0px 0px 0px;height: 1px;background-color: #EEEEEE;"></div>
<div class="info_content" v-html="info.content"></div> <div class="info_content" v-html="info.content"></div>
@ -65,6 +66,7 @@ const delWeb = () => {
.info_content { .info_content {
line-height: 28px; line-height: 28px;
text-align: justify!important;
} }
.content_class { .content_class {

View File

@ -13,23 +13,24 @@
</div> </div>
<div class="group_2 flex-col" <div class="group_2 flex-col"
style="background-color: #ffffff;overflow: unset;position: relative;height: 100%;"> style="background-color: #ffffff;overflow: unset;position: relative;height: 100%;">
<img :src="`${cdnUrl}/img/service_01.png`" style="width: 100%;position: absolute;top: -26px;z-index: 10;"> <!-- <img :src="`${cdnUrl}/img/service_01.png`" style="width: 100%;position: absolute;top: -26px;z-index: 10;"> -->
<div class="service_top1"> <div class="service_top1">
<NuxtLink to="/phone_proServices_con/" style="cursor: pointer;width: 50%;text-align: center;"> <NuxtLink to="/phone_proServices_con/" style="cursor: pointer;width: 50%;text-align: center;">
<div> <div style="color: #999999;">
内容创作与运营 内容创作与运营
</div> </div>
</NuxtLink> </NuxtLink>
<div style="cursor: pointer;width: 50%;text-align: center;"> <div style="cursor: pointer;width: 50%;text-align: center;">
<div style="color: #0256FF;margin-bottom: 10px;">专业技术服务</div> <div style="color: #0256FF;margin-bottom: 10px;font-weight: 600;">专业技术服务</div>
<div style="background-color: #0256FF;width:20%;height: 8px;margin: 0 auto;"></div> <div style="background-color: #0256FF;width:20%;height: 4px;margin: 0 auto;"></div>
</div> </div>
</div> </div>
<div style="background-color: #eeeeee;width:100%;height: 0.5px;"></div>
<div class="service-01" style="text-align: center;padding: 30px 20px 20px 20px;z-index: 30;"> <div class="service-01" style="text-align: center;padding: 30px 20px 20px 20px;z-index: 30;">
<div style="font-size: 34px;font-weight: 700;">AI应用定制化开发</div> <div style="font-size: 34px;font-weight: 700;">AI应用定制化开发</div>
<div style="color: #768597;font-size: 16px;margin-top: 30px;">精准赋能行业创新深度定制AI解决方案驱动企业智能升级</div> <div style="color: #768597;font-size: 14px;margin-top: 10px;">精准赋能行业创新深度定制AI解决方案驱动</div>
</div> </div>
<div style="padding: 30px 20px 20px 20px;z-index: 30;"> <div style="padding: 20px 20px 20px 20px;z-index: 30;">
<div style="display: flex;flex-direction: column;justify-content: center;width: 100%;gap: 30px;"> <div style="display: flex;flex-direction: column;justify-content: center;width: 100%;gap: 30px;">
<div class="service_top1_width"> <div class="service_top1_width">
<div class="reveal-left" style="display: flex;flex-direction: row;align-items: center;"> <div class="reveal-left" style="display: flex;flex-direction: row;align-items: center;">
@ -39,11 +40,11 @@
<div style="font-size: 18px;font-weight: 700;margin-left: 10px;">项目介绍和业务描述</div> <div style="font-size: 18px;font-weight: 700;margin-left: 10px;">项目介绍和业务描述</div>
</div> </div>
<div class="reveal-left" <div class="reveal-left"
style="line-height: 24px;margin-top: 20px;font-size: 14px;font-weight: 400;color: #768597;"> style="text-align: justify;line-height: 24px;margin-top: 20px;font-size: 16px;font-weight: 400;color: #768597;">
我们紧跟人工智能发展浪潮专注于AI技术的应用与落地无论是将先进的AI模(DeepSeek进行本地化部署以满足特定场景需求还是根据您的独特业务挑战开发定制化的AI应用程序我们都能提供从模型选型数据处理算法优化到应用集成与部署的全栈服务针对金融医疗教育等行业定制预训练微调模型与专用知识库模板提供开箱即用的解决方案 我们紧跟人工智能发展浪潮专注于AI技术的应用与落地无论是将先进的AI模(DeepSeek进行本地化部署以满足特定场景需求还是根据您的独特业务挑战开发定制化的AI应用程序我们都能提供从模型选型数据处理算法优化到应用集成与部署的全栈服务针对金融医疗教育等行业定制预训练微调模型与专用知识库模板提供开箱即用的解决方案
</div> </div>
<div <div
style="margin-top: 30px;background: linear-gradient( 138deg, #F7F7F7 0%, #FFFFFF 100%);border-radius: 4px;padding: 10px;"> style="margin-top: 30px;background: linear-gradient( 138deg, #F7F7F7 0%, #FFFFFF 100%);border-radius: 4px;padding: 20px;">
<div style="display: flex;flex-direction: row;justify-content: space-between;"> <div style="display: flex;flex-direction: row;justify-content: space-between;">
<div class="service-1" <div class="service-1"
style="display: flex;flex-direction: column;align-items: center;text-align: center;"> style="display: flex;flex-direction: column;align-items: center;text-align: center;">
@ -134,9 +135,9 @@
</div> </div>
<div class="service_023"> <div class="service_023">
<div class="service-01" style="text-align: center;padding-top: 30px;z-index: 30;"> <div class="service-01" style="text-align: center;padding-top: 10px;z-index: 30;">
<div style="font-size: 34px;font-weight: 700;">定制软件开发</div> <div style="font-size: 34px;font-weight: 700;">定制软件开发</div>
<div style="color: #768597;font-size: 16px;margin-top: 15px;">全方位的定制化软件开发服务</div> <div style="color: #768597;font-size: 14px;margin-top:10px;">全方位的定制化软件开发服务</div>
</div> </div>
<div <div
style="display: flex;flex-direction: column;align-items: center;justify-content: center;width: 100%;gap: 30px;margin-top: 30px;"> style="display: flex;flex-direction: column;align-items: center;justify-content: center;width: 100%;gap: 30px;margin-top: 30px;">
@ -150,8 +151,8 @@
</div> </div>
<div style="color: #222222;font-size: 18px;font-weight: 700;margin-left: 10px;">项目介绍和业务描述</div> <div style="color: #222222;font-size: 18px;font-weight: 700;margin-left: 10px;">项目介绍和业务描述</div>
</div> </div>
<div style="line-height: 24px;margin-top: 20px;font-size: 14px;font-weight: 400;color: #768597;"> <div style="text-align: justify;line-height: 24px;margin-top: 20px;font-size: 16px;font-weight: 400;color: #768597;">
我们专注于提供全方位的定制化软件开发服务满足您多样化的业务需求无论是面向特定群体的活动平台"多样青春项目"功能完善的电子商务系统"商城项目"互动性强的活动应用"健身打卡活动项目"还是便捷高效的组织管理工具"协会小程序项目"我们的团队都能运用主流技术栈和敏捷开发模式为您打造用户体验出色性能稳定可靠的Web应用移动App及小程序驱动业务创新 我们专注于提供全方位的定制化软件开发服务满足您多样化的业务需求无论是面向特定群体的活动平台"多样青春项目"功能完善的电子商务系统"商城项目"互动性强的活动应用"健身打卡活动项目"还是便捷高效的组织管理工具"协会小程序项目"我们的团队都能运用主流技术栈和敏捷开发模式为您打造用户体验出色性能稳定可靠的Web应用移动App及小程序驱动业务创新
</div> </div>
<div <div
style="gap: 20px;;flex-wrap: wrap; display: flex;flex-direction: row;align-items: center;justify-content: center;width: 100%;margin-top: 30px;"> style="gap: 20px;;flex-wrap: wrap; display: flex;flex-direction: row;align-items: center;justify-content: center;width: 100%;margin-top: 30px;">
@ -171,20 +172,20 @@
</div> </div>
</div> </div>
</div> </div>
<div style="padding: 40px 0px 100px 0px;z-index: 30;background-color: #ffffff;"> <div style="padding: 40px 0px 40px 0px;z-index: 30;background-color: #ffffff;">
<div style="text-align: center;z-index: 30;"> <div style="text-align: center;z-index: 30;">
<div style="font-size: 34px;font-weight: 700;">IT运维服务</div> <div style="font-size: 34px;font-weight: 700;">IT运维服务</div>
<div style="color: #768597;font-size: 16px;margin-top: 15px;">承接客户网站及应用系统的全面安全防护项目</div> <div style="color: #768597;font-size: 14px;margin-top: 10px;">承接客户网站及应用系统的全面安全防护项目</div>
</div> </div>
<div <div
style="flex-wrap: wrap; display: flex;flex-direction: row;align-items: center;justify-content: center;width: 100%;gap: 10px;margin-top: 40px;"> style="flex-wrap: wrap; display: flex;flex-direction: row;align-items: center;justify-content: center;width: 100%;gap: 10px;margin-top: 30px;">
<div class="service-yw" style="position: relative;"> <div class="service-yw" style="position: relative;">
<img :src="`${cdnUrl}/img/service_029.png`" style="width:165px;"> <img :src="`${cdnUrl}/img/service_029.png`" style="width:165px;">
<div <div
style="position: absolute;bottom: 0px;left: 0px;width: 100%;height: 100%;padding: 20px 10px 0px 20px;"> style="position: absolute;bottom: 0px;left: 0px;width: 100%;height: 100%;padding: 20px 10px 0px 20px;">
<div style="font-size: 18px;font-weight: 700;color: #3D3D3D;">安全防护</div> <div style="font-size: 18px;font-weight: 700;color: #3D3D3D;">安全防护</div>
<div style="font-weight: 400;color: #768597;font-size: 12px;margin-top: 10px;"> <div style="font-weight: 400;color: #768597;font-size: 14px;margin-top: 5px;">
帮助决策者制定针对性防护策略降低网络攻击数据泄露和业务中断等风险</div> 针对性防护策略</div>
</div> </div>
</div> </div>
<div class="service-yw" style="position: relative;"> <div class="service-yw" style="position: relative;">
@ -192,8 +193,8 @@
<div <div
style="position: absolute;bottom: 0px;left: 0px;width: 100%;height: 100%;padding: 20px 10px 0px 20px;"> style="position: absolute;bottom: 0px;left: 0px;width: 100%;height: 100%;padding: 20px 10px 0px 20px;">
<div style="font-size: 18px;font-weight: 700;color: #3D3D3D;">漏洞修复</div> <div style="font-size: 18px;font-weight: 700;color: #3D3D3D;">漏洞修复</div>
<div style="font-weight: 400;color: #768597;font-size: 12px;margin-top: 10px;"> <div style="font-weight: 400;color: #768597;font-size: 14px;margin-top: 5px;">
专业团队快速检测定位并处置安全威胁最大限度减少损失保障业务连续性</div> 专业团队快速检测</div>
</div> </div>
</div> </div>
<div class="service-yw" style="position: relative;"> <div class="service-yw" style="position: relative;">
@ -201,8 +202,7 @@
<div <div
style="position: absolute;bottom: 0px;left: 0px;width: 100%;height: 100%;padding: 20px 10px 0px 20px;"> style="position: absolute;bottom: 0px;left: 0px;width: 100%;height: 100%;padding: 20px 10px 0px 20px;">
<div style="font-size: 18px;font-weight: 700;color: #3D3D3D;">安全加固</div> <div style="font-size: 18px;font-weight: 700;color: #3D3D3D;">安全加固</div>
<div style="font-weight: 400;color: #768597;font-size: 12px;margin-top: 10px;">ios和Android应用防调试 <div style="font-weight: 400;color: #768597;font-size: 14px;margin-top: 5px;">防调试,篡改,窃取,逆向</div>
防篡改 防窃取 防逆向抵御各类网络攻击和数据泄露风险</div>
</div> </div>
</div> </div>
<div class="service-yw" style="position: relative;"> <div class="service-yw" style="position: relative;">
@ -210,8 +210,8 @@
<div <div
style="position: absolute;bottom: 0px;left: 0px;width: 100%;height: 100%;padding: 20px 10px 0px 20px;"> style="position: absolute;bottom: 0px;left: 0px;width: 100%;height: 100%;padding: 20px 10px 0px 20px;">
<div style="font-size: 18px;font-weight: 700;color: #3D3D3D;">实时监控</div> <div style="font-size: 18px;font-weight: 700;color: #3D3D3D;">实时监控</div>
<div style="font-weight: 400;color: #666666;font-size: 12px;margin-top: 10px;"> <div style="font-weight: 400;color: #666666;font-size: 14px;margin-top: 5px;">
网络安全实时监控服务提供24小时威胁检测与主动防御实时识别漏洞保障数据安全</div> 网络安全实时监控</div>
</div> </div>
</div> </div>
</div> </div>
@ -221,7 +221,7 @@
<div style="font-size: 34px;font-weight: 700;">网络与信息安全</div> <div style="font-size: 34px;font-weight: 700;">网络与信息安全</div>
<div style="color: #768597;font-size: 16px;margin-top: 15px;">专业守护数据防御威胁护航企业数字安全</div> <div style="color: #768597;font-size: 16px;margin-top: 15px;">专业守护数据防御威胁护航企业数字安全</div>
</div> </div>
<div class="service-wl-b" style="flex-wrap: wrap;display: flex;justify-content: center;margin-top: 40px;"> <div class="service-wl-b" style="flex-wrap: wrap;display: flex;justify-content: center;margin-top: 30px;">
<div class="service-wl"> <div class="service-wl">
<div style="position: absolute;"> <div style="position: absolute;">
<img :src="`${cdnUrl}/img/service_034.png`" style="width:100%;height: 100%;"> <img :src="`${cdnUrl}/img/service_034.png`" style="width:100%;height: 100%;">
@ -311,13 +311,13 @@
</div> </div>
</div> </div>
</div> </div>
<div style="z-index: 30;background-color: #ffffff;padding:30px 20px;"> <div style="z-index: 30;background-color: #ffffff;padding:40px 20px;">
<div style="text-align: center;z-index: 30;"> <div style="text-align: center;z-index: 30;">
<div style="font-size: 34px;font-weight: 700;">智慧化解决方案</div> <div style="font-size: 34px;font-weight: 700;">智慧化解决方案</div>
<div style="color: #768597;font-size: 16px;margin-top: 15px;">利用物联网大数据人工智能等前沿技术为不同场景提供一体化的智慧化解决方案 <div style="color: #768597;font-size: 14px;margin-top: 10px;">利用物联网大数据人工智能等前沿技术为不同场景提供一体化的智慧化解决方案
</div> </div>
</div> </div>
<div style="display: flex;flex-wrap: wrap;gap: 20px;margin-top: 20px;"> <div style="display: flex;flex-wrap: wrap;gap: 20px;margin-top: 30px;">
<div class="service_bottom_01"> <div class="service_bottom_01">
<div class="box1 service_bottom_no" <div class="box1 service_bottom_no"
style="border-radius: 8px;width: 100%;height: 196px;padding: 30px;"> style="border-radius: 8px;width: 100%;height: 196px;padding: 30px;">
@ -420,9 +420,9 @@
</div> </div>
<div class="service_051" style="z-index: 30;"> <div class="service_051" style="z-index: 30;">
<div style="width: 100%;"> <div style="width: 100%;">
<div class="service-02" style="padding:30px 20px 0px 20px;"> <div class="service-02" style="padding:40px 20px 0px 20px;">
<div style="font-size: 34px;font-weight: 700;">硬件基础设施建设</div> <div style="font-size: 34px;font-weight: 700;">硬件基础设施建设</div>
<div style="font-size: 16px;margin-top: 30px;">提供从需求分析方案设计设备选型综合布线到安装调试环境监控的全流程服务</div> <div style="font-size: 14px;margin-top: 10px;">提供从需求分析方案设计设备选型综合布线到安装调试环境监控的全流程服务</div>
</div> </div>
<div class="service-container" style="padding: 20px;"> <div class="service-container" style="padding: 20px;">
<div v-for="(item, index) in serviceList" class="service-item"> <div v-for="(item, index) in serviceList" class="service-item">
@ -550,13 +550,12 @@ const animate = () => {
}) })
sr.reveal('.service-yw', { sr.reveal('.service-yw', {
origin: "left", origin: "left",
distance: "50px", distance: "100px",
duration: 800, duration: 800,
easing: 'cubic-bezier(0.5, 0, 0, 1)', //
delay: 100, delay: 100,
opacity: 0, opacity: 0,
scale: 0.9, scale: 0.9,
reset: true, reset: false,
useDelay: 500, useDelay: 500,
mobile: true, mobile: true,
}) })

View File

@ -13,34 +13,35 @@
<!-- <div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;"> <!-- <div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
<div class="flex-row justify-center align-center"> <div class="flex-row justify-center align-center">
<div> <div>
<img :src="`${cdnUrl}/img/left.png" alt=""> <img :src="`${cdnUrl}/img/left.png`" alt="">
</div> </div>
<div style="margin: 0px 20px;"> <div style="margin: 0px 20px;">
<img :src="`${cdnUrl}/img/morse.png" alt=""> <img :src="`${cdnUrl}/img/morse.png`" alt="">
</div> </div>
<div> <div>
<img :src="`${cdnUrl}/img/right.png" alt=""> <img :src="`${cdnUrl}/img/right.png`" alt="">
</div> </div>
</div> </div>
</div> --> </div> -->
</div> </div>
<div class="group_2 flex-col" <div class="group_2 flex-col"
style="background-color: #ffffff;overflow: unset;position: relative;height: 539px;"> style="background-color: #ffffff;overflow: unset;position: relative;padding-bottom: 40px;">
<img :src="`${cdnUrl}/img/service_01s.png`" style="width: 100%;position: absolute;top: -26px;z-index: 10;"> <!-- <img :src="`${cdnUrl}/img/service_01s.png`" style="width: 100%;position: absolute;top: -26px;z-index: 10;"> -->
<div class="service_top1"> <div class="service_top1">
<div style="cursor: pointer;width: 50%;text-align: center;"> <div style="cursor: pointer;width: 50%;text-align: center;">
<div style="color: #FC7428;margin-bottom: 10px;">内容创作与运营</div> <div style="color: #FC7428;margin-bottom: 10px;font-weight: 600;">内容创作与运营</div>
<div style="background-color: #FC7428;width:20%;height: 8px;margin: 0 auto;"></div> <div style="background-color: #FC7428;width:20%;height: 4px;margin: 0 auto;"></div>
</div> </div>
<NuxtLink to="/phone_proServices/" style="cursor: pointer;width: 50%;text-align: center;"> <NuxtLink to="/phone_proServices/" style="cursor: pointer;width: 50%;text-align: center;">
<div> <div style="color: #999999;">
专业技术服务 专业技术服务
</div> </div>
</NuxtLink> </NuxtLink>
</div> </div>
<div class="service-01" style="text-align: center;padding-top: 70px;z-index: 30;"> <div style="background-color: #eeeeee;width:100%;height: 0.5px;"></div>
<div class="service-01" style="text-align: center;padding-top: 40px;z-index: 30;">
<div style="font-size: 34px;font-weight: 700;">全媒体推广解决方案</div> <div style="font-size: 34px;font-weight: 700;">全媒体推广解决方案</div>
<div style="color: #768597;font-size: 16px;margin-top: 30px;">多维度矩阵覆盖赋能品牌增长新势能</div> <div style="color: #768597;font-size: 16px;margin-top: 10px;">多维度矩阵覆盖赋能品牌增长新势能</div>
</div> </div>
<div style="z-index: 30;padding-top: 30px;"> <div style="z-index: 30;padding-top: 30px;">
<swiper ref="swiper_exp" :slidesPerView="1" loop :autoplay="false" :modules="modules" <swiper ref="swiper_exp" :slidesPerView="1" loop :autoplay="false" :modules="modules"
@ -87,7 +88,7 @@
</div> </div>
<div <div
style="padding: 40px 0px 0px 0px;z-index: 30;background: url(/img/content_con.png) no-repeat;background-size: 100%;"> style="padding: 40px 0px 0px 0px;z-index: 30;background: url(/img/content_con.png) no-repeat;background-size: 100%;">
<div style="text-align: center;padding-top: 30px;z-index: 30;"> <div style="text-align: center;z-index: 30;">
<div style="font-size: 34px;font-weight: 700;">品牌账号代运营</div> <div style="font-size: 34px;font-weight: 700;">品牌账号代运营</div>
<div class="flex-row justify-center align-center" style="margin-top: 30px;"> <div class="flex-row justify-center align-center" style="margin-top: 30px;">
<div @click="openType(1)" :class="typeIndex == 1 ? 'video_wechat' : 'video_platform'"> <div @click="openType(1)" :class="typeIndex == 1 ? 'video_wechat' : 'video_platform'">
@ -107,15 +108,15 @@
</div> </div>
</div> </div>
<div <div
style="padding: 15px;flex-wrap: wrap;display: flex;flex-direction: row;align-items: center;width: 100%;gap: 30px;margin-top: 20px;"> style="padding: 15px;width: 100%;margin-top: 20px;display: grid;grid-template-columns: repeat(2, 1fr);gap: 10px;justify-content: start;">
<div v-if="typeIndex == 2" @mouseenter="bgSet(index)" class="service-yw" style="position: relative;flex: 0 1 calc(50% - 15px);" <div v-if="typeIndex == 2" @mouseenter="bgSet(index)" class="service-yw" style="position: relative;"
v-for="(item, index) in wchatList" :key="index"> v-for="(item, index) in wchatList" :key="index">
<img :src="`/img/media/${index + 1}.png`" style="width:216px;"> <img :src="`/img/media/${index + 1}.png`" style="width:219px;">
<img v-if="!item.isShow" :src="`${cdnUrl}/img/media/buttom.png`" <img v-if="!item.isShow" :src="`${cdnUrl}/img/media/buttom.png`"
style="width: 216px;position: absolute;bottom: 0px;"> style="width: 219px;position: absolute;bottom: 0px;">
<div v-if="!item.isShow" style="position: absolute;bottom: 0;color: #FFFFFF;padding: 15px;"> <div v-if="!item.isShow" style="position: absolute;bottom: -6px;color: #FFFFFF;padding: 15px;">
<div style="font-size: 16px;font-weight: 600;">{{ item.name }}</div> <div style="font-size: 15px;font-weight: 600;">{{ item.name }}</div>
<div style="font-size: 12px;font-weight: 400;margin-top: 5px;">{{ item.desc }}</div> <!-- <div style="font-size: 12px;font-weight: 400;margin-top: 5px;">{{ item.desc }}</div> -->
</div> </div>
<div v-if="item.isShow"> <div v-if="item.isShow">
<div <div
@ -129,8 +130,8 @@
</div> </div>
<div style="font-size: 16px;font-weight: 600;margin-top: 10px;">{{ item.title }} <div style="font-size: 16px;font-weight: 600;margin-top: 10px;">{{ item.title }}
</div> </div>
<div class="three-line-ellipsis" style="font-size: 12px;font-weight: 400;margin-top: 15px;">{{ item.content }} <!-- <div class="three-line-ellipsis" style="font-size: 12px;font-weight: 400;margin-top: 15px;">{{ item.content }}
</div> </div> -->
</div> </div>
</div> </div>
</div> </div>
@ -138,12 +139,12 @@
</div> </div>
<div v-if="typeIndex == 1" @mouseenter="bgSetVideo(index)" class="service-yw" <div v-if="typeIndex == 1" @mouseenter="bgSetVideo(index)" class="service-yw"
style="position: relative;margin: 0 auto;" v-for="(item, index) in videoList" :key="index"> style="position: relative;margin: 0 auto;" v-for="(item, index) in videoList" :key="index">
<img :src="`/img/media/b${index + 1}.png`" style="width:160px;"> <img :src="`/img/media/b${index + 1}.png`" style="width:170px;">
<img v-if="!item.isShow" :src="`${cdnUrl}/img/media/buttom2.png`" <img v-if="!item.isShow" :src="`${cdnUrl}/img/media/buttom2.png`"
style="width: 160px;position: absolute;bottom: 0px;"> style="width: 170px;position: absolute;bottom: 0px;">
<div v-if="!item.isShow" style="position: absolute;bottom: 0;color: #FFFFFF;padding: 10px;"> <div v-if="!item.isShow" style="position: absolute;bottom: -6px;color: #FFFFFF;padding: 10px;">
<div style="font-size: 15px;font-weight: 600;">{{ item.name }}</div> <div style="font-size: 15px;font-weight: 600;">{{ item.name }}</div>
<div style="font-size: 12px;font-weight: 400;">{{ item.desc }}</div> <!-- <div style="font-size: 12px;font-weight: 400;">{{ item.desc }}</div> -->
</div> </div>
<div v-if="item.isShow"> <div v-if="item.isShow">
<div <div
@ -156,8 +157,8 @@
style="width:60px;height: 60px;margin: 0 auto;"> style="width:60px;height: 60px;margin: 0 auto;">
</div> </div>
<div style="font-size: 14px;font-weight: 600;margin-top: 5px;">{{ item.title }}</div> <div style="font-size: 14px;font-weight: 600;margin-top: 5px;">{{ item.title }}</div>
<div class="three-line-ellipsis" style="font-size: 12px;font-weight: 400;margin-top: 5px;">{{ item.content }} <!-- <div class="three-line-ellipsis" style="font-size: 12px;font-weight: 400;margin-top: 5px;">{{ item.content }}
</div> </div> -->
</div> </div>
</div> </div>
</div> </div>

View File

@ -12,13 +12,25 @@
</swiper> </swiper>
</div> </div>
<div class="box_11 flex-col bottom_imgss"> <div class="box_11 flex-col bottom_imgss">
<div class="service_top1">
<NuxtLink to="/phone_societyDutyNew/" style="cursor: pointer;width: 50%;text-align: center;">
<div style="color: #999999;">
公司动态
</div>
</NuxtLink>
<div style="cursor: pointer;width: 50%;text-align: center;">
<div style="color: #FC7428;margin-bottom: 10px;font-weight: 600;">活动影集部分</div>
<div style="background-color: #FC7428;width:20%;height: 4px;margin: 0 auto;"></div>
</div>
</div>
<div style="background-color: #eeeeee;width:100%;height: 0.5px;"></div>
<!-- <div class="text-wrapper_10"> <!-- <div class="text-wrapper_10">
<span class="text_41">公司荣誉</span> <span class="text_41">公司荣誉</span>
</div> </div>
<div class="text-wrapper_11"> <div class="text-wrapper_11">
<span class="text_42">Company&nbsp;Honors&nbsp;</span> <span class="text_42">Company&nbsp;Honors&nbsp;</span>
</div> --> </div> -->
<div class="group_14 flex-row justify-between align-center" style="flex-wrap: wrap;width: 95%;padding-top: 30px;"> <!-- <div class="group_14 flex-row justify-between align-center" style="flex-wrap: wrap;width: 95%;padding-top: 30px;">
<div class="flex-row"> <div class="flex-row">
<div class="text_25"> <div class="text_25">
<span> <span>
@ -36,7 +48,7 @@
</div> </div>
<div class="group_15" style="flex: 0 0 100%;"></div> <div class="group_15" style="flex: 0 0 100%;"></div>
</div> </div> -->
<div class="boxgs flex-row flex-wrap"> <div class="boxgs flex-row flex-wrap">
@ -236,7 +248,6 @@ const animate = () => {
.boxgs{ .boxgs{
width: 100%; width: 100%;
margin: 0 auto; margin: 0 auto;
margin-top: 30px;
padding: 20px; padding: 20px;
.box_con{ .box_con{
margin:10px; margin:10px;
@ -268,4 +279,14 @@ const animate = () => {
} }
} }
} }
.service_top1 {
font-size: 18px;
padding-top: 10px;
z-index: 30;
display: flex;
flex-direction: row;
justify-content: space-around;
width: 100%;
}
</style> </style>

View File

@ -12,7 +12,19 @@
</swiper> </swiper>
</div> </div>
<div class="box_11 flex-col bottom_imgss" style="padding-bottom: 0px;"> <div class="box_11 flex-col bottom_imgss" style="padding-bottom: 0px;">
<div class="group_14 flex-row justify-between align-center" style="flex-wrap: wrap;width: 95%;padding-top: 30px;"> <div class="service_top1">
<div style="cursor: pointer;width: 50%;text-align: center;">
<div style="color: #FC7428;margin-bottom: 10px;font-weight: 600;">公司动态</div>
<div style="background-color: #FC7428;width:20%;height: 4px;margin: 0 auto;"></div>
</div>
<NuxtLink to="/phone_societyDuty/" style="cursor: pointer;width: 50%;text-align: center;">
<div style="color: #999999;">
活动影集部分
</div>
</NuxtLink>
</div>
<div style="background-color: #eeeeee;width:100%;height: 0.5px;"></div>
<!-- <div class="group_14 flex-row justify-between align-center" style="flex-wrap: wrap;width: 95%;padding-top: 30px;">
<div class="flex-row"> <div class="flex-row">
<div class="text_25"> <div class="text_25">
<span style="color: rgb(252, 116, 40);">公司动态</span> <span style="color: rgb(252, 116, 40);">公司动态</span>
@ -28,17 +40,17 @@
</div> </div>
<div class="group_15" style="flex: 0 0 100%;"></div> <div class="group_15" style="flex: 0 0 100%;"></div>
</div> </div> -->
<div class="boxgs flex-row flex-wrap"> <div class="boxgs flex-row flex-wrap">
<div class="boxgs_top" style="display: flex;align-items: center;justify-content: center;flex-wrap: wrap;padding: 10px;"> <div class="boxgs_top" style="display: flex;align-items: center;justify-content: center;flex-wrap: wrap;padding: 10px;">
<div style="position: relative;cursor: pointer;" @click="videoShow = true"> <div style="position: relative;cursor: pointer;width: 100%;" @click="videoShow = true">
<img :src="`${cdnUrl}/img/societyduty/det.png`" style="width: 500px;"> <img :src="`${cdnUrl}/img/societyduty/det.png`" style="width: 100%;">
<img :src="`${cdnUrl}/img/societyduty/bf.png`" <img :src="`${cdnUrl}/img/societyduty/bf.png`"
style="width: 50px;height: 50px;position: absolute;top: 45%;left: 0;right: 0;margin: 0 auto;"> style="width: 50px;height: 50px;position: absolute;top: 45%;left: 0;right: 0;margin: 0 auto;">
</div> </div>
<div style="width: 100%;padding-top: 10px;"> <div style="width: 100%;padding-top: 10px;">
<div style="font-size: 24px;color: #3D3D3D;font-weight: 700;">青年企业家岳崇霄:招商引智为洛阳注入创新活水</div> <div style="font-size: 24px;color: #3D3D3D;font-weight: 700;margin: 10px 0px;">青年企业家岳崇霄:招商引智为洛阳注入创新活水</div>
<div style="color: #FC7428;font-size: 14px;font-weight: 900;margin: 10px 0px;">灵睿网络创始人岳崇霄</div> <div style="color: #FC7428;font-size: 14px;font-weight: 900;margin: 10px 0px;">灵睿网络创始人岳崇霄</div>
<div style="font-size: 14px;font-weight: 400;color: #3D3D3D;"> <div style="font-size: 14px;font-weight: 400;color: #3D3D3D;">
<div>岳崇霄2020年4月荣获2020年全国向上向善好青年扶贫助困好青年 </div> <div>岳崇霄2020年4月荣获2020年全国向上向善好青年扶贫助困好青年 </div>
@ -48,7 +60,7 @@
河南省青联委员河南省青年企业家协会理事河南省青少年新媒体协会理事洛阳市青联常委洛阳市青年企业家协会副会长洛阳市党外知识分子联谊会副秘书长洛阳市青年文艺联合会副秘书长洛阳市郑州商会副会长涧西区党外知识分子联谊会副会长洛阳师范学院客座教授 河南省青联委员河南省青年企业家协会理事河南省青少年新媒体协会理事洛阳市青联常委洛阳市青年企业家协会副会长洛阳市党外知识分子联谊会副秘书长洛阳市青年文艺联合会副秘书长洛阳市郑州商会副会长涧西区党外知识分子联谊会副会长洛阳师范学院客座教授
洛阳职业技术学院客座教授</div> 洛阳职业技术学院客座教授</div>
</div> </div>
<div style="margin-top: 20px;"> <div style="margin: 20px 0px;">
<div @click="videoShow = true" <div @click="videoShow = true"
style="margin: 0 auto;cursor: pointer;;line-height: 36px;text-align: center;width: 109px;height: 36px;background: #222222;color: #ffffff;"> style="margin: 0 auto;cursor: pointer;;line-height: 36px;text-align: center;width: 109px;height: 36px;background: #222222;color: #ffffff;">
查看详情</div> 查看详情</div>
@ -67,7 +79,7 @@
<div class="text_cc three-line-ellipsis"> <div class="text_cc three-line-ellipsis">
{{ item.subtitle }} {{ item.subtitle }}
</div> </div>
<div style="margin-top: 10px;display: flex;justify-content: space-between;align-items: center;"> <div style="margin: 20px 0px;display: flex;justify-content: space-between;align-items: center;">
<div style="font-size: 14px;">发布日期{{ timeDateMy(item.release_time_text) }}</div> <div style="font-size: 14px;">发布日期{{ timeDateMy(item.release_time_text) }}</div>
<div style="font-size: 14px;color: #FC7428;display: flex;align-items: center;"> <div style="font-size: 14px;color: #FC7428;display: flex;align-items: center;">
<div>查看详情</div> <div>查看详情</div>
@ -308,7 +320,6 @@ const animate = () => {
height: auto; height: auto;
border: 1px solid #FC7428; border: 1px solid #FC7428;
border-radius: 24px; border-radius: 24px;
margin-top: 30px;
} }
.box_con { .box_con {
@ -377,4 +388,13 @@ const animate = () => {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.service_top1 {
font-size: 18px;
padding-top: 10px;
z-index: 30;
display: flex;
flex-direction: row;
justify-content: space-around;
width: 100%;
}
</style> </style>