king
2019-07-16 ed58afaaa564c54d22a42593265addce08bd5850
src/views/productCenter/index.vue
@@ -1,428 +1,414 @@
<template>
    <div class="main">
        <div class="banner m_hide" style="margin-bottom: 1rem;"><img src="../../img/ban.png" alt=""></div>
        <div class="banner p_hide" style="margin-bottom: 1rem;"><img src="../../img/m_ban.png" alt=""></div>
        <div class="wrapper platform">
            <div class="content_title"><span>明科商业智能开放平台</span></div>
            <p>明科商业智能开放平台(MingKe Business Intelligen OS,简称:MingKeOS)是由明科云计算事业部研发的可配置人工智能开发平台,使用MingKeOS可以让用户通过简单配置、自然语言对话的交互方式,即可实现企业管理过程中复杂的业务逻辑处理,平台内置采购、生产、销售、技术、品控、追溯、售后、供应商、经销商、库存、财务电商、数据中心、接口、人工智能(Kane)等28大业务领域模块的功能操作,明科作为国内首家将人工智能应用于企业管理领域的企业,借助云计算中心,Kane可以进行深度学习,会成为企业管理的好帮手。</p>
        </div>
        <div class="wrapper scene">
            <div class="content_title"><span>应用场景</span></div>
            <div class="content_scene">
                <span :class="h_index == 1 ? 'hover2' : 'scene'" @mouseover="h_index = 1" @mouseout="h_index = 0"><img src="../../img/p1.png" alt=""><span class="txt">供应商协同</span></span>
                <span :class="h_index == 2 ? 'hover2' : 'scene'" @mouseover="h_index = 2" @mouseout="h_index = 0"><img src="../../img/p2.png" alt=""><span class="txt txt2">WMS<br />仓库管理系统</span></span>
                <span :class="h_index == 3 ? 'hover2' : 'scene'" @mouseover="h_index = 3" @mouseout="h_index = 0"><img src="../../img/p3.png" alt=""><span class="txt txt2">QTS<br />质量追溯系统</span></span>
                <span :class="h_index == 4 ? 'hover2' : 'scene'" @mouseover="h_index = 4" @mouseout="h_index = 0"><img src="../../img/p4.png" alt=""><span class="txt">经销商管理</span></span>
                <span :class="h_index == 5 ? 'hover2' : 'scene'" @mouseover="h_index = 5" @mouseout="h_index = 0"><img src="../../img/p5.png" alt=""><span class="txt txt2">MES<br />智能制造</span></span>
                <span :class="h_index == 6 ? 'hover2' : 'scene'" @mouseover="h_index = 6" @mouseout="h_index = 0">
               <img src="../../img/jing.png" alt="" class="m_img"><span class="txt m_img">经销商管理</span>
               <img src="../../img/p6.png" alt="" class="p_img"><span class="txt p_img" style="color: black;bottom: 0;">经销商管理</span>
            </span>
            </div>
        </div>
        <div class="wrapper skill">
            <div class="content_title"><span>核心技术</span></div>
            <div class="content_skill" >
                <div class="content_skill_item">
                    <div><img src="../../img/p7.png" alt=""></div>
                    <p>可配置开发</p>
                </div>
            <div class="content_skill_item">
                <div><img src="../../img/p8.png" alt=""></div>
                <p>三屏合一</p>
            </div>
            <div class="content_skill_item">
                <div><img src="../../img/p9.png" alt=""></div>
                <p>接口技术</p>
            </div>
            <div class="content_skill_item">
                <div><img src="../../img/p10.png" alt=""></div>
                <p>语言包</p>
            </div>
            <div class="content_skill_item">
                <div><img src="../../img/p11.png" alt=""></div>
                <p>IOT</p>
            </div>
            </div>
        </div>
        <div class="wrapper industry">
            <div class="content_title"><span>适用行业</span></div>
            <div class="content_industry">
                <div class="content_industry_card">
                    <h3>装备制造</h3>
                    <p>中国正在成为全球制造业的中心,中国是制造业大国,但还不是强国。因此,国家确定了通过信息化带动工业化的国策,推动制造企业实施制造业信息化,产品设计制造和企业管理的信息化、生产过程控制的智能化、制造装备的数控化以及咨询服务的网络化,全面提升制造业的竞争力。</p>
                    <div class="content_industry_list">
                        <ul>
                            <li>· 供应商协同平台</li>
                            <li>· 物料仓库管理系统</li>
                            <li>· 制造执行系统</li>
                            <li>· 成品仓库管理系统</li>
                            <li>· 质量追溯系统</li>
                            <li>· 经销商管理平台</li>
                        </ul>
                        <img src="../../img/p12.png" alt="">
                    </div>
                </div>
            <div class="content_industry_card">
                <h3>商业流通</h3>
                <p>随着互联网的快速发展,电子商务行业发展迅猛,作为互联网和相关服务业中新业态,不仅创造了新的消费需求,同时也引发了新的投资新潮,开辟了就业增收新渠道,为大众、万众创新提供了新空间。</p>
                <div class="content_industry_list">
                    <ul>
                        <li>· 电商系统</li>
                        <li>· 仓库管理系统</li>
                    </ul>
                    <img src="../../img/p13.png" alt="">
                </div>
            </div>
            </div>
         <div class="content_industry">
            <div class="content_industry_card">
                <h3>装备制造</h3>
                <p>中国正在成为全球制造业的中心,中国是制造业大国,但还不是强国。因此,国家确定了通过信息化带动工业化的国策,推动制造企业实施制造业信息化,产品设计制造和企业管理的信息化、生产过程控制的智能化、制造装备的数控化以及咨询服务的网络化,全面提升制造业的竞争力。</p>
                <div class="content_industry_list">
                    <ul>
                        <li>· 供应商协同平台</li>
                        <li>· 物料仓库管理系统</li>
                        <li>· 制造执行系统</li>
                        <li>· 成品仓库管理系统</li>
                        <li>· 质量追溯系统</li>
                        <li>· 经销商管理平台</li>
                        <li>· 医药电商</li>
                    </ul>
                    <img src="../../img/p14.png" alt="">
                </div>
            </div>
            <div class="content_industry_card">
                <h3>商业流通</h3>
                <p>随着互联网的快速发展,电子商务行业发展迅猛,作为互联网和相关服务业中新业态,不仅创造了新的消费需求,同时也引发了新的投资新潮,开辟了就业增收新渠道,为大众、万众创新提供了新空间。</p>
                <div class="content_industry_list">
                    <ul>
                        <li>· 仓储管理系统</li>
                        <li>· 配送管理系统</li>
                    </ul>
                    <img src="../../img/p15.png" alt="">
                </div>
            </div>
         </div>
        </div>
        <div class="wrapper join">
            <div class="content_title"><span>加盟代理</span></div>
            <div class="content_skill">
                <div class="content_skill_item">
                    <div><img src="../../img/p16.png" alt=""></div>
                    <p>注册申请</p>
                </div>
            <div class="content_skill_item">
                <div><img src="../../img/p17.png" alt=""></div>
                <p>商务洽谈</p>
            </div>
            <div class="content_skill_item">
                <div><img src="../../img/p18.png" alt=""></div>
                <p>提交材料</p>
            </div>
            <div class="content_skill_item">
                <div><img src="../../img/p19.png" alt=""></div>
                <p>资质审核</p>
            </div>
            <div class="content_skill_item">
                <div><img src="../../img/p20.png" alt=""></div>
                <p>签订协议</p>
            </div>
            </div>
        </div>
        <div class="wrapper joinBtnBox">
            <router-link to="/partner#4" tag="el-button">申请加入</router-link>
        </div>
  <div class="main">
    <div class="banner m_hide" style="margin-bottom: 1rem;"><img src="../../img/ban.png" alt=""></div>
    <div class="banner p_hide" style="margin-bottom: 1rem;"><img src="../../img/m_ban.png" alt=""></div>
    <div class="wrapper platform">
      <div class="content_title"><span>明科商业智能开放平台</span></div>
      <p>明科商业智能开放平台(MingKe Business Intelligen OS,简称:MingKeOS)是由明科云计算事业部研发的可配置人工智能开发平台,使用MingKeOS可以让用户通过简单配置、自然语言对话的交互方式,即可实现企业管理过程中复杂的业务逻辑处理,平台内置采购、生产、销售、技术、品控、追溯、售后、供应商、经销商、库存、财务电商、数据中心、接口、人工智能(Kane)等28大业务领域模块的功能操作,明科作为国内首家将人工智能应用于企业管理领域的企业,借助云计算中心,Kane可以进行深度学习,会成为企业管理的好帮手。</p>
    </div>
    <div class="wrapper scene">
      <div class="content_title"><span>应用场景</span></div>
      <div class="content_scene">
        <span :class="h_index == 1 ? 'hover2' : 'scene'" @mouseover="h_index = 1" @mouseout="h_index = 0"><img src="../../img/p1.png" alt=""><span class="txt">供应商协同</span></span>
        <span :class="h_index == 2 ? 'hover2' : 'scene'" @mouseover="h_index = 2" @mouseout="h_index = 0"><img src="../../img/p2.png" alt=""><span class="txt txt2">WMS<br />仓库管理系统</span></span>
        <span :class="h_index == 3 ? 'hover2' : 'scene'" @mouseover="h_index = 3" @mouseout="h_index = 0"><img src="../../img/p3.png" alt=""><span class="txt txt2">QTS<br />质量追溯系统</span></span>
        <span :class="h_index == 4 ? 'hover2' : 'scene'" @mouseover="h_index = 4" @mouseout="h_index = 0"><img src="../../img/p4.png" alt=""><span class="txt">经销商管理</span></span>
        <span :class="h_index == 5 ? 'hover2' : 'scene'" @mouseover="h_index = 5" @mouseout="h_index = 0"><img src="../../img/p5.png" alt=""><span class="txt txt2">MES<br />智能制造</span></span>
        <span :class="h_index == 6 ? 'hover2' : 'scene'" @mouseover="h_index = 6" @mouseout="h_index = 0">
          <img src="../../img/jing.png" alt="" class="m_img"><span class="txt m_img">经销商管理</span>
          <img src="../../img/p6.png" alt="" class="p_img">
          <span class="txt p_img" style="color: black;bottom: 0;">经销商管理</span>
        </span>
      </div>
    </div>
    <div class="wrapper skill">
      <div class="content_title"><span>核心技术</span></div>
      <div class="content_skill" >
        <div class="content_skill_item">
          <div><img src="../../img/p7.png" alt=""></div>
          <p>可配置开发</p>
        </div>
        <div class="content_skill_item">
          <div><img src="../../img/p8.png" alt=""></div>
          <p>三屏合一</p>
        </div>
        <div class="content_skill_item">
          <div><img src="../../img/p9.png" alt=""></div>
          <p>接口技术</p>
        </div>
        <div class="content_skill_item">
          <div><img src="../../img/p10.png" alt=""></div>
          <p>语言包</p>
        </div>
        <div class="content_skill_item">
          <div><img src="../../img/p11.png" alt=""></div>
          <p>IOT</p>
        </div>
      </div>
    </div>
    <div class="wrapper industry">
      <div class="content_title"><span>适用行业</span></div>
      <div class="content_industry">
        <div class="content_industry_card">
          <h3>装备制造</h3>
          <p>中国正在成为全球制造业的中心,中国是制造业大国,但还不是强国。因此,国家确定了通过信息化带动工业化的国策,推动制造企业实施制造业信息化,产品设计制造和企业管理的信息化、生产过程控制的智能化、制造装备的数控化以及咨询服务的网络化,全面提升制造业的竞争力。</p>
          <div class="content_industry_list">
            <ul>
              <li>· 供应商协同平台</li>
              <li>· 物料仓库管理系统</li>
              <li>· 制造执行系统</li>
              <li>· 成品仓库管理系统</li>
              <li>· 质量追溯系统</li>
              <li>· 经销商管理平台</li>
            </ul>
            <img src="../../img/p12.png" alt="">
          </div>
        </div>
        <div class="content_industry_card">
          <h3>商业流通</h3>
          <p>随着互联网的快速发展,电子商务行业发展迅猛,作为互联网和相关服务业中新业态,不仅创造了新的消费需求,同时也引发了新的投资新潮,开辟了就业增收新渠道,为大众、万众创新提供了新空间。</p>
          <div class="content_industry_list">
            <ul>
              <li>· 电商系统</li>
              <li>· 仓库管理系统</li>
            </ul>
            <img src="../../img/p13.png" alt="">
          </div>
        </div>
      </div>
      <div class="content_industry">
        <div class="content_industry_card">
          <h3>装备制造</h3>
          <p>中国正在成为全球制造业的中心,中国是制造业大国,但还不是强国。因此,国家确定了通过信息化带动工业化的国策,推动制造企业实施制造业信息化,产品设计制造和企业管理的信息化、生产过程控制的智能化、制造装备的数控化以及咨询服务的网络化,全面提升制造业的竞争力。</p>
          <div class="content_industry_list">
            <ul>
              <li>· 供应商协同平台</li>
              <li>· 物料仓库管理系统</li>
              <li>· 制造执行系统</li>
              <li>· 成品仓库管理系统</li>
              <li>· 质量追溯系统</li>
              <li>· 经销商管理平台</li>
              <li>· 医药电商</li>
            </ul>
            <img src="../../img/p14.png" alt="">
          </div>
        </div>
        <div class="content_industry_card">
          <h3>商业流通</h3>
          <p>随着互联网的快速发展,电子商务行业发展迅猛,作为互联网和相关服务业中新业态,不仅创造了新的消费需求,同时也引发了新的投资新潮,开辟了就业增收新渠道,为大众、万众创新提供了新空间。</p>
          <div class="content_industry_list">
            <ul>
              <li>· 仓储管理系统</li>
              <li>· 配送管理系统</li>
            </ul>
            <img src="../../img/p15.png" alt="">
          </div>
        </div>
      </div>
    </div>
    <div class="wrapper join">
      <div class="content_title"><span>加盟代理</span></div>
      <div class="content_skill">
        <div class="content_skill_item">
          <div><img src="../../img/p16.png" alt=""></div>
          <p>注册申请</p>
        </div>
        <div class="content_skill_item">
          <div><img src="../../img/p17.png" alt=""></div>
          <p>商务洽谈</p>
        </div>
        <div class="content_skill_item">
          <div><img src="../../img/p18.png" alt=""></div>
          <p>提交材料</p>
        </div>
        <div class="content_skill_item">
          <div><img src="../../img/p19.png" alt=""></div>
          <p>资质审核</p>
        </div>
        <div class="content_skill_item">
          <div><img src="../../img/p20.png" alt=""></div>
          <p>签订协议</p>
        </div>
      </div>
    </div>
    <div class="wrapper joinBtnBox">
      <router-link to="/partner#4" tag="el-button">申请加入</router-link>
    </div>
  </div>
</template>
<script>
export default {
   data(){
      return{
         h_index:0,
   data() {
      return {
         h_index: 0
      }
   }
}
</script>
<style lang="less" scoped>
@media (min-width: 751px){
   .p_hide{
      display: none !important;
   }
   .m_img{
      display: none;
   }
    .platform{
        .content_title{
            margin: 0.1rem 0 0.38rem;
        }
        p{
            font-size: 0.12rem;
            color: #676767;
            line-height: .18rem;
        }
  @media (min-width: 751px){
    .p_hide {
      display: none !important;
    }
    .scene{
        margin: 0 auto;
      position: relative;
      .txt{
         position: absolute;
         left: 1.16rem;
         bottom: 0.12rem;
         font-size:20px;
         font-family:MicrosoftYaHei-Bold;
         font-weight:bold;
         color:rgba(255,255,255,1);
      }
      .txt2{
         top:0.19rem;
         left: 0.28rem;
      }
        .content_title{
            margin: .53rem 0 0.52rem;
    .m_img {
      display: none;
    }
    .platform {
      .content_title {
        margin: 0.1rem 0 0.38rem;
      }
      p {
        font-size: 0.12rem;
        color: #676767;
        line-height: .18rem;
      }
    }
    .scene {
      margin: 0 auto;
        position: relative;
      .txt {
        position: absolute;
        left: 1.16rem;
        bottom: 0.12rem;
        font-size: 20px;
        font-family: MicrosoftYaHei-Bold;
        font-weight: bold;
        color: rgba(255,255,255,1);
      }
      .txt2 {
        top: 0.19rem;
        left: 0.28rem;
      }
      .content_title {
        margin: .53rem 0 0.52rem;
      }
      .content_scene {
        width: 100%;
        height: 100%;
        display: flex;
        flex-wrap: wrap;
        span {
          display: inline-block;
          margin-bottom: .15rem;
        }
        .content_scene{
            width: 100%;
            height: 100%;
            display: flex;
            flex-wrap: wrap;
            span{
                display: inline-block;
                margin-bottom: .15rem;
      }
    }
    .hover2 {
      cursor: pointer;
      transform: scale(1.2);
      z-index: 99999;
    }
    .center .skill {
      .content_title {
        margin: 0.69rem 0 0.63rem;
      }
    }
    .industry {
      .content_title {
        margin: 1.06rem 0 0.69rem;
      }
      .content_industry {
        display: flex;
        .content_industry_card {
          width: 50%;
          background: rgba(244,244,244,1);
          margin-right: 0.33rem;
          padding: 0.19rem 0.22rem 0.35rem;
          position: relative;
          h3 {
            margin-bottom: 0.16rem;
            a {
              font-size: 0.22rem;
              color: #3A3A3C;
              text-decoration: underline;
            }
        }
    }
   .hover2{
      cursor: pointer;
      transform: scale(1.2);
      z-index: 99999;
   }
    .center .skill{
        .content_title{
            margin: 0.69rem 0 0.63rem;
        }
    }
    .industry{
        .content_title{
            margin: 1.06rem 0 0.69rem;
        }
        .content_industry{
          }
          p {
            min-height:1rem;
            font-size:0.14rem;
            font-family:MicrosoftYaHei;
            font-weight:400;
            color:rgba(103,103,103,1);
            line-height:0.25rem;
          }
          .content_industry_list {
            display: flex;
            .content_industry_card{
            width: 50%;
                background: rgba(244,244,244,1);
                margin-right: 0.33rem;
                padding: 0.19rem 0.22rem 0.35rem;
            position: relative;
                h3{
                    margin-bottom: 0.16rem;
                    a{
                        font-size: 0.22rem;
                        color: #3A3A3C;
                        text-decoration: underline;
                    }
                }
                p{
               min-height:1rem;
               font-size:0.14rem;
               font-family:MicrosoftYaHei;
               font-weight:400;
               color:rgba(103,103,103,1);
               line-height:0.25rem;
                }
                .content_industry_list{
                    display: flex;
                    margin-top: 0.27rem;
                    ul{
                        margin-right: .4rem;
                        li{
                            font-size: 0.08rem;
                            line-height: 0.25rem;
                        }
                    }
                    img{
                        position: absolute;
                  right: 0.3rem;
                  bottom: 0.3rem;
                    }
                }
            margin-top: 0.27rem;
            ul {
              margin-right: .4rem;
              li {
                font-size: 0.08rem;
                line-height: 0.25rem;
              }
            }
            img {
              position: absolute;
              right: 0.3rem;
              bottom: 0.3rem;
            }
          }
        }
        .content_industry:last-child{
            margin-top: 0.3rem;
        }
      }
      .content_industry:last-child {
        margin-top: 0.3rem;
      }
    }
    .join{
        .content_title{
            margin: 0.85rem 0 0.53rem;
        }
    .join {
      .content_title {
        margin: 0.85rem 0 0.53rem;
      }
    }
    .el-button{
        padding:0.2rem 0.8rem;
        background: #3A3A3C;
      color: #fff;
      font-size: 0.2rem;
        span{
            font-size: 0.3rem;
            color: #fff;
            font-weight: bold;
        }
    .el-button {
      padding:0.2rem 0.8rem;
      background: #3A3A3C;
      color: #fff;
      font-size: 0.2rem;
      span {
        font-size: 0.3rem;
        color: #fff;
        font-weight: bold;
      }
    }
}
.joinBtnBox{
  }
  .joinBtnBox {
    text-align: center;
    margin: 1.08rem auto 1.9rem;
}
.content_agent{
  }
  .content_agent {
    display: flex;
}
.content_skill{
        width: 100%;
        overflow: hidden;
        display: flex;
        .content_skill_item{
            text-align: center;
            flex: 1;
            font-size: .1rem;
            div{
                width: 1.2rem;
                height: 1.2rem;
                display: inline-block;
            }
            p{
                font-size: 0.12rem;
                color:#3A3A3C;
                margin: 0.2rem 0;
                text-align: center;
            }
        }
  }
  .content_skill {
    width: 100%;
    overflow: hidden;
    display: flex;
    .content_skill_item {
      text-align: center;
      flex: 1;
      font-size: .1rem;
      div {
        width: 1.2rem;
        height: 1.2rem;
        display: inline-block;
      }
      p {
        font-size: 0.12rem;
        color:#3A3A3C;
        margin: 0.2rem 0;
        text-align: center;
      }
    }
   @media (max-width: 750px) and (min-width: 0){
      .hover2{
  }
   @media (max-width: 750px) and (min-width: 0) {
      .hover2 {
         pointer-events: none;
      }
      .joinBtnBox{
      .joinBtnBox {
         margin: 0.6rem auto 1rem;
      }
      .content_skill .content_skill_item div{
      .content_skill .content_skill_item div {
         width: 0.75rem;
         height: 0.75rem;
      }
      .m_hide{
      .m_hide {
         display: none !important;
      }
      .main, .banner{
      .main, .banner {
         margin-top: 1.14rem;
      }
       .content_scene{
         width: 100%;
         height: 100%;
         display: flex;
         flex-wrap: wrap;
         justify-content: space-between;
         .scene{
            display: inline-block;
            width: 48%;
            height: 2.48rem;
            margin: 1%;
            position: relative;
            img{
               width: 100%;
               height: 2.4rem;
            }
            .p_img{
               display: none;
            }
            .txt{
               position: absolute;
               left: 30%;
               bottom: 10%;
               color: #fff;
            }
         }
       }
       .content_title{
           margin: 0.5rem 0 0.38rem;
       }
       .content_industry_card{
           width: 100%;
           height: auto;
           background: #f4f4f4;
           padding: 0.3rem .2rem;
           h3{
               width:1.2rem;
               font-size: .28rem;
               font-family: PingFang-SC-Bold;
               font-weight: bold;
               color:#3A3A3C;
               border-bottom: 1px solid #3A3A3C;
           }
           p{
               margin: .32rem 0;
               color: #676767;
           }
           .content_industry_list{
               width: 100%;
               height: auto;
               display: flex;
               justify-content: space-between;
               font-size: .24rem;
               ul{
                   flex: 1;
               }
               li{
                   width: 100%;
                   color: #676767;
                   margin: .1rem 0 .1rem .2rem;
               }
               img{
                   width: 3.6rem;
                   height: 2rem;
                   margin: auto 0;
               }
           }
       }
       .el-button{
           padding:0.2rem 0.8rem;
           background: #6395ff;
         color: #fff;
           span{
               font-size: 0.3rem;
               color: #fff;
               font-weight: bold;
           }
       }
       .content_title>span::before{
           display: none;
       }
       .content_title>span::after {
           content: '';
           position: absolute;
           top: 102%;
           left: 29%;
           width: 1.1rem;
           height: 2px;
           background: #000000;
       }
       .content_industry div:nth-child(2n){
           background: #ffff;
       }
    .content_scene {
      width: 100%;
      height: 100%;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      .scene {
        display: inline-block;
        width: 48%;
        height: 2.48rem;
        margin: 1%;
        position: relative;
        img {
          width: 100%;
          height: 2.4rem;
        }
        .p_img {
          display: none;
        }
        .txt {
          position: absolute;
          left: 30%;
          bottom: 10%;
          color: #fff;
        }
      }
    }
    .content_title {
      margin: 0.5rem 0 0.38rem;
    }
    .content_industry_card {
      width: 100%;
      height: auto;
      background: #f4f4f4;
      padding: 0.3rem .2rem;
      h3 {
        width:1.2rem;
        font-size: .28rem;
        font-family: PingFang-SC-Bold;
        font-weight: bold;
        color:#3A3A3C;
        border-bottom: 1px solid #3A3A3C;
      }
      p {
        margin: .32rem 0;
        color: #676767;
      }
      .content_industry_list {
        width: 100%;
        height: auto;
        display: flex;
        justify-content: space-between;
        font-size: .24rem;
        ul {
          flex: 1;
        }
        li {
          width: 100%;
          color: #676767;
          margin: .1rem 0 .1rem .2rem;
        }
        img {
          width: 3.6rem;
          height: 2rem;
          margin: auto 0;
        }
      }
    }
    .el-button {
      padding: 0.2rem 0.8rem;
      background: #6395ff;
      color: #fff;
      span {
        font-size: 0.3rem;
        color: #fff;
        font-weight: bold;
      }
    }
    .content_title > span::before {
      display: none;
    }
    .content_title > span::after {
      content: '';
      position: absolute;
      top: 102%;
      left: 29%;
      width: 1.1rem;
      height: 2px;
      background: #000000;
    }
    .content_industry div:nth-child(2n) {
      background: #ffff;
    }
   }
</style>