.main-content {
  min-width: var(--min-width);
}
/* 头部 */
.topNav {
  min-width: 100%;
  height: 80px;
  font-size: 16px;
  padding-left: 40px;
  background-color: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(10px);
  position: sticky;
  top: 0;
  left: 0;
  z-index: 9;
}
.logoImg {
  width: 31px;
  height: 31px;
}
.topNav .logo {
  cursor: pointer;
}
.logo-title {
  font-weight: 600;
  font-size: 24px;
  margin-left: 4px;
  margin-right: 48px;
}

/* nav导航 */
.navList .nav-item {
  margin-right: 28px;
  position: relative;
  line-height: 22px;
}
.navList .active {
  font-weight: 500;
  color: var(--fn-main);
}
.navList .nav-item:hover {
  color: var(--fn-main-second);
}
.navList .active::after {
  content: "";
  width: 24px;
  height: 2px;
  background: var(--fn-main);
  position: absolute;
  bottom: -4px;
  left: calc(50% - 12px);
}

/* 页面宽度变化时，“更多”tab 样式 */
.fold-nav-show {
  height: 40px;
  line-height: 40px !important;
  position: relative;
  display: none;
}
.down-nav {
  display: none;
}
.fold-nav-show:hover .down-nav {
  display: block;
}


/* “更多”tab hover显示 */
.fold-nav-show .down-nav {
  position: absolute;
  top: 40px;
  left: -20px;
  z-index: 9;
  background: #FFFFFF;
  box-shadow: 0px 7px 25px 0px rgba(175,194,207,0.45);
  border: 1px solid #ECEEF5;
  line-height: 22px;
  border-radius: 4px;
  padding-top: 8px;
  padding-bottom: 8px;
}
.down-nav::after {
  content: "";
  position: absolute;
  top: -18px;
  left: 22px;
  width: 0;
  height: 0;
  border-top: 10px solid transparent; 
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
  border-bottom: 10px solid #FFFFFF;
  z-index: 10;
}
/* “更多”tab hover后选项样式 */
.down-nav li a {
  width: 104px;
  line-height: 22px;
  margin: 0 14px;
  padding: 10px 12px 10px 19px;
}
.down-nav-active, .down-nav li:hover a {
  color: var(--fn-main);
  background: var(--fn-main-bg);
  border-radius: 2px;
}
.down-nav-active {
  font-weight: 600 !important;
}


/* 头部右侧内容 */
.topNav .jump-btn {
  width: 160px;
  height: 80px;
  text-indent: -10px;
  text-align: center;
  line-height: 80px;
  background: var(--fn-main);
  font-weight: 500;
  color: #FFFFFF;
}
.topNav .divider-line {
  width: 1px;
  height: 15px;
  background: #C1D3E8;
}
/* APP按钮hover效果 */
.topNav .app-btn {
  width: 68px;
  height: 24px;
  text-align: center;
  line-height: 22px;
  border-radius: 12px;
  border: 1px solid var(--fn-main);
  font-weight: 500;
  font-size: 12px;
  color: var(--fn-main);
  position: relative;
}
.topNav .app-btn .scan {
  position: absolute;
  top: 36px;
  right: 0;
  background: #FFFFFF;
  box-shadow: 0px 7px 25px 0px rgba(175,194,207,0.45);
  border: 1px solid #ECEEF5;
  z-index: 9;
  line-height: 22px;
  border-radius: 4px;
  display: none;
}
.down-icon {
  position: absolute;
  top: -18px;
  right: 24px;
  width: 0;
  height: 0;
  border-top: 10px solid transparent; 
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
  border-bottom: 10px solid #FFFFFF;
  z-index: 10;
}
.topNav .app-box {
  height: 60px;
  display: flex;
  align-items: center;
  margin-right: 40px;
}
.topNav .app-box:hover .scan {
  display: flex;
}


/* 页面底部 */
.footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 0 auto;

  /* 联系我们拿掉了，直接底部加背景图 */
  background-image: url(https://cdn.uxianxin.com/app/html/uxianxin-pc/footer/footer-bg.png);
  background-size: cover;
  background-repeat: no-repeat;
  color: #FFFFFF;
  height: 240px;
  padding: 70px 40px 40px;
}

/* 联系我们--被拿掉了display: none;，其他样式暂时保留 */
.footer-call {
  /* width: 100%;
  height: 288px;
  background-image: url(https://cdn.uxianxin.com/app/html/uxianxin-pc/footer/footer-bg.png);
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #FFFFFF; */

  display: none;
}
.footer-call-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.footer-title {
  font-size: 32px;
}
.footer-phone-box {
  height: 50px;
  background: #FFFFFF;
  border-radius: 4px;
  display: flex;
  align-items: center;
  margin-top: 40px;
}
.footer-phone-box input {
  width: 280px;
  height: 48px;
  line-height: 48px;
  padding: 0 24px;
  background: #FFFFFF;
  border-radius: 4px 0px 0px 4px;
  border: none;
  font-size: 16px;
  letter-spacing: 1px;
  outline: 1px solid #FFFFFF;
}
.footer-phone-box .input-btn{
  width: 120px;
  height: 42px;
  border-radius: 4px;
  line-height: 42px;
  text-align: center;
  background: var(--fn-main);
  font-size: 16px;
  color: #FFFFFF;
  font-weight: 400;
  margin: 0 4px;
  cursor: pointer;
  font-family: AlimamaShuHeiTi;
}
.footer-phone-box .input-btn:hover {
  background: var(--btn-main-second);
}

/* 底部信息--联系我们拿掉了--内容直接铺满底部高度 */
.footer-content {
  width: var(--min-width);
  /* height: 240px;
  padding: 70px 40px 40px; */
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  height: 100%;
}
.footer-content-left {
  display: flex;
  align-items: flex-start;
}
.footer-left-call {
  margin-right: 50px;
}
.call-number {
  font-size: 24px;
  margin-top: 8px;
  font-family: AlimamaShuHeiTi;
}
.footer-left-address p {
  margin-top: 8px;
}
.footer-left-address p:first-of-type {
  margin-top: 0;
}
.footer-left-address .opening-hours {
  font-size: 18px;
  font-family: AlimamaShuHeiTi;
}
.footer-content-right {
  display: flex;
  justify-content: center;
  align-items: center;
}
/* 底部右侧二维码 */
.QR-box {
  margin-top: -16px;
  text-align: center;
}
.footer-content-right .QR-box+.QR-box {
  margin-left: 24px;
}
.QR-code {
  width: 116px;
  height: 116px;
  margin-bottom: 8px;
}

/* ====================以下的多页面共用的样式========================== */

/* 轮播图上的button */
.banner-btn {
  width: 160px;
  height: 52px;
  line-height: 52px;
  text-align: center;
  background: var(--fn-main);
  border-radius: 4px;
  font-size: 22px;
  color: #FFFFFF;
  font-weight: 400;
  cursor: pointer;
  margin-top: 48px;
}
.banner-btn:hover {
  background: var(--btn-main-second);
}

/* 主体内容部分 垂直居中 */
.content-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 auto;
}

/* 各个模块主页面的顶部banner */
.main-page-banner-box {
  width: 100%;
  position: relative;
  height: 620px;
  margin-top: -80px;
  background-size: cover;
  background-repeat: no-repeat;
  font-family: AlimamaShuHeiTi;
}
/* banner图上的内容部分 */
.main-page-banner-box .main-page-banner-content {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 3;
  width: var(--min-width);
  top: 192px;
}
.main-page-banner-title {
  font-size: 44px;
  font-family: AlimamaShuHeiTi;
  margin-bottom: 20px;
}
.main-page-banner-tip {
  font-size: 20px;
  line-height: 36px;
}

/* 主页面的tab */
.main-page-tab {
  height: 62px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin-top: -30px;
  background: #FFFFFF;
  border-radius: 4px;
  z-index: 3;
  box-shadow: 0px 3px 15px 0px rgba(215,221,228,0.38);
  max-width: 100%;
  overflow: hidden;
}
.main-page-tab .tab-block-txt {
  height: 60px;
  line-height: 60px;
  cursor: pointer;
}
.main-page-tab .tab-block-active {
  position: relative;
  color: var(--fn-main);
}
.main-page-tab .tab-block-active::after {
  content: "";
  width: calc(100% - 4px);
  height: 3px;
  background: var(--fn-main);
  position: absolute;
  bottom: -1px;
  left: 2px;
}
.main-page-tab .tab-block-txt:hover {
  color: var(--fn-main-second);
}
.main-page-tab-sticky {
  position: sticky;
  top: 0;
  left: 0;
  z-index: 9;
  box-shadow: none;
  border-bottom: 1px solid #F0F2F5;;
}

.main-block-title {
  font-size: 14px;
  margin-top: 80px;
}
.main-block-tip {
  font-size: 32px;
  font-family: AlimamaShuHeiTi;
  margin-top: 10px;
}

/* 主页面上一些tab的小动画 */
.animation-box {
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.animation-item-box {
  position: relative;
  margin-top: 40px;
}
.animation-item {
  width: 100%;
  height: 100%;
  line-height: 26px;
  background: #F1F6FB;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 4px;
  font-family: YaHei;
}

.animation-content {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
}
.animation-item-title {
  font-size: 24px;
  font-family: AlimamaShuHeiTi;
}
.animation-item-txt {
  font-size: 16px;
  margin-top: 16px;
}
.animation-bg {
  position: absolute;
  right: 0;
  bottom: 0;
  opacity: 0.1;
  z-index: 1;
}

.animation-item-box:hover .animation-item {
  animation: animation-item-up .1s linear both;
}
@keyframes animation-item-up {
  from {
    top: 0px;
  }
  to {
    top: -10px;
  }
}
.animation-item-box:hover .animation-bg {
  animation: show .1s linear both;
}
@keyframes show {
  from {
    opacity: 0.1;
  }
  to {
    opacity: 1;
  }
}

/* 图片预览相关 */
.full-box {
  width: var(--min-width);
  display: flex;
  justify-content: center;
  padding: 11px 0;
  border: 1px solid #EBECEF;
  margin-top: 40px;
  position: relative;
}
.full-icon {
  position: absolute;
  bottom: 32px;
  right: 8px;
  width: 32px;
  height: 32px;
  cursor: pointer;
}


/* 预览图片的遮罩 */
.preview-modal {
  position: fixed;  
  z-index: 999;  
  left: 0;  
  top: 0;  
  width: 0;  
  height: 0;  
  overflow: auto;  
  display: flex;
  align-items: center;
  justify-content: center;  
}
/* 淡入显示 */
.fadeIn {
  background-color: rgba(0, 0, 0, 0.6);
  animation: fadeIn .2s ease-in-out both; 
}
/* 淡出 */
.fadeOut {
  background-color: rgba(0, 0, 0, 0.6);
  animation: fadeOut .2s ease-in-out both;
}
/* 模态框中的内容 */  
.preview-modal .modal-content {
  display: inline-block;  
  position: relative;  
}
/* 关闭按钮 */  
.preview-modal .modal-content .close-btn {  
  position: absolute;  
  top: 18px;  
  right: 18px;  
  width: 24px;
  height: 24px; 
  transition: 0.3s;  
  cursor: pointer; 
  background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/icon/close-icon.png');
  background-size: 100%;
  background-repeat: no-repeat; 
} 
.preview-modal .modal-content .close-btn:hover {
  background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/icon/close-hover-icon.png');
}
/* 预览的图片 */
.preview-modal .modal-content .modal-image {
  max-height: 90vh;
  max-width: 90vw;
  -o-object-fit: contain;
  object-fit: contain;
}
/* 图片放大显示 */
.fadeIn .modal-content {
  animation: scaleUp .3s ease-in-out both; 
}
/* 图片缩小隐藏 */
.fadeOut .modal-content { 
  animation: scaleDown .3s ease-in-out both; 
}

/* 遮罩动画 淡入 淡出 */  
@keyframes fadeIn {  
  0% {opacity: 0;}  
  100% {opacity: 1;}  
}  
@keyframes fadeOut {  
  0% {opacity: 1;} 
  100% {opacity: 0;}
}

/* 图片动画 放大 缩小 */
@keyframes scaleUp {
  0% {transform: scale(0.5);}  
  100% {transform: scale(1);}  
}
@keyframes scaleDown {
  0% {transform: scale(1);}  
  100% {transform: scale(0);}  
}

/* 各个主页面上-图文左右布局 */
.main-block-bottom {
  width: var(--min-width);
  display: flex;
  justify-content: space-between;
}
/* 左侧文字 */
.main-block-bottom>.block-bottom-content {
  font-size: 16px;
  line-height: 32px;
  color: var(--fn3);
  text-align: left;
}
/* 左侧文字1,2,3 */
.main-block-bottom>.block-bottom-content>.part-title {
  color: var(--fn1);
  font-size: 20px;
  font-family: AlimamaShuHeiTi;
  margin-top: 16px;
}
/* 立即咨询按钮 */
.main-block-btn {
  display: inline-block;
  width: 96px;
  height: 36px;
  text-align: center;
  line-height: 32px;
  border-radius: 4px;
  margin-top: 24px;
  cursor: pointer;
  font-size: 16px;
  /* border: 1px solid #C9CDD5; */
  border: 1px solid var(--fn-main);
  color: var(--fn-main);

}
.main-block-btn:hover {
  /* color: var(--fn-main);
  border-color: var(--fn-main); */
  background: var(--fn-main);
  color: #FFFFFF;
}

/* 工单和巡检页面上的-产品工单，tab区块内容 */
.main-block-tab {
  width: var(--min-width);
  display: flex;
  justify-content: center;
  align-items: center;
  height: 120px;
  font-size: 20px;
}
.main-block-tab .main-block-tab-item {
  margin-right: 120px;
  cursor: pointer;
}
.main-block-tab .main-block-tab-item:last-of-type {
  margin-right: 0;
}
.main-block-tab-item:hover {
  color: var(--fn-main-second);
}
.main-block-tab .main-block-tab-item-active {
  position: relative;
  color: var(--fn-main);
}
.main-block-tab-item-active::after {
  content: "";
  width: calc(100% - 16px);
  height: 2px;
  background: var(--fn-main);
  position: absolute;
  bottom: -8px;
  left: 8px;
}
.main-block-tab-box {
  background: #F7F9FB;
  border-radius: 2px;
  width: var(--min-width);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.main-block-tab-box .main-block-tab-content {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  opacity: 0;
  transition: opacity .5s;
  padding: 24px;
  display: flex;
  overflow: hidden;
}
.main-block-tab-box .main-block-tab-content-show {
  opacity: 1;
  z-index: 2;
}
.main-block-tab-box .main-block-tab-content-right {
  margin-left: 32px;
}
.main-block-tab-box .main-block-tab-content-title {
  font-size: 18px;
  margin-top: 50px;
  margin-bottom: 24px;
  font-family: AlimamaShuHeiTi;
}
.main-block-tab-box .block-tab-content-label {
  font-family: AlimamaShuHeiTi;
  color: var(--fn1);
}
.main-block-tab-box .main-block-tab-content-txt {
  font-size: 16px;
  line-height: 26px;
  color: var(--fn2);
}

#backToTop {
  position: fixed;
  bottom: -100px;
  right: 10px;
  width: 94px;
  height: 94px;
  border-radius: 50%;
  cursor: pointer;
  background-image: url(https://cdn.uxianxin.com/app/html/uxianxin-pc/icon/back-top.png);
  background-repeat: no-repeat;
  background-size: 100%;
  z-index: 99;
}
.show-top {
  bottom: 80px !important;
}
.show-top:hover {
  background-image: url(https://cdn.uxianxin.com/app/html/uxianxin-pc/icon/back-top-hover.png) !important;
}

/* 立即咨询-客服微信弹框 */
.kefu-QR-alert {
  width: 560px !important;
  height: 490px;
}
.kefu-QR-alert .el-message-box__headerbtn .el-icon-close:before {
  display: none;
}
.kefu-QR-alert .el-message-box__headerbtn {
  width: 24px;
  height: 24px;
  background-image: url(https://cdn.uxianxin.com/app/html/uxianxin-pc/icon/close-icon-s.png) !important;
  background-repeat: no-repeat !important;
  background-size: 100% !important;
}
.kefu-box {
  height: 380px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.kefu-code {
  width: 292px;
  height: 292px;
}
.kefu-tip {
  font-size: 24px;
  color: var(--fn1);
  font-family: AlimamaShuHeiTi;
  margin-top: 24px !important;
}

/* 预约成功提示语 */
.success-reservation-tip .el-message__icon {
  display: none;
}
.success-reservation-tip {
  min-width: 116px !important;
  padding: 0 !important;
  border-radius: 8px !important;
  top: 60px !important;
}
.success-reservation-tip .msg-box {
  width: 116px;
  height: 40px;
  background: #00BE81 !important;
  box-shadow: 0px 5px 24px 0px rgba(87,159,160,0.2);
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px !important;
  color: #FFFFFF !important;
}
.success-reservation-tip .success-icon {
  width: 16px;
  height: 16px;
  margin-right: 4px;
}


/* 自适应相关的 */

/* 首页banner图-根据宽度变化更换图片 */
.index-banner-item0 {
  background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/index/index-banner1.png');
}
.index-banner-item1 {
  background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/index/index-banner0.png');
}

.main-page-banner-finance {
  background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/finance/banner-bg.png');
}
.main-page-banner-oa {
  background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/oa/banner-bg.png');
}
.main-page-banner-work-order {
  background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/workOrder/banner-bg.png');
}
.main-page-banner-patrol {
  background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/patrol/banner-bg.png');
}
.main-page-banner-park {
  background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/park/banner-bg.png');
}
.main-page-banner-ai {
  background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/ai/banner-bg.png');
}
.main-page-banner-aboutUs {
  background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/aboutUs/banner-bg.png');
}

/* 当屏幕宽度小于或等于1600像素时，显示不同是下拉选项 */
@media (max-width: 1600px) {
  /* 顶部导航折叠 */
  .fold-nav-hidden1600 {
    display: none;
  }
  .fold-nav-show1600 {
    display: block;
  }
}
/* 当屏幕宽度小于或等于1530像素 */
@media (max-width: 1530px) {
  /* 顶部导航折叠 */
  .fold-nav-hidden1530,
  .fold-nav-show1600 {
    display: none;
  }
  .fold-nav-show1530 {
    display: block;
  }
}

/* 当屏幕宽度小于或等于1460像素时，应用以下样式 */
@media (max-width: 1460px) {
  /* 顶部导航折叠 */
  .fold-nav-hidden1460,
  .fold-nav-show1530 {
    display: none;
  }
  .fold-nav-show1460 {
    display: block;
  }
}

/* 当屏幕宽度小于或等于1400像素时，应用以下样式 */
@media (max-width: 1400px) {
  /* 顶部导航折叠 */
  .fold-nav-hidden1400,
  .fold-nav-show1460 {
    display: none;
  }
  .fold-nav-show1400 {
    display: block;
  }

  /* 首页banner图切换 */
  .index-banner-item, .index-banner-box {
    height: 560px;
  }
  .index-banner-item0 {
    background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/index/index-banner1-s.png');
  }
  .index-banner-item1 {
    background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/index/index-banner0-s.png');
  }
  /* 首页banner图上文字位置调整 */
  .index-banner-item0 .index-banner-content {
    top: 200px;
    padding-left: 40px;
  }
  .index-banner-item1 .index-banner-content {
    top: 180px;
    padding-left: 40px;
  }

  /* 各个模块主页面banner */
  .main-page-banner-box {
    height: 500px;
  }
  /* banner上的内容部分 */
  .main-page-banner-box .main-page-banner-content {
    top: 150px;
    padding-left: 40px;
  }
  /* 财务banner图切换 */
  .main-page-banner-finance {
    background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/finance/banner-bg-s.png');
  }
  /* 人事 */
  .main-page-banner-oa {
    background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/oa/banner-bg-s.png');
  }
  /* 工单 */
  .main-page-banner-work-order {
    background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/workOrder/banner-bg-s.png');
  }
  /* 巡检 */
  .main-page-banner-patrol {
    background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/patrol/banner-bg-s.png');
  }
  /* 停车 */
  .main-page-banner-park {
    background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/park/banner-bg-s.png');
  }
  /* ai */
  .main-page-banner-ai {
    background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/ai/banner-bg-s.png');
  }
  /* 关于我们 */
  .main-page-banner-aboutUs {
    background-image: url('https://cdn.uxianxin.com/app/html/uxianxin-pc/aboutUs/banner-bg-s.png');
  }
}