/* zjmf technology-simple visual system */
:root {
  --zj-ink: #081525;
  --zj-ink-2: #10243a;
  --zj-cyan: #27d4d8;
  --zj-blue: #2b83ff;
  --zj-amber: #f4b64b;
  --zj-bg: #f4f7fa;
  --zj-line: #dce6ee;
  --zj-muted: #647588;
}

html,
body {
  background: var(--zj-bg);
  color: var(--zj-ink);
  font-family: "Inter", "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: 0;
}

body {
  overflow-x: hidden;
}

a {
  color: var(--zj-blue);
  transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease;
}

a:hover,
a:focus {
  color: var(--zj-cyan);
  text-decoration: none;
}

.header {
  min-height: 72px;
  background: rgba(8, 21, 37, .94);
  border-bottom: 1px solid rgba(39, 212, 216, .24);
  box-shadow: 0 8px 24px rgba(8, 21, 37, .16);
}

body.index .header.fixed,
body.index.modules_transfer .header,
body.index.modules_authentication .header,
body.index.modules_invoiceManager .header {
  background: var(--zj-ink);
  box-shadow: 0 10px 28px rgba(8, 21, 37, .2);
}

.header .navbar,
.header .navbar-default,
.header .navbar-collapse {
  background: transparent;
  border: 0;
}

.header .navbar-brand {
  height: 72px;
  background-size: contain !important;
  background-position: left center !important;
}

.header .navbar-nav > li > a,
.header .navbar-right > li > a,
.header .login a {
  color: rgba(244, 247, 250, .82);
  font-weight: 500;
  line-height: 72px;
  padding-top: 0;
  padding-bottom: 0;
}

.header .navbar-nav > li > a:hover,
.header .navbar-nav > li > a:focus,
.header .navbar-right > li > a:hover {
  color: var(--zj-cyan);
  background: transparent;
}

.header .navbar-nav > li.register > a {
  color: var(--zj-ink);
  background: var(--zj-cyan);
  border-radius: 4px;
  line-height: 38px;
  margin-top: 17px;
  padding: 0 18px;
}

.header .navbar-nav > li.register > a:hover {
  color: var(--zj-ink);
  background: var(--zj-amber);
}

.header .dropdown-menu {
  border: 1px solid var(--zj-line);
  border-top: 2px solid var(--zj-cyan);
  border-radius: 0 0 5px 5px;
  box-shadow: 0 18px 34px rgba(8, 21, 37, .14);
  background: #fff;
}

.header .dropdown-menu a {
  color: var(--zj-ink-2);
}

.header .dropdown-menu a:hover {
  color: var(--zj-blue);
  background: #edfafd;
}

.wrap-main-swiper,
.wrap-main-swiper .swiper-container,
.wrap-main-swiper .swiper-slide {
  min-height: 560px;
}

.wrap-main-swiper .swiper-slide {
  background-color: var(--zj-ink) !important;
  background-position: center;
  background-size: cover;
}

.wrap-main-swiper .swiper-slide::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(8, 21, 37, .9), rgba(8, 21, 37, .44) 58%, rgba(8, 21, 37, .2));
}

.wrap-main-swiper .content-slide {
  position: relative;
  z-index: 1;
  height: 560px;
  padding-top: 165px;
}

.wrap-main-swiper .content-slide .slogan {
  color: #fff;
  font-size: 48px;
  font-weight: 650;
  letter-spacing: .02em;
  line-height: 1.18;
}

.wrap-main-swiper .content-slide .sub-slogan {
  color: rgba(244, 247, 250, .76);
  line-height: 1.8;
}

.wrap-main-swiper .content-slide .event-title {
  color: var(--zj-cyan);
  font-size: 16px;
}

.swiper-pagination-bullet {
  background: rgba(255,255,255,.55);
  opacity: 1;
}

.swiper-pagination-bullet-active {
  background: var(--zj-cyan);
}

.swiper-btn-prev,
.swiper-btn-next {
  color: #fff;
  background: rgba(8, 21, 37, .54);
  border: 1px solid rgba(39, 212, 216, .34);
  border-radius: 4px;
}

.space,
.space2x {
  background: var(--zj-bg);
}

.newHome-service {
  padding: 72px 0 78px;
}

.hosu-quick-strip {
  position: relative;
  z-index: 2;
  margin: -1px auto 0;
  padding: 18px 0;
  background: #fff;
  border-bottom: 1px solid #e5eef7;
  box-shadow: 0 8px 20px rgba(33, 81, 128, .05);
}

.hosu-quick-strip .container {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
}

/* Bootstrap's clearfix pseudo-elements must not become grid items. */
.hosu-quick-strip .container::before,
.hosu-quick-strip .container::after {
  display: none;
}

.hosu-quick-entry {
  display: flex;
  align-items: center;
  min-height: 64px;
  padding: 8px 24px;
  border-right: 1px solid #edf2f7;
}

.hosu-quick-entry:last-child {
  border-right: 0;
}

.hosu-quick-entry:hover {
  background: #f7fbff;
}

.hosu-quick-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  margin-right: 12px;
  border-radius: 50%;
  background: #e8f3ff;
  color: #1468e8;
  font-size: 18px;
}

.hosu-quick-copy strong,
.hosu-quick-copy span {
  display: block;
}

.hosu-quick-copy strong {
  color: #1b2f47;
  font-size: 15px;
  font-weight: 650;
}

.hosu-quick-copy span {
  margin-top: 5px;
  overflow: hidden;
  color: #71859a;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hometitleSpan span,
.module-title {
  color: var(--zj-ink);
  font-weight: 650;
  letter-spacing: .02em;
}

.hometitleSpan span::after,
.module-title::after {
  content: "";
  display: block;
  width: 42px;
  height: 3px;
  margin: 18px auto 0;
  background: var(--zj-cyan);
}

.newHome-service .tac > span {
  color: var(--zj-muted) !important;
}

.service-div-content {
  height: auto;
  min-height: 360px;
  padding: 38px 30px 32px;
  background: #fff;
  border: 1px solid var(--zj-line);
  border-radius: 6px;
  box-shadow: 0 10px 26px rgba(17, 43, 68, .06);
}

.service-div-content:hover {
  background: #fff;
  border-color: var(--zj-cyan);
  box-shadow: 0 16px 32px rgba(39, 212, 216, .15);
  transform: translateY(-5px);
}

.service-div-text > div:first-child {
  color: var(--zj-ink);
  font-weight: 650;
  font-size: 20px;
}

.service-div-text > div:last-child {
  color: var(--zj-muted);
  line-height: 1.8;
}

.understand-btn a {
  color: var(--zj-blue) !important;
  border-color: var(--zj-blue) !important;
  border-radius: 4px;
}

.understand-btn a:hover {
  color: var(--zj-ink) !important;
  background: var(--zj-cyan) !important;
  border-color: var(--zj-cyan) !important;
}

.newHomePage {
  position: relative;
  overflow: hidden;
  background: var(--zj-ink);
  border-top: 1px solid rgba(39, 212, 216, .18);
  border-bottom: 1px solid rgba(39, 212, 216, .18);
}

.newHomePage::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .18;
  background-image: linear-gradient(rgba(39,212,216,.2) 1px, transparent 1px), linear-gradient(90deg, rgba(39,212,216,.2) 1px, transparent 1px);
  background-size: 44px 44px;
  pointer-events: none;
}

.newHomePageBackground {
  position: relative;
  z-index: 1;
}

.newHomePageBackground > div:first-child > div:first-child {
  color: #fff !important;
  font-weight: 650 !important;
}

.newHomebackground {
  min-height: 130px;
  border-right: 1px solid rgba(244,247,250,.14);
}

.newHomebackground:last-child {
  border-right: 0;
}

.newHomebackground img {
  filter: saturate(.8) brightness(1.15);
}

.newHomebackground > div:last-child > div:first-child,
.newHomebackground > div:last-child > div:last-child {
  color: rgba(244,247,250,.8) !important;
}

.pro-appScenario {
  background: #fff;
}

.appScenario > div {
  padding: 18px;
}

.appScenario > div > div:last-child {
  padding: 8px 8px 0;
}

.appScenario p {
  color: var(--zj-ink) !important;
}

.appScenario span {
  color: var(--zj-muted) !important;
  line-height: 1.8 !important;
}

.map-service {
  background: #eef4f7;
}

.map-service .module-title p {
  color: var(--zj-muted);
}

.foot {
  background: var(--zj-ink-2) !important;
  border-top: 1px solid rgba(39, 212, 216, .22);
}

.foot-text,
.foot-text-two {
  color: #fff !important;
}

.foot-text-two {
  opacity: .7;
}

.foot .btn-default {
  border: 0;
  border-radius: 4px;
  background: var(--zj-cyan);
  color: var(--zj-ink);
  font-weight: 650;
}

.foot .btn-default:hover {
  background: var(--zj-amber);
}

.footer {
  padding-top: 52px;
  background: #06111f;
  color: rgba(244,247,250,.68);
  border-top: 1px solid rgba(39, 212, 216, .14);
}

.footer h4 {
  color: #fff !important;
  font-weight: 650;
}

.footer a,
.footer .text-foot,
.footer .footer-contact-list {
  color: rgba(244,247,250,.68) !important;
}

.footer a:hover {
  color: var(--zj-cyan) !important;
}

.beianNumber {
  background: #040b15 !important;
  border-top-color: rgba(39,212,216,.12) !important;
}

.friendlyLink {
  border-top-color: rgba(244,247,250,.12) !important;
}

@media (max-width: 767px) {
  .hosu-quick-strip {
    padding: 8px 0;
  }

  .hosu-quick-strip .container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hosu-quick-entry {
    min-height: 58px;
    padding: 7px 12px;
    border-bottom: 1px solid #edf2f7;
  }

  .hosu-quick-entry:nth-child(2n) {
    border-right: 0;
  }

  .hosu-quick-entry:nth-last-child(-n+2) {
    border-bottom: 0;
  }

  .header,
  .header .navbar-brand {
    min-height: 62px;
    height: 62px;
  }

  .header .navbar-nav > li > a,
  .header .navbar-right > li > a,
  .header .login a {
    line-height: 44px;
  }

  .header .navbar-nav > li.register > a {
    line-height: 36px;
    margin-top: 4px;
  }

  .wrap-main-swiper,
  .wrap-main-swiper .swiper-container,
  .wrap-main-swiper .swiper-slide,
  .wrap-main-swiper .content-slide {
    min-height: 480px;
    height: 480px;
  }

  .wrap-main-swiper .content-slide {
    padding: 126px 28px 0;
  }

  .wrap-main-swiper .content-slide .slogan {
    font-size: 32px;
  }

  .service-div-content {
    min-height: 0;
    margin-bottom: 18px;
  }

  .newHomebackground {
    border-right: 0;
    border-bottom: 1px solid rgba(244,247,250,.14);
  }

  .newHomebackground:last-child {
    border-bottom: 0;
  }
}

/* Final reference pass: keep the header light even when the legacy theme adds body classes. */
body .header,
body.index .header,
body.index .header.fixed,
body.index.modules_transfer .header,
body.index.modules_authentication .header,
body.index.modules_invoiceManager .header {
  background: rgba(255, 255, 255, .97) !important;
  border-bottom-color: #e7eef7 !important;
  box-shadow: 0 4px 16px rgba(39, 86, 145, .08) !important;
}

body .header .navbar-nav > li > a,
body .header .navbar-right > li > a,
body .header .login a {
  color: #253448 !important;
}

body .header .navbar-nav > li > a:hover,
body .header .navbar-nav > li > a:focus,
body .header .navbar-right > li > a:hover {
  color: #1468e8 !important;
}

body .header .navbar-nav > li.register > a {
  color: #fff !important;
  background: #1468e8 !important;
}

/* Reference direction: clean white cloud-service storefront with blue brand accents. */
body,
body.index,
.space,
.space2x {
  background: #f7faff;
  color: #182230;
}

.header,
body.index .header.fixed,
body.index.modules_transfer .header,
body.index.modules_authentication .header,
body.index.modules_invoiceManager .header {
  min-height: 64px;
  background: rgba(255, 255, 255, .96);
  border-bottom: 1px solid #e7eef7;
  box-shadow: 0 4px 16px rgba(39, 86, 145, .08);
}

.header .navbar-brand {
  height: 64px;
}

.header .navbar-nav > li > a,
.header .navbar-right > li > a,
.header .login a {
  color: #253448;
  line-height: 64px;
}

.header .navbar-nav > li > a:hover,
.header .navbar-nav > li > a:focus,
.header .navbar-right > li > a:hover {
  color: #1468e8;
  background: transparent;
}

.header .navbar-nav > li.register > a {
  color: #fff;
  background: #1468e8;
  line-height: 36px;
  margin-top: 14px;
  border-radius: 3px;
}

.header .navbar-nav > li.register > a:hover {
  color: #fff;
  background: #0b55c7;
}

.header .dropdown-menu {
  border-top: 2px solid #1468e8;
  border-color: #e4edf7;
  box-shadow: 0 15px 28px rgba(42, 79, 125, .14);
}

.header .dropdown-menu a:hover {
  color: #1468e8;
  background: #f0f7ff;
}

.wrap-main-swiper,
.wrap-main-swiper .swiper-container,
.wrap-main-swiper .swiper-slide {
  min-height: 530px;
}

.wrap-main-swiper .swiper-slide {
  background-color: #eef6ff !important;
}

.wrap-main-swiper .swiper-slide::before {
  background: linear-gradient(90deg, rgba(246, 250, 255, .95), rgba(246, 250, 255, .58) 55%, rgba(246, 250, 255, .1));
}

.wrap-main-swiper .content-slide {
  height: 530px;
  padding-top: 160px;
}

.wrap-main-swiper .content-slide .slogan {
  color: #142338;
  font-size: 46px;
  font-weight: 650;
}

.wrap-main-swiper .content-slide .sub-slogan {
  color: #526a83;
}

.wrap-main-swiper .content-slide .event-title {
  color: #1468e8;
}

.swiper-btn-prev,
.swiper-btn-next {
  color: #1468e8;
  background: rgba(255,255,255,.82);
  border-color: #d4e4f6;
}

.swiper-pagination-bullet {
  background: #a9c7e7;
}

.swiper-pagination-bullet-active {
  background: #1468e8;
}

.newHome-service {
  padding: 52px 0 58px;
  background: #fff;
}

.hometitleSpan span,
.module-title {
  color: #142338;
  font-size: 28px;
}

.hometitleSpan span::after,
.module-title::after {
  width: 34px;
  height: 3px;
  margin-top: 14px;
  background: #1468e8;
}

.service-div-content {
  min-height: 330px;
  border-color: #e0eaf4;
  border-radius: 4px;
  box-shadow: 0 8px 22px rgba(40, 88, 137, .06);
}

.service-div-content:hover {
  border-color: #a8c9ef;
  box-shadow: 0 14px 28px rgba(20, 104, 232, .13);
  transform: translateY(-4px);
}

.service-div-text > div:first-child {
  color: #1b2f47;
}

.service-div-text > div:last-child {
  color: #64788e;
}

.understand-btn a {
  color: #1468e8 !important;
  border-color: #a9c9ee !important;
}

.understand-btn a:hover {
  color: #fff !important;
  background: #1468e8 !important;
  border-color: #1468e8 !important;
}

.newHomePage {
  background: #122e53;
  border-top: 1px solid #1f5891;
  border-bottom: 1px solid #1f5891;
}

.newHomePage::before {
  opacity: .1;
  background-image: linear-gradient(rgba(103, 181, 255, .4) 1px, transparent 1px), linear-gradient(90deg, rgba(103, 181, 255, .4) 1px, transparent 1px);
  background-size: 52px 52px;
}

.newHomebackground {
  border-right-color: rgba(255,255,255,.16);
}

.pro-appScenario {
  background: #fff;
}

.appScenario p {
  color: #1b2f47 !important;
}

.appScenario span {
  color: #657b90 !important;
}

.map-service {
  background: #f3f8fd;
}

.map-service .module-title p {
  color: #6b7f95;
}

.foot {
  background: #eaf4ff !important;
  border-top: 1px solid #d4e8fb;
}

.foot-text {
  color: #153457 !important;
}

.foot-text-two {
  color: #607993 !important;
}

.foot .btn-default {
  color: #fff;
  background: #1468e8;
}

.foot .btn-default:hover {
  color: #fff;
  background: #0b55c7;
}

.footer {
  background: #0e2038;
  border-top: 1px solid #1d426b;
}

.footer h4 {
  color: #fff !important;
}

.footer a,
.footer .text-foot,
.footer .footer-contact-list {
  color: rgba(230, 241, 253, .7) !important;
}

.footer a:hover {
  color: #73c8ff !important;
}

.beianNumber {
  background: #091729 !important;
}

@media (max-width: 767px) {
  .header,
  .header .navbar-brand {
    min-height: 60px;
    height: 60px;
  }

  .header .navbar-nav > li > a,
  .header .navbar-right > li > a,
  .header .login a {
    line-height: 42px;
  }

  .header .navbar-nav > li.register > a {
    margin-top: 3px;
  }

  .wrap-main-swiper,
  .wrap-main-swiper .swiper-container,
  .wrap-main-swiper .swiper-slide,
  .wrap-main-swiper .content-slide {
    min-height: 450px;
    height: 450px;
  }

  .wrap-main-swiper .content-slide {
    padding: 125px 24px 0;
  }

  .wrap-main-swiper .content-slide .slogan {
    font-size: 31px;
  }
}