@charset "utf-8";

.workbench {
  width: 100%;
}

.workbench .system-menu {
  background: rgb(0, 157, 219);
  color: rgb(255, 255, 255);
  width: 200px;
  float: left;
}

.workbench .system-dashboard {
  width: auto;
  float: left;
}

.workbench .system-info {
  background: rgb(0, 157, 219);
  color: rgb(255, 255, 255);
}

.workbench .system-button {
  background: rgb(0, 157, 219);
  color: rgb(255, 255, 255);
  border: 1px solid rgb(0, 0, 0);
  width: 100%;
  float: right;
}

* {
  margin: 0px;
  padding: 0px;
}

ul li {
  list-style: none;
}

html,
body {
  width: 100%;
  height: 100%;
}

body {
  overflow: auto !important;
}

.navbar {
  z-index: 1;
}

.menus-list {
  margin: 2% auto 0px;
  overflow: hidden;
  text-align: center;
}

.menus-row {
  display: inline-block;
  margin: 0px auto;
  overflow: hidden;
  text-align: center;
  float: left;
}

.menus-row + .menus-row {
  margin-top: 40px;
}

.menus-row + .menus-row .menus-option + .menus-option {
  margin-left: 70px;
}

.menus-option {
  position: relative;
  padding-top: 40px;
  width: 220px;
  height: 220px;
  float: left;
  background: linear-gradient(180deg, #75e8ff, #02ddf5);
  border-radius: 50%;
  border-radius: 50%;
  box-sizing: border-box;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  color: rgb(255, 255, 255);
  font-size: 20px;
  font-family: AlibabaPuHuiTiR;
}

.menus-option:hover,
.menus-option:visited,
.menus-option:link,
.menus-option:active {
  color: rgb(255, 255, 255);
}

.menus-option {
  margin-left: 35px;
  margin-bottom: 20px;
}

.menus-option[name='EDI'] {
  background: linear-gradient(rgb(117, 232, 255), rgb(2, 221, 245));
}

.menus-option[name='OMS'] {
  background: linear-gradient(rgb(255, 178, 127), rgb(255, 123, 36));
}

.menus-option[name='BMS'] {
  background: linear-gradient(rgb(37, 245, 144), rgb(0, 191, 102));
}

.menus-option[name='TMS'] {
  background: linear-gradient(rgb(106, 175, 247), rgb(0, 120, 248));
}

.menus-option[name='LMDM'] {
  background: linear-gradient(0deg, rgb(84, 78, 252), rgb(151, 158, 252));
}

.menus-option[name='BILL'] {
  background: linear-gradient(rgb(255, 216, 117), rgb(255, 178, 36));
}

.menus-option[name='APP'] {
  background: linear-gradient(rgb(255, 133, 182), rgb(250, 67, 140));
}

.menus-option[name='BILLING'] {
  background: linear-gradient(180deg, #ffd875, #ffb224);
}

.menus-option[name='LING'] {
  background: linear-gradient(180deg, #ffd875, #ffb224);
}

.menus-option[name='TUI'] {
  background: linear-gradient(rgb(255, 133, 182), rgb(250, 67, 140));
}

.menus-option[name='MENHU'] {
  background: linear-gradient(rgb(106, 175, 247), rgb(0, 120, 248));
  border-radius: 50%;
}

.menus-option[name='RF'] {
  background: linear-gradient(rgb(37, 245, 144), rgb(0, 191, 102));
  border-radius: 50%;
}

.menus-option[name='FAHG'] {
  background: linear-gradient(rgb(117, 232, 255), rgb(2, 221, 245));
}

.menus-option[name='SECURITYMGR'] {
  background: linear-gradient(rgb(220, 170, 255), rgb(150, 100, 220));
  border-radius: 50%;
}

.menus-option[name='SECURITYMGR1'] {
  background: linear-gradient(rgb(220, 170, 255), rgb(150, 100, 220));
}


a.menus-option > span[name='RFQrCode'] {
  background-size: 100% !important;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  display: none;
}

a.menus-option:hover > span[name='RFQrCode'] {
  display: block;
}

div.main-wrap-li:hover span[name='RFQrCode'] {
  display: block;
}

#page-content .menus-list > li:first-child {
  float: left;
  font-size: 25px;
  color: #3d4cf2;
  line-height: 190px;
  text-anchor: middle;
  margin-left: 50px;
  width: 100px;
  display: none;
}

#page-content.page-content-cn .menus-list > li:first-child {
  width: 310px;
}

#page-content.page-content-cn .menus-list > .menus-row .menus-option {
  font-size: 13px;
}

#page-content.page-content-cn
  .menus-list
  > .menus-row
  .menus-option
  > .menus-option-span {
  width: 116px;
  display: inline-block;
  position: relative;
  top: -14px;
}
span[name='RFQrCode'] {
  width: 75px;
  height: 75px;
  background-size: 100% 100%;
  position: absolute;
  top: -20px;
  left: -20px;
  display: none;
}

a.menus-option > #sit,
div.main-wrap-li #sit {
  background-image: url('../img/sit_qrcode.png');
}

a.menus-option > #pet,
div.main-wrap-li #pet {
  background-image: url('../img/pet_qrcode.png');
}

a.menus-option > #uat1,
div.main-wrap-li #uat1 {
  background-image: url('../img/uat1_qrcode.png');
}

a.menus-option > #uat2,
div.main-wrap-li #uat2 {
  background-image: url('../img/uat2_qrcode.png');
}

a.menus-option > #uat,
div.main-wrap-li #uat {
  background-image: url('../img/uat_qrcode.png');
}

a.menus-option > #others,
div.main-wrap-li #others {
  background-image: url('../img/others_qrcode.png');
}

a.menus-option > #prod,
div.main-wrap-li #prod {
  background-image: url('../img/prod_qrcode.png');
}

a.menus-option > #prod-eu,
div.main-wrap-li #prod-eu {
  background-image: url('../img/prod-eu_qrcode.png');
}

a.menus-option > #osit,
div.main-wrap-li #osit {
  background-image: url('../img/osit_qrcode.png');
}

a.menus-option > #osit-eu,
div.main-wrap-li #osit-eu {
  background-image: url('../img/osit-eu_qrcode.png');
}

a.menus-option > #odev,
div.main-wrap-li #odev {
  background-image: url('../img/odev_qrcode.png');
}

a.menus-option > #osit-in,
div.main-wrap-li #osit-in {
  background-image: url('../img/osit-in_qrcode.png');
}

a.menus-option > #osit-in-fine,
div.main-wrap-li #osit-in-fine {
  background-image: url('../img/osit-in-fine_qrcode.png');
}

a.menus-option > #ouat-in,
div.main-wrap-li #ouat-in {
  background-image: url('../img/ouat-in_qrcode.png');
}

a.menus-option > #ouat-in-fine,
div.main-wrap-li #ouat-in-fine {
  background-image: url('../img/ouat-in-fine_qrcode.png');
}

a.menus-option > #uat-in,
div.main-wrap-li #uat-in {
  background-image: url('../img/uat-in_qrcode.png');
}

a.menus-option > #uat-in-fine,
div.main-wrap-li #uat-in-fine {
  background-image: url('../img/uat-in-fine_qrcode.png');
}

a.menus-option > #uat-in-gray,
div.main-wrap-li #uat-in-gray {
  background-image: url('../img/uat-in-gray_qrcode.png');
}

a.menus-option > #prod-in,
div.main-wrap-li #prod-in {
  background-image: url('../img/prod-in_qrcode.png');
}

a.menus-option > #prod-in-fine,
div.main-wrap-li #prod-in-fine {
  background-image: url('../img/prod-in-fine_qrcode.png');
}

a.menus-option > #prod-in-gray,
div.main-wrap-li #prod-in-gray {
  background-image: url('../img/prod-in-gray_qrcode.png');
}

.menus-option i {
  display: block;
  width: 100px;
  height: 100px;
  margin: 0px auto 20px;
  background: url('../img/icon_moren.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='OMS'] i {
  background: url('../img/icon_dingdan.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='TMS'] i {
  background: url('../img/icon_yunshu.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='BMS'] i {
  background: url('../img/icon_jiesuan.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='LMDM'] i {
  background: url('../img/icon_jichushuju.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='BILL'] i {
  background: url('../img/icon_jifeiyinqing.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='APP'] i {
  background: url('../img/icon_yingyong.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='BILLING'] i {
  background: url('../img/icon_jifeiyinqing.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='WMS'] i {
  background: url('../img/WMS.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='SCWMS'] i {
  background: url('../img/SCWMS.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='INV'] i {
  background: url('../img/INV.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='MENHU'] i {
  background: url('../img/icon_mendian.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='LING'] i {
  background: url('../img/icon_moren.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='TUI'] i {
  background: url('../img/icon_jiekou.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='FANG'] i {
  background: url('../img/icon_yunshu.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='RF'] i {
  background: url('../img/icon_yingyong.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='SECURITYMGR'] i {
  background: url('../img/icon_security.png') 0% 0% / 100px no-repeat;
}

.menus-option[name='SECURITYMGR1'] i {
  background: url('../img/icon_security1.png') 0% 0% / 100px no-repeat;
}

.menus-option:hover i {
  background-position: center center;
  background-size: 90px;
}

@media screen and (min-height: 700px) {
  .menus-list {
    margin-top: 5%;
  }
}

@media screen and (min-width: 1366px) {
  .menus-list {
    width: 81%;
  }
}

@media screen and (max-width: 970px) {
  .dashboard-main {
    height: calc(100% - 50px);
    overflow: auto;
  }

  .menus-row + .menus-row {
    padding: 0px;
    width: 100%;
  }

  .menus-option {
    margin-bottom: 20px;
    margin-left: 8% !important;
  }
}

@media screen and (max-height: 1400px) {
  .menus-list {
    margin: 2% auto 0;
  }

  .menus-option {
    padding-top: 16px;
    width: 180px;
    height: 180px;
    font-size: 18px;
  }

  .menus-option i {
    background-position: center center;
    /*background-size: 90%!important;*/
    margin: 0px auto 10px;
  }
}

.modal-backdrop {
  z-index: 0;
}

#siteLogo img {
  margin-top: 4px;
  height: 35px;
}

.badge__content {
  height: 8px;
  width: 8px;
  min-width: 8px;
  padding: 0;
  right: -10px;
  border-radius: 50%;
  border: 1px solid #fff;
  position: absolute;
  background-color: #f24130;
  border-radius: 8px;
  color: #fff;
  display: inline-block;
  font-size: 12px;
  line-height: 16px;
  padding: 0 4px;
  text-align: center;
  white-space: nowrap;
  border: none;
  min-width: 8px;
}

.el-tooltip.announce-title {
  font-weight: bold;
  cursor: pointer;
}

.el-tooltip.announce-title:hover {
  color: #3081f2;
}