<script>
</script>

<template>
  <div class="main">
        <div id="middleTitle" class="middleTitle">
          <div class="cockpit"><div class="cockpitFont">驾驶舱</div></div>
          <div class="branchPlantProCap"><div class="branchPlantProCapFont">分厂产能</div></div>
          <div class="middleTitleFont">雄伟光大生产指挥中心</div>
          <div class="productionEfficiency"><div class="productionEfficiencyFont">生产效能</div></div>
          <div class="safetyManagement"><div class="safetyManagementFont">安全管理</div></div>
          <div class="operatingStatus">

            <div class="operatingStatusFont">工厂整体运行状态</div>
          </div>
          <a-row :gutter="24">
            <a-col ></a-col>
          </a-row>
        </div>
  </div>
</template>

<style scoped lang="less">
.main {
   width: 416rem;
   height: 114.1875rem;
  background: radial-gradient(50% 50% at 50% 50%, #0F3B8C 0%, #0E357E 33.17%, #041026 100%);
}
.middleTitle{
  width: 415.8125rem;
  height: 10.19919rem;
  flex-shrink: 0;
  background-image: url("~@/assets/title1.svg");
}
.middleTitleFont{
  text-align: center;
  text-shadow: 0 3.008px 7.519px #010A14;
  font-family: "DingTalk JinBuTi";
  font-size: 3.75rem;
  font-style: normal;
  font-weight: 400;
  line-height: 3.75rem; /* 100% */
  letter-spacing: 0.75rem;

  background: linear-gradient(180deg, #FFF 0%, #96DBF2 66.32%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.cockpit{
  width: 25.96338rem;
  height: 4.8125rem;
  flex-shrink: 0;
  margin-left: 67.92rem;
  margin-top: 2.81rem;
  background-image: url("~@/assets/Group 2785.svg");
}
.cockpitFont{
  text-align: center;
  text-shadow: 0 3.008px 7.519px #010A14;
  font-family: "DingTalk JinBuTi";
  font-size: 2.8125rem;
  font-style: normal;
  font-weight: 400;
  //line-height: 2.8125rem; /* 100% */
  letter-spacing: 0.75rem;

  background: linear-gradient(180deg, #FFF 0%, #DFF7FF 66.32%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.branchPlantProCap{
  width: 25.96338rem;
  height: 4.8125rem;
  flex-shrink: 0;
  margin-left: 94.04rem;
  margin-top: 2.81rem;
  background-image: url("~@/assets/Group 2789.png");
}
.branchPlantProCapFont{
  text-align: center;
  text-shadow: 0 3.008px 7.519px #010A14;
  font-family: "DingTalk JinBuTi";
  font-size: 2.8125rem;
  font-style: normal;
  font-weight: 400;
  //line-height: 2.8125rem; /* 100% */
  letter-spacing: 0.75rem;

  background: linear-gradient(180deg, rgba(177, 245, 255, 0.80) 0%, rgba(150, 219, 242, 0.80) 66.32%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.productionEfficiency{
  width: 26.0625rem;
  height: 4.8125rem;
  flex-shrink: 0;
  margin-left: 296rem;
  background-image: url("~@/assets/Group 2790.svg");
}
.productionEfficiencyFont{
  text-align: center;
  text-shadow: 0 3.008px 7.519px #010A14;
  font-family: "DingTalk JinBuTi";
  font-size: 2.8125rem;
  font-style: normal;
  font-weight: 400;
  //line-height: 2.8125rem; /* 100% */
  letter-spacing: 0.75rem;

  background: linear-gradient(180deg, rgba(177, 245, 255, 0.80) 0%, rgba(150, 219, 242, 0.80) 66.32%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.safetyManagement{
  width: 26.0625rem;
  height: 4.8125rem;
  flex-shrink: 0;
  margin-left: 322rem;
  background-image: url("~@/assets/Group 2791.svg");
}
.safetyManagementFont{
  text-align: center;
  text-shadow: 0 3.008px 7.519px #010A14;
  font-family: "DingTalk JinBuTi";
  font-size: 2.8125rem;
  font-style: normal;
  font-weight: 400;
  //line-height: 2.8125rem; /* 100% */
  letter-spacing: 0.75rem;

  background: linear-gradient(180deg, rgba(177, 245, 255, 0.80) 0%, rgba(150, 219, 242, 0.80) 66.32%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.operatingStatus{
  width: 58.8125rem;
  height: 3.5rem;
  flex-shrink: 0;
  margin-left: 13.8rem;
  background-image: url("~@/assets/Group 1142814701.svg");
}
.operatingStatusFont{
  color: #FFF;
  margin-left: 3.12rem;
  font-family: "DingTalk JinBuTi";
  font-size: 1.8745rem;
  font-style: normal;
  font-weight: 400;
  line-height: 180%; /* 2.81175rem */
  letter-spacing: 0.37488rem;
}
</style>
