root {
  --main-color: #343399;
}
button:focus {
  outline:none!important;
}
.view-warp {
  min-height: 100vh;
}
.limit {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.limit-4 {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}
.limit-8 {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 7;
  -webkit-box-orient: vertical;
}
 .search-box {
  position: absolute;
  left: 0;
  bottom: -80px;
  padding: 10px 20px;
  width: 100%;
  text-align: center;
}
.search-box .input-group {
  max-width: 800px;
  margin: 0 auto;
}
.empty {
  background-image: url(./empty.svg);
  background-repeat: no-repeat;
  text-align: center;
  background-position: center;
  padding-top: 163px;
  min-height: 240px;
}
.card-right {
  text-align: left;
}
.card-box {
  padding: 20px 0 0 0;
}

.btn-back {
  position: absolute;
  cursor: pointer;
  left: 10px;
  top: 10px;
}
.header {
  position: relative;
  color: #fff;
  background-color: #6599ff;
  
}
.header-place {
  position: relative;
  color: #fff;
  padding: 0 25px 25px;
  background-color: #9a99ff;
}
.header-corp {
  position: relative;
  color: #fff;
  padding: 25px;
  background-color: #3398cc;
  padding: 25px;
}
.header .container {
  min-height: 200px;
  background-image: none;
  background-repeat: no-repeat;
  background-position: right center;
}
.view-body {
  min-height: calc(100vh - 350px);
}

.card {
  padding: 20px;
  background-color: #f2f2f2;
}
.card-title {
  font-size: 22px;
  color: var(--main-color);
  font-weight: 900;
}
.card-qr-text {
  max-width: 160px;
  margin: 0 auto;
  background-color: var(--main-color);
  border-radius: 40px;
  color: #fff;
  font-size: 14px;
  text-align:center;
  padding: 4px 0;
  font-weight: 700;
}
.card-qr-img {
  text-align: center;
}
.btn-login {
  color: #fff;
  padding-left:0;
}
.btn-login:hover, .btn-login:focus, .btn-login:active {
  color: #fff;
}
.card-text-red {
  font-size: 22px;
  color: #ff6766;
}

.icon-add, .icon-agent, .icon-tel, .icon-job, .icon-biref {
  white-space: nowrap;
  padding-left: 20px;
  background-repeat: no-repeat;
  background-position-x: 0px;
  background-image: url(./icon-addr.svg);
}
.icon-agent {
  background-image: url(./icon-agent.svg);
}
.icon-tel {
  background-image: url(./icon-tel.svg);
}
.icon-job {
  background-image: url(./icon-job.svg);
}
.icon-biref {
  background-image: url(./icon-biref.svg);
}


@media (min-width: 768px) {
  .header .container {
    min-height: 200px;
    background-image: url(../../Images/index_head.png) !important;
    background-repeat: no-repeat;
    background-position: right center;
  }

  .card-right {
    text-align: right;
  }

  .card-box {
    padding: 20px;
  }

  .header-corp {
    padding: 0 25px;
  }
  .header-place {
    padding: 0 25px;
  }
 }