@import "animate.css";
@import "swiper.min.css";
body {
  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  min-width: 1180px;
  padding: 0;
  margin: 0;
}
p,
h1,
h2,
h3,
h4 {
  margin: 0;
  padding: 0;
}
a:focus,
a:hover,
a {
  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  text-decoration: none;
  cursor: pointer;
}
.container {
  width: 1180px;
  margin: 0 auto;
}
.container-b {
  width: 1280px;
  margin: 0 auto;
}
.btn {
  background: #FFFFFF;
  border-radius: 4px 4px 4px 4px;
  font-size: 16px;
  line-height: 26px;
  font-weight: normal;
  color: #555FFF;
  padding: 5px 20px;
  text-align: center;
  cursor: pointer;
}
.btn:hover {
  color: #6F78FD;
}
.btn.warning {
  background: #FCB301;
  color: #FFFFFF;
}
.btn.warning:hover {
  background: #FFC536;
  color: #fff;
}
.btn.primary {
  background: #555EEF;
  color: #fff;
}
.btn.primary:hover {
  background: #6F78FD;
  color: #fff;
}
.btn.abtn {
  background: rgba(255, 255, 255, 0.01);
  color: #595959;
  border: 1px solid #D9D9D9;
  font-size: 14px;
}
.btn.abtn:hover {
  background: rgba(255, 255, 255, 0.01);
  border-radius: 4px 4px 4px 4px;
  border: 1px solid #555EEF;
  color: #555EEF;
}
h1 {
  font-size: 36px;
  font-weight: normal;
  color: #FFFFFF;
  line-height: 64px;
}
h2 {
  font-weight: normal;
  color: #3D3D3D;
  line-height: 50px;
  font-size: 28px;
}
h3 {
  font-size: 24px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 42px;
}
h3.s {
  font-size: 20px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 36px;
}
h4 {
  margin: 0;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 28px;
  font-size: 16px;
}
p {
  line-height: 26px;
  color: #8C8C8C;
  font-weight: normal;
  font-size: 14px;
}
a {
  font-size: 16px;
  font-weight: normal;
  color: #555FFF;
  line-height: 22px;
}
.fpos {
  flex-grow: 2;
}
.header-logo {
  display: inline-block;
  vertical-align: middle;
  width: 112px;
  height: 28px;
  background: url(../img/logow.png) center no-repeat;
  background-size: cover;
  margin-right: 24px;
}
.phone {
  display: inline-block;
  vertical-align: middle;
  width: 16px;
  height: 16px;
  background: url(../img/phonew.svg) center no-repeat;
  background-size: cover;
  margin-right: 8px;
}
.header {
  z-index: 999;
  height: 64px;
  background: rgba(0, 0, 0, 0);
  width: 100%;
  top: 0;
  left: 0;
  position: fixed;
}
.header .header-content {
  display: flex;
  height: 100%;
  align-items: center;
}
.header .menu-item {
  padding: 17px;
}
.header .menu-item .nava {
  color: #FFFFFF;
  font-size: 16px;
  position: relative;
  height: 24px;
  line-height: 24px;
  display: block;
}
.header .menu-item.more {
  padding-right: 36px;
}
.header .menu-item.more .nava:after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/whitedownarrrow.svg) center no-repeat;
  background-size: cover;
  top: 4px;
  right: -19px;
}
.header .menu-item:hover .nava {
  color: #555FFF;
}
.header .phoneno {
  font-size: 18px;
  font-family: D-DIN-Bold, D-DIN;
  font-weight: bold;
  color: #FFFFFF;
  margin-right: 40px;
}
.header .abtn.login {
  color: #fff;
  border: 1px solid #fff;
  margin-right: 16px;
  width: 58px;
  height: 30px;
  line-height: 30px;
  padding: 0;
}
.header .abtn.reg {
  background: #fff;
  color: #555FFF;
  border: 1px solid #fff;
  width: 58px;
  height: 30px;
  line-height: 30px;
  padding: 0;
}
.header .dropdown {
  position: absolute;
  background: #fff;
  top: 60px;
  -ms-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
  box-shadow: 0px 6px 12px 1px rgba(0, 0, 0, 0.12);
  border-radius: 0px 0px 4px 4px;
  width: 100%;
  left: 0;
  right: 0;
  height: 390px;
}
.header .dropdown a {
  font-size: 16px;
  font-weight: normal;
  color: #333333;
  display: block;
  line-height: 24px;
  height: 24px;
  margin: 20px 20px 0;
  white-space: nowrap;
}
.header .dropdown a:hover {
  color: #555FFF;
}
.header .dropdown a:first-child {
  margin-top: 32px;
}
.header .dropdown.minum {
  width: 110px;
}
.header .dropdown.big {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
.header .dropdown.big a {
  width: 74px;
  margin: 0 12px 0 20px;
}
.header .headavatar {
  width: 40px;
  height: 40px;
  background: url(../img/head.png) center no-repeat;
  background-size: cover;
  cursor: pointer;
  border-radius: 50%;
}
.header.industry .header-logo {
  background: url(../img/logo.png) center no-repeat;
  background-size: cover;
}
.header.industry .menu-item .nava {
  color: #3d3d3d;
}
.header.industry .menu-item.more .nava:after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/blackdownarrrow.svg) center no-repeat;
  background-size: cover;
  top: 3px;
  right: -19px;
}
.header.industry .phone {
  display: inline-block;
  vertical-align: middle;
  width: 16px;
  height: 16px;
  background: url(../img/phone.svg) center no-repeat;
  background-size: cover;
  margin-right: 8px;
}
.header.industry .phoneno {
  color: #515AE7;
}
.header.industry .abtn.login {
  color: #595959;
  margin-right: 16px;
  background: rgba(255, 255, 255, 0.01);
  border-radius: 4px 4px 4px 4px;
  opacity: 1;
  border: 1px solid #D9D9D9;
}
.header.industry .abtn.login:hover {
  color: #555EEF;
  background: rgba(255, 255, 255, 0.01);
  border: 1px solid #555EEF;
}
.header.industry .abtn.reg {
  color: #fff;
  background: #555FFF;
  border-radius: 4px 4px 4px 4px;
  border: 1px solid #555FFF;
}
.header.industry .abtn.reg:hover {
  border: 1px solid #6F78FD;
  background: #6F78FD;
}
.header.fixed,
.header:hover {
  background: #FFFFFF;
  box-shadow: 0px 1px 4px 1px rgba(0, 21, 41, 0.12);
}
.header.fixed .header-logo,
.header:hover .header-logo {
  background: url(../img/logo.png) center no-repeat;
  background-size: cover;
}
.header.fixed .menu-item .container,
.header:hover .menu-item .container {
  position: relative;
}
.header.fixed .menu-item .container .blockbox,
.header:hover .menu-item .container .blockbox {
  position: absolute;
  top: 0;
}
.header.fixed .menu-item .postera,
.header:hover .menu-item .postera {
  width: 272px;
  height: 390px;
  padding: 0;
  margin: 0;
}
.header.fixed .menu-item .poster,
.header:hover .menu-item .poster {
  width: 272px;
  height: 390px;
  position: absolute;
  right: 0;
  top: 0;
  cursor: pointer;
}
.header.fixed .menu-item .nava,
.header:hover .menu-item .nava {
  color: #333333;
}
.header.fixed .menu-item.more,
.header:hover .menu-item.more {
  padding-right: 36px;
}
.header.fixed .menu-item.more .nava:after,
.header:hover .menu-item.more .nava:after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/blackdownarrrow.svg) center no-repeat;
  background-size: cover;
  top: 3px;
  right: -19px;
}
.header.fixed .menu-item.more.haslogin,
.header:hover .menu-item.more.haslogin {
  position: relative;
}
.header.fixed .menu-item:hover .nava,
.header:hover .menu-item:hover .nava {
  color: #555FFF;
}
.header.fixed .menu-item.more:hover .nava:after,
.header:hover .menu-item.more:hover .nava:after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/blueuparrow.svg) center no-repeat;
  background-size: cover;
  top: 3px;
  right: -19px;
}
.header.fixed .menu-item .blockbox,
.header:hover .menu-item .blockbox {
  display: flex;
  flex-wrap: wrap;
  width: 842px;
  padding-top: 66px;
}
.header.fixed .menu-item .blockbox .block,
.header:hover .menu-item .blockbox .block {
  width: 421px;
}
.header.fixed .menu-item .blockbox .block a,
.header:hover .menu-item .blockbox .block a {
  padding: 0;
  margin: 0;
  width: 72px;
  height: 26px;
  font-size: 20px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 26px;
  margin-bottom: 3px;
  margin-left: 0;
  display: block;
}
.header.fixed .menu-item .blockbox .block a:hover,
.header:hover .menu-item .blockbox .block a:hover {
  color: #555FFF;
}
.header.fixed .menu-item .blockbox .block p,
.header:hover .menu-item .blockbox .block p {
  padding: 0;
  width: 420px;
  height: 30px;
  font-size: 16px;
  font-weight: normal;
  color: #8C8C8C;
  line-height: 30px;
  margin-bottom: 42px;
  padding-top: 6px;
}
.header.fixed .menu-item.about .blockbox,
.header:hover .menu-item.about .blockbox {
  padding-top: 68px;
}
.header.fixed .menu-item.about .blockbox .block p,
.header:hover .menu-item.about .blockbox .block p {
  margin-bottom: 71px;
}
.header.fixed .phone,
.header:hover .phone {
  display: inline-block;
  vertical-align: middle;
  width: 16px;
  height: 16px;
  background: url(../img/phone.svg) center no-repeat;
  background-size: cover;
  margin-right: 8px;
}
.header.fixed .phoneno,
.header:hover .phoneno {
  color: #515AE7;
}
.header.fixed .abtn.login,
.header:hover .abtn.login {
  color: #595959;
  margin-right: 16px;
  background: rgba(255, 255, 255, 0.01);
  border-radius: 4px 4px 4px 4px;
  opacity: 1;
  border: 1px solid #D9D9D9;
}
.header.fixed .abtn.login:hover,
.header:hover .abtn.login:hover {
  color: #555EEF;
  background: rgba(255, 255, 255, 0.01);
  border: 1px solid #555EEF;
}
.header.fixed .abtn.reg,
.header:hover .abtn.reg {
  color: #fff;
  background: #555FFF;
  border-radius: 4px 4px 4px 4px;
  border: 1px solid #555FFF;
}
.header.fixed .abtn.reg:hover,
.header:hover .abtn.reg:hover {
  border: 1px solid #6F78FD;
  background: #6F78FD;
}
.header.fixed .headavatar,
.header:hover .headavatar {
  width: 40px;
  height: 40px;
  background: url(../img/heado.png) center no-repeat;
  background-size: cover;
}
.header .dropdown-product,
.header.fixed .dropdown-product,
.header:hover .dropdown-product {
  height: 390px;
}
.header .dropdown-product .more,
.header.fixed .dropdown-product .more,
.header:hover .dropdown-product .more {
  position: absolute;
  right: 48px;
  bottom: 32px;
  font-size: 14px;
  font-weight: normal;
  color: #555FFF;
  line-height: 24px;
}
.header .dropdown-product .more:after,
.header.fixed .dropdown-product .more:after,
.header:hover .dropdown-product .more:after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/bluerightarrow.svg) center no-repeat;
  background-size: cover;
  top: 4px;
  right: -18px;
}
.header .dropdown-product > div,
.header.fixed .dropdown-product > div,
.header:hover .dropdown-product > div {
  position: relative;
}
.header .dropdown-product .rline,
.header.fixed .dropdown-product .rline,
.header:hover .dropdown-product .rline,
.header .dropdown-product .bline,
.header.fixed .dropdown-product .bline,
.header:hover .dropdown-product .bline,
.header .dropdown-product .pbox,
.header.fixed .dropdown-product .pbox,
.header:hover .dropdown-product .pbox {
  position: absolute;
}
.header .dropdown-product .pbox,
.header.fixed .dropdown-product .pbox,
.header:hover .dropdown-product .pbox {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.header .dropdown-product .pbox a,
.header.fixed .dropdown-product .pbox a,
.header:hover .dropdown-product .pbox a {
  height: 30px;
  font-size: 16px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 30px;
  margin-top: 8px;
  margin-left: 0;
}
.header .dropdown-product .pbox a:first-child,
.header.fixed .dropdown-product .pbox a:first-child,
.header:hover .dropdown-product .pbox a:first-child {
  margin-top: 0;
}
.header .dropdown-product .pbox a:hover,
.header.fixed .dropdown-product .pbox a:hover,
.header:hover .dropdown-product .pbox a:hover {
  color: #555FFF;
}
.header .dropdown-product img,
.header.fixed .dropdown-product img,
.header:hover .dropdown-product img {
  width: 12px;
  height: 12px;
  margin-left: 5px;
}
.header .dropdown-product .bline,
.header.fixed .dropdown-product .bline,
.header:hover .dropdown-product .bline {
  top: 42px;
  left: 0px;
  right: 32px;
  display: flex;
  width: 708px;
  justify-content: space-between;
  flex-direction: row-reverse;
}
.header .dropdown-product .bline div,
.header.fixed .dropdown-product .bline div,
.header:hover .dropdown-product .bline div {
  width: fit-content;
  height: 30px;
  font-size: 20px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 30px;
  padding-bottom: 2px;
  border-bottom: solid 1px #555fff;
}
.header .dropdown-product .rline,
.header.fixed .dropdown-product .rline,
.header:hover .dropdown-product .rline {
  padding-right: 20px;
  display: flex;
  align-items: center;
}
.header .dropdown-product .rline p,
.header.fixed .dropdown-product .rline p,
.header:hover .dropdown-product .rline p {
  height: 30px;
  font-size: 16px;
  font-weight: normal;
  color: #555FFF;
  line-height: 30px;
}
.header .dropdown-product .top,
.header.fixed .dropdown-product .top,
.header:hover .dropdown-product .top {
  width: 404px;
}
.header .dropdown-product .top .rline,
.header.fixed .dropdown-product .top .rline,
.header:hover .dropdown-product .top .rline {
  top: 30px;
  left: 0px;
}
.header .dropdown-product .bottom .rline,
.header.fixed .dropdown-product .bottom .rline,
.header:hover .dropdown-product .bottom .rline {
  top: 30px;
  left: 627px;
}
.header .dropdown-product .bottom .bline,
.header.fixed .dropdown-product .bottom .bline,
.header:hover .dropdown-product .bottom .bline {
  left: 627px;
}
.header .head-dropdown,
.header.fixed .head-dropdown,
.header:hover .head-dropdown {
  width: 200px;
  height: 172px;
  background: #FFFFFF;
  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.08);
  border-radius: 4px 4px 4px 4px;
}
.header .head-dropdown .line,
.header.fixed .head-dropdown .line,
.header:hover .head-dropdown .line {
  width: 168px;
  height: 1px;
  background: #EEEEEE;
  border-radius: 0px 0px 0px 0px;
  opacity: 1;
  position: absolute;
  top: 71px;
  left: 16px;
}
.header .head-dropdown .user-menu,
.header.fixed .head-dropdown .user-menu,
.header:hover .head-dropdown .user-menu {
  position: absolute;
  top: 71px;
}
.header .head-dropdown .user-menu .user-item,
.header.fixed .head-dropdown .user-menu .user-item,
.header:hover .head-dropdown .user-menu .user-item {
  width: 154px;
  height: 34px;
  background: #FFFFFF;
  border-radius: 4px 4px 4px 4px;
  opacity: 1;
  line-height: 34px;
  padding-left: 30px;
  position: relative;
  margin: 8px 8px 12px;
  cursor: pointer;
  display: block;
}
.header .head-dropdown .user-menu .user-item:before,
.header.fixed .head-dropdown .user-menu .user-item:before,
.header:hover .head-dropdown .user-menu .user-item:before {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/user.png) center no-repeat;
  background-size: cover;
  top: 9px;
  left: 11px;
}
.header .head-dropdown .user-menu .user-item.quit:before,
.header.fixed .head-dropdown .user-menu .user-item.quit:before,
.header:hover .head-dropdown .user-menu .user-item.quit:before {
  background: url(../img/quit.png) center no-repeat;
  background-size: cover;
}
.header .head-dropdown .user-menu .user-item:after,
.header.fixed .head-dropdown .user-menu .user-item:after,
.header:hover .head-dropdown .user-menu .user-item:after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/bluerightarrow.svg) center no-repeat;
  background-size: cover;
  top: 9px;
  right: 8px;
}
.header .head-dropdown .user-menu .user-item:hover,
.header.fixed .head-dropdown .user-menu .user-item:hover,
.header:hover .head-dropdown .user-menu .user-item:hover {
  background: #555FFF;
  color: #fff;
}
.header .head-dropdown .user-menu .user-item:hover:before,
.header.fixed .head-dropdown .user-menu .user-item:hover:before,
.header:hover .head-dropdown .user-menu .user-item:hover:before {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/usero.png) center no-repeat;
  background-size: cover;
  top: 9px;
  left: 11px;
}
.header .head-dropdown .user-menu .user-item:hover.quit:before,
.header.fixed .head-dropdown .user-menu .user-item:hover.quit:before,
.header:hover .head-dropdown .user-menu .user-item:hover.quit:before {
  background: url(../img/quito.png) center no-repeat;
  background-size: cover;
}
.header .head-dropdown .user-menu .user-item:hover:after,
.header.fixed .head-dropdown .user-menu .user-item:hover:after,
.header:hover .head-dropdown .user-menu .user-item:hover:after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/whiterightarrow.svg) center no-repeat;
  background-size: cover;
  top: 9px;
  right: 8px;
}
.header .head-dropdown .headavatar,
.header.fixed .head-dropdown .headavatar,
.header:hover .head-dropdown .headavatar {
  position: absolute;
  left: 16px;
  top: 16px;
}
.header .head-dropdown .username,
.header.fixed .head-dropdown .username,
.header:hover .head-dropdown .username {
  height: 26px;
  font-size: 14px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 26px;
  position: absolute;
  left: 68px;
  top: 11px;
}
.header .head-dropdown .usermobile,
.header.fixed .head-dropdown .usermobile,
.header:hover .head-dropdown .usermobile {
  width: 84px;
  height: 24px;
  font-size: 13px;
  font-weight: normal;
  color: #8C8C8C;
  line-height: 24px;
  position: absolute;
  left: 68px;
  top: 37px;
}
.header .dropdown .blockbox,
.header.fixed .dropdown .blockbox,
.header:hover .dropdown .blockbox {
  padding-top: 40px;
}
.header .dropdown .blockbox .block a,
.header.fixed .dropdown .blockbox .block a,
.header:hover .dropdown .blockbox .block a {
  padding-bottom: 2px;
  border-bottom: solid 1px #555fff;
  width: fit-content;
}
.footer {
  height: 598px;
  background: #05004D;
  position: relative;
  padding: 0;
  margin: 0;
}
.footer a {
  margin-bottom: 15px;
}
.footer .footerbox {
  display: flex;
  justify-content: space-between;
}
.footer .top {
  height: 28px;
  font-size: 20px;
  padding-top: 64px;
  margin-bottom: 24px;
  font-weight: normal;
  color: #FFFFFF;
  line-height: 28px;
  border-bottom: solid 2px #fff;
  width: fit-content;
}
.footer .footer-product {
  width: 160px;
}
.footer .footer-product .p1 {
  display: flex;
  flex-direction: column-reverse;
}
.footer .footer-product p {
  height: 26px;
  font-size: 14px;
  font-weight: normal;
  color: #FFFFFF;
  line-height: 26px;
  margin-bottom: 10px;
  white-space: nowrap;
}
.footer .footer-product .top2 {
  padding-top: 2px;
}
.footer .footer-product .abox {
  display: flex;
  flex-wrap: wrap;
  margin-right: 0px;
  justify-content: space-between;
  margin-bottom: 24px;
}
.footer .footer-product .abox .ap {
  width: 120px;
}
.footer .footer-product .p2box {
  display: flex;
  flex-wrap: wrap;
}
.footer .footer-product .p2box a {
  margin-right: 67px;
}
.footer .footer-product .p2box a:nth-child(2) {
  margin-right: 52px;
}
.footer .footer-product .p2box a:nth-child(3) {
  margin-right: 0;
}
.footer .footer-product .phonep {
  height: 22px;
  font-size: 16px;
  font-weight: normal;
  color: #D0CDD8;
  line-height: 22px;
  word-break: keep-all;
  white-space: nowrap;
  margin-top: 30px;
}
.footer .footer-product .phone {
  background: url(../img/phone.svg) center no-repeat;
  background-size: cover;
  margin-right: 8px;
}
.footer .footer-product .phoneno {
  word-break: keep-all;
  white-space: nowrap;
  font-size: 24px;
  font-family: D-DIN-Bold, D-DIN;
  font-weight: bold;
  color: #FFFFFF;
  margin-top: 13px;
}
.footer .footer-industy {
  width: 100px;
}
.footer .footer-industy a {
  margin-right: 30px;
}
.footer .qr {
  margin-top: 0px;
  width: 126px;
  height: 156px;
  background: #FFFFFF;
  border-radius: 4px 4px 4px 4px;
  padding: 0;
}
.footer .qr img {
  margin: 0px auto 2px;
  padding-top: 8px;
  width: 112px;
  display: block;
}
.footer .qr p {
  display: block;
  padding: 0;
  margin: 0;
  height: 28px;
  font-size: 16px;
  width: 100%;
  text-align: center;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 28px;
}
.footer .footer-support {
  width: 120px;
}
.footer .footer-support a {
  margin-right: 40px;
}
.footer .footer-support .support-1,
.footer .footer-support .support-8,
.footer .footer-support .support-7 {
  height: 26px;
  font-size: 14px;
  font-weight: normal;
  color: #FFFFFF;
  line-height: 26px;
}
.footer .footer-about {
  width: 328px;
}
.footer .footer-about .primary {
  margin-top: 40px;
  width: 77px;
  font-size: 16px;
  white-space: nowrap;
  padding: 4px 12px;
}
.footer .footer-about p {
  text-align: justify;
  font-size: 14px;
  font-weight: normal;
  color: rgba(255, 255, 255, 0.86);
  line-height: 25px;
  margin-bottom: 16px;
  margin-top: 0;
}
.footer .footer-about p:nth-child(2) {
  margin-bottom: 0;
}
.footer .footer-about p:last-child {
  margin-bottom: 0;
}
.footer .footer-about .icons {
  margin-top: 44px;
}
.footer .footer-about .icons i {
  width: 32px;
  height: 32px;
  display: inline-block;
  cursor: pointer;
}
.footer .footer-about .icons .icon {
  display: inline-block;
  margin-right: 24px;
  position: relative;
  /* 白色三角形 */
}
.footer .footer-about .icons .icon .n {
  display: inline-block;
}
.footer .footer-about .icons .icon .o {
  display: none;
}
.footer .footer-about .icons .icon .wechart-qr {
  position: absolute;
  top: -124px;
  left: -40px;
}
.footer .footer-about .icons .icon .wechart-qr img {
  width: 110px;
  height: 110px;
  border-radius: 8px 8px 8px 8px;
}
.footer .footer-about .icons .icon .wechart-qr::after {
  content: '';
  position: absolute;
  left: 42px;
  bottom: -14px;
  width: 0;
  height: 0;
  border: 12px solid transparent;
  border-top-color: #fff;
}
.footer .footer-about .icons .icon:hover {
  border: none;
}
.footer .footer-about .icons .icon:hover .n {
  display: none;
}
.footer .footer-about .icons .icon:hover .o {
  display: inline-block;
}
.footer a {
  height: 25px;
  font-size: 14px;
  font-weight: normal;
  line-height: 25px;
  display: inline-block;
  color: #C1C1C1;
  white-space: nowrap;
  border-bottom: solid 1px rgba(0, 0, 0, 0);
}
.footer a:hover {
  border-bottom: solid 1px #fff;
  color: #FFFFFF;
}
.footer .footerbase {
  bottom: 0;
  position: absolute;
  left: 0;
  right: 0;
  padding: 0;
  margin: 0;
  height: 44px;
  background: #1B1661;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer .footerbase a {
  height: 16px;
  font-size: 12px;
  font-weight: normal;
  color: #71698C;
  line-height: 16px;
  display: block;
  margin: 0 8px;
}
.footer .footerbase a:nth-child(2) {
  padding: 0 10px;
  border-left: solid 1px #71698C;
  border-right: solid 1px #71698C;
}
.footer .footerbase img {
  width: 16px;
  height: 16px;
}
.steop-cover {
  position: relative;
  width: 100%;
}
.title-icon-b {
  position: relative;
}
.title-icon-b:before {
  content: '';
  position: absolute;
  width: 72px;
  height: 12px;
  background: url(../img/title_i_b_l.svg) center no-repeat;
  background-size: cover;
  left: -88px;
  bottom: 18px;
}
.title-icon-b:after {
  content: '';
  position: absolute;
  width: 72px;
  height: 12px;
  background: url(../img/title_i_b_r.svg) center no-repeat;
  background-size: cover;
  right: -88px;
  bottom: 18px;
}
.title-icon-w {
  position: relative;
}
.title-icon-w:before {
  content: '';
  position: absolute;
  width: 72px;
  height: 12px;
  background: url(../img/title_i_w_l.svg) center no-repeat;
  background-size: cover;
  left: -88px;
  bottom: 18px;
}
.title-icon-w:after {
  content: '';
  position: absolute;
  width: 72px;
  height: 12px;
  background: url(../img/title_i_w_r.svg) center no-repeat;
  background-size: cover;
  right: -88px;
  bottom: 18px;
}
.right-arrow {
  position: relative;
  padding-right: 26px;
  display: block;
  height: 22px;
}
.right-arrow:after {
  content: '';
  position: absolute;
  width: 20px;
  height: 20px;
  background: url(../img/a_b_r_arrow.svg) center no-repeat;
  background-size: cover;
  right: 0px;
  top: 1px;
}
.video-mask {
  position: fixed;
  width: 100vw;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  background: rgba(0, 0, 0, 0.24);
  top: 0;
  left: 0;
}
.video-mask .video-box {
  display: flex;
  width: 900px;
  height: 506px;
  justify-content: center;
  align-items: center;
  position: relative;
}
.video-mask .video-box video {
  height: auto;
  width: 100%;
  object-fit: cover;
}
.video-mask .video-box .close {
  position: absolute;
  right: 8px;
  top: 8px;
  width: 32px;
  height: 32px;
  background: url(../img/product/videoclose.svg) center no-repeat;
  background-size: 32px 32px;
  cursor: pointer;
}
.global-pics-pop,
.pop-mask,
.chat-mask2,
.chat-mask {
  position: fixed;
  width: 100vw;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  background: rgba(0, 0, 0, 0.24);
  top: 0;
  left: 0;
}
.chat-error {
  position: fixed;
  top: 60px;
  width: 240px;
  height: 40px;
  background: #FFFFFF;
  border-radius: 4px 4px 4px 4px;
  opacity: 1;
  display: flex;
  align-items: center;
  left: calc(50% - 120px);
  z-index: 1020;
  box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.16);
}
.chat-error img {
  width: 20px;
  height: 20px;
  margin-left: 16px;
  display: inline-block;
}
.chat-error p {
  width: 126px;
  height: 20px;
  font-size: 14px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 20px;
  margin-left: 8px;
  display: inline-block;
}
.chat-box {
  display: flex;
  width: 1000px;
  height: 500px;
  box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.16);
  overflow: hidden;
  border-radius: 4px;
}
.chat-box .left {
  width: 500px;
}
.chat-box .left img {
  width: 500px;
  height: 500px;
}
.chat-box .right {
  background: #fff;
  width: 500px;
  position: relative;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.chat-box .right .close {
  position: absolute;
  right: 12px;
  top: 12px;
  width: 24px;
  height: 24px;
  background: url(../img/chat/close.png) center no-repeat;
  background-size: 12px 12px;
  background-position: 6px 6px;
  cursor: pointer;
}
.chat-box .right .checkbox {
  cursor: pointer;
  padding: 0;
  margin: 0;
  display: block;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  margin-left: 7px;
  margin-bottom: 15px;
}
.chat-box .right .btn {
  width: 300px;
  height: 30px;
  line-height: 30px;
  background: #F0A86F;
  border-radius: 2px 2px 2px 2px;
  margin-top: 25px;
  margin-bottom: 15px;
}
.chat-box .right .btn:hover {
  background: #F09C5A;
}
.chat-box .right .chat-p {
  width: 324px;
  font-size: 12px;
  font-weight: normal;
  color: #8C8C8C;
  vertical-align: middle;
}
.chat-box .right .chat-p a {
  font-size: 12px;
  color: #555fff;
  margin-bottom: 15px;
  display: inline-block;
}
.chat-box .right .chat-t {
  height: 42px;
  font-size: 24px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 42px;
  margin-top: 24px;
  margin-bottom: 8px;
}
.chat-box .right .chat-info {
  width: 98px;
  height: 17px;
  font-size: 14px;
  font-weight: normal;
  color: #8C8C8C;
  line-height: 17px;
  margin: 0 4px;
}
.chat-box .right .chat-tel {
  width: 101px;
  height: 30px;
  font-size: 18px;
  font-weight: bold;
  color: #555FFF;
  line-height: 30px;
  margin: 0 4px;
}
.chat-box .right .errorinfo {
  position: absolute;
  top: 28px;
  left: 0;
  padding-left: 16px;
  width: 162px;
  height: 22px;
  font-size: 12px;
  font-weight: normal;
  color: #F5212D;
  line-height: 22px;
}
.chat-box .right .errorinfo:before {
  position: absolute;
  content: '';
  width: 12px;
  height: 12px;
  top: 5px;
  left: 2px;
  background: url(../img/chat/i.svg) center no-repeat;
  background-size: cover;
}
.chat-box .right .checkinput {
  position: relative;
  display: flex;
  align-items: center;
  height: 22px;
}
.chat-box .right .input {
  margin-top: 22px;
  width: 340px;
  height: 36px;
  position: relative;
  border: none;
}
.chat-box .right .input img {
  position: absolute;
  left: 15px;
  top: 12px;
}
.chat-box .right .input textarea {
  resize: none;
}
.chat-box .right .input textarea,
.chat-box .right .input input {
  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  border-radius: 2px;
  position: absolute;
  left: 0;
  top: 0;
  width: 298px;
  height: 36px;
  border: 1px solid #D8D8D8;
  padding: 0 0 0 40px;
  line-height: 38px;
  font-size: 13px;
  outline: none;
}
.chat-box .right .input textarea:focus,
.chat-box .right .input input:focus {
  box-shadow: 0px 0px 0px 2px rgba(85, 95, 255, 0.48);
  border-radius: 2px 2px 2px 2px;
  border: 1px solid #555FFF;
}
.chat-box .right .input textarea::-webkit-input-placeholder,
.chat-box .right .input input::-webkit-input-placeholder {
  /* WebKit browsers 适配谷歌 */
  color: #CACACA;
}
.chat-box .right .input textarea:-moz-placeholder,
.chat-box .right .input input:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 适配火狐 */
  color: #CACACA;
}
.chat-box .right .input textarea::-moz-placeholder,
.chat-box .right .input input::-moz-placeholder {
  /* Mozilla Firefox 19+ 适配火狐 */
  color: #CACACA;
}
.chat-box .right .input textarea:-ms-input-placeholder,
.chat-box .right .input input:-ms-input-placeholder {
  /* Internet Explorer 10+  适配ie*/
  color: #CACACA;
}
.chat-box .right .input.ta,
.chat-box .right .input textarea {
  line-height: 24px;
  padding-top: 6px;
  height: 62px;
}
.chat-box .right .input.ta p,
.chat-box .right .input textarea p {
  top: 66px;
}
.chat-alert {
  width: 500px;
  height: 458px;
  background: #FFFFFF;
  border-radius: 4px 4px 4px 4px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.chat-alert .check {
  width: 48px;
  height: 48px;
  margin-top: 48px;
  margin-bottom: 20px;
}
.chat-alert .alert-t {
  width: 96px;
  height: 42px;
  font-size: 24px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 42px;
}
.chat-alert .alert-p {
  width: 351px;
  height: 36px;
  font-size: 14px;
  font-weight: normal;
  color: #8C8C8C;
  line-height: 18px;
  margin-bottom: 20px;
  text-align: center;
}
.chat-alert .check-qr {
  width: 120px;
  height: 120px;
  margin-bottom: 48px;
}
.chat-alert .verifybtn {
  width: 340px;
  height: 40px;
  background: #F0A86F;
  border-radius: 2px 2px 2px 2px;
  line-height: 40px;
  padding: 0;
}
.chat-alert .verifybtn:hover {
  background: #F09C5A;
}
.stepchat .chat-body {
  margin: 80px auto 80px;
}
.stepchat .chat-box {
  margin: 0 auto;
  box-shadow: none;
}
.stepchat .chat-box .right {
  background: #F7F8FA;
}
.stepchat .chat-box .right .close {
  display: none;
}
.stepchat .chat-box .right .errorinfo {
  display: none;
}
.side {
  position: fixed;
  z-index: 90;
  right: 0;
  bottom: 100px;
}
.side .icon {
  width: 64px;
  height: 64px;
  border-radius: 8px 8px 8px 8px;
  opacity: 1;
  border: 0px solid #F5F6F8;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 20px;
  margin-bottom: 8px;
  cursor: pointer;
  position: relative;
  flex-direction: column;
}
.side .icon .hover {
  display: none;
}
.side .icon .normal {
  display: block;
}
.side .icon div {
  height: 20px;
  font-size: 12px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 20px;
  margin-top: 2px;
}
.side .icon svg {
  fill: #555fff;
  width: 26px;
  height: 26px;
}
.side .icon .leftopen {
  position: absolute;
  display: none;
}
.side .icon:hover .hover {
  display: block;
}
.side .icon:hover .normal {
  display: none;
}
.side .icon:hover svg {
  fill: #fff;
}
.side .icon:hover div {
  color: #fff;
}
.side .icon:hover .leftopen {
  width: 144px;
  height: 72px;
  background: #FFFFFF;
  border-radius: 8px 8px 8px 8px;
  opacity: 1;
  border: 1px solid #F5F6F8;
  display: block;
  font-size: 14px;
  text-align: center;
  font-weight: 400;
  color: #3D3D3D;
  line-height: 34px;
  left: -163px;
  box-shadow: 0px 20px 30px 0px rgba(0, 11, 188, 0.05), inset 5px 2px 10px 0px rgba(202, 207, 255, 0.08);
}
.side .icon:hover .leftopen:after {
  content: '';
  position: absolute;
  right: -20px;
  bottom: 24px;
  width: 0;
  height: 0;
  border: 12px solid transparent;
  border-left-color: #fff;
}
.side .icon:hover .leftopen.tel div {
  padding: 0;
  margin: 0;
}
.side .icon:hover .leftopen.tel .top {
  width: 144px;
  height: 14px;
  font-size: 14px;
  font-weight: normal;
  color: #9C9C9C;
  line-height: 14px;
  text-align: center;
  padding-top: 14px;
  padding-bottom: 10px;
}
.side .icon:hover .leftopen.tel .pno {
  width: 144px;
  height: 16px;
  font-size: 16px;
  font-weight: bold;
  color: #3D3D3D;
  line-height: 16px;
  text-align: center;
}
.side .icon:hover .leftopen.wx:after {
  bottom: 56px;
}
.side .icon:hover .leftopen.wx {
  width: 144px;
  height: 144px;
  background: #FFFFFF;
  border-radius: 8px 8px 8px 8px;
  opacity: 1;
  border: 1px solid #F5F6F8;
}
.side .icon:hover .leftopen.wx img {
  width: 112px;
  height: 112px;
  display: block;
  margin: 16px auto 16px;
}
.side .icon:hover .leftopen.gochattxt {
  width: 144px;
  height: 72px;
  background: #FFFFFF;
  border-radius: 8px 8px 8px 8px;
  opacity: 1;
  border: 1px solid #F5F6F8;
  font-size: 16px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 72px;
  text-align: center;
}
.side .icon:hover .leftopen.gochattxt:after {
  bottom: 24px;
}
.side .icon.blue {
  background: #6F71FF;
  border: 1px solid #6F71FF;
}
.side .icon.blue div {
  color: #fff;
}
.step7 {
  height: 200px;
  position: relative;
}
.step7 .img-cover {
  background: #4F57EB;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  position: relative;
  top: 0;
}
.step7 img {
  width: auto;
  height: 200px;
}
.step7 .steop-cover {
  position: absolute;
  top: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
}
.step7 h2 {
  height: 50px;
  font-size: 28px;
  color: #FFFFFF;
  line-height: 50px;
  margin: 0 0 24px;
  padding-top: 48px;
}
.step7 .btn {
  width: 64px;
  font-size: 14px;
}
.step7 .hbox {
  display: flex;
}
.step7 .warning {
  width: 80px;
  margin-left: 26px;
}
.global-pics-mask {
  background: rgba(0, 0, 0, 0.4);
  position: absolute;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
}
.global-pics-mask-img {
  height: 80vh;
  width: auto;
  display: block;
  pointer-events: none;
}
.global-pics-mask-sc4 {
  padding-bottom: 40px;
}
.global-pics-mask-sc4 .case-one {
  height: 80vh;
  width: 80vw;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.global-pics-mask-sc4 .swiper-button-next2mask,
.global-pics-mask-sc4 .swiper-button-prev2mask {
  top: 38vh;
  left: 20px;
  width: 40px;
  height: 40px;
  background: rgba(255, 255, 255, 0.68);
  box-shadow: 0px 20px 30px 0px rgba(0, 11, 188, 0.05), inset 5px 2px 10px 0px rgba(202, 207, 255, 0.08);
  border: 1px solid rgba(235, 235, 235, 0.4);
  border-radius: 50%;
  position: absolute;
  z-index: 20;
  cursor: pointer;
}
.global-pics-mask-sc4 .swiper-button-next2mask {
  left: inherit;
  right: 40px;
  -webkit-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  -moz-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
.global-pics-mask-sc4 .swiper-button-next2mask:after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/swipper-arrow-r.svg) center no-repeat;
  background-size: cover;
  top: 12px;
  right: 12px;
}
.global-pics-mask-sc4 .swiper-button-prev2mask:after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/swipper-arrow-r.svg) center no-repeat;
  background-size: cover;
  top: 12px;
  right: 12px;
}
.global-pics-mask-sc4 .swiper-pagination-p {
  width: 100%;
  position: absolute;
  bottom: 0px;
}
.global-pics-mask-sc4 .swiper-pagination-mask {
  display: flex;
  justify-content: center;
}
.global-pics-mask-sc4 .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  background: #B0B4FF;
  opacity: 1;
  margin-right: 8px;
}
.global-pics-mask-sc4 .swiper-pagination-bullet-active {
  width: 16px;
  height: 8px;
  background: #FFFFFF;
  border-radius: 24px 24px 24px 24px;
  opacity: 1;
}
.step-fixedbanner {
  background: #525BEA;
  width: 100%;
}
.step-fixedbanner .hboxmini {
  color: #fff;
  width: 62px;
  height: 54px;
  text-align: center;
  position: fixed;
  bottom: 82px;
  left: 10px;
  font-size: 12px;
  background: #6f71ff;
  cursor: pointer;
  border-radius: 5px;
  padding-top: 6px;
  box-shadow: 0px 20px 30px 0px rgba(3, 9, 108, 0.1);
}
.step-fixedbanner.fixed {
  position: fixed;
  z-index: 100;
  bottom: 0;
  box-shadow: 0 -5px 5px -5px rgba(200, 200, 200, 0.8);
}
.step-fixedbanner.fixed .close {
  display: block;
  position: absolute;
  right: 6px;
  top: 6px;
  width: 24px;
  height: 24px;
  background: url(../img/chat/close.png) center no-repeat;
  background-size: 12px 12px;
  background-position: 6px 6px;
  cursor: pointer;
}
.step-fixedbanner .close {
  display: none;
}
.step-fixedbanner .hbox {
  display: flex;
  justify-content: center;
  padding: 12px 0;
}
.step-fixedbanner .hbox a {
  display: block;
}
.step-fixedbanner .hbox .btn {
  margin: 0 18px;
  background: #525BEA;
  border: solid 1px #fff;
  color: #fff;
}
.twobox {
  margin: 0 auto;
  display: flex;
  width: 100%;
  justify-content: center;
}
.twobox .left {
  width: 590px;
  display: flex;
  align-items: center;
  position: relative;
  justify-content: flex-start;
}
.twobox .left img {
  -webkit-transform: translateZ(0) translate(-25%, 0) scale(0.5, 0.5);
  -ms-transform: translateZ(0) translate(-25%, 0) scale(0.5, 0.5);
  -moz-transform: translateZ(0) translate(-25%, 0) scale(0.5, 0.5);
  transform: translateZ(0) translate(-25%, 0) scale(0.5, 0.5);
}
.twobox .right {
  width: 590px;
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.pbanner {
  background: #FAFAFE;
}
.pbanner .banner {
  width: 100%;
  height: 528px;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pbanner .banner img {
  height: 100%;
  width: auto;
}
.pbanner .banner .banner-cover {
  position: absolute;
  width: 100%;
  top: 0;
}
.pbanner .banner h1 {
  height: 62px;
  font-size: 44px;
  font-weight: normal;
  color: #FFFFFF;
  line-height: 62px;
  margin-top: 182px;
  margin-bottom: 21px;
}
.pbanner .banner p {
  height: 28px;
  font-size: 20px;
  font-weight: normal;
  color: #E1E1E1;
  line-height: 28px;
}
.pbanner .banner .btnbox {
  display: flex;
  justify-content: flex-start;
  margin-top: 84px;
}
.pbanner .banner .btnbox .btn {
  margin-right: 28px;
  width: 104px;
  height: 36px;
  background: #FFFFFF;
  box-shadow: 0px 4px 16px 0px rgba(122, 76, 224, 0.1781);
  padding: 0;
  line-height: 36px;
}
.pbanner .banner .btnbox .gochat:hover {
  color: #6F78FD;
}
.pbanner .banner .btnbox .abtn {
  width: 102px;
  height: 34px;
  line-height: 34px;
  background: rgba(0, 0, 0, 0);
  border: 1px solid #FFFFFF;
  color: #fff;
}
.pbanner .banner.industry h1 {
  color: #3D3D3D;
}
.pbanner .banner.industry p {
  color: #3D3D3D;
  width: 528px;
  text-align: justify;
}
.pbanner .banner.industry .btnbox .btn {
  background: #555FFF;
  box-shadow: 0px 4px 16px 0px rgba(122, 76, 224, 0.1781);
}
.pbanner .banner.industry .btnbox .gochat {
  color: #fff;
}
.pbanner .banner.industry .btnbox .gochat:hover {
  background: #6F78FD;
}
.pbanner .banner.industry .btnbox .abtn {
  box-shadow: 0px 4px 16px 0px rgba(122, 76, 224, 0.1781);
  opacity: 1;
  border: 1px solid #555FFF;
  background: rgba(0, 0, 0, 0);
  color: #555FFF;
}
.pbanner .banner.industry .btnbox .abtn:hover {
  color: #6F78FD;
}
.pbanner .twobox {
  height: 508px;
}
.pbanner .twobox .left .cimgp {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.pbanner .twobox .left .cimgp .cimg {
  -webkit-transform: translateZ(0) translate(0, 0) scale(0.5, 0.5);
  -ms-transform: translateZ(0) translate(0, 0) scale(0.5, 0.5);
  -moz-transform: translateZ(0) translate(0, 0) scale(0.5, 0.5);
  transform: translateZ(0) translate(0, 0) scale(0.5, 0.5);
}
.pbanner .twobox .right > .video {
  margin-left: 230px;
}
.pbanner .twobox .right h2 {
  height: 42px;
  font-size: 24px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 42px;
  margin-bottom: 32px;
  margin-top: 108px;
}
.pbanner .twobox .right p {
  width: 480px;
  font-size: 16px;
  font-weight: normal;
  color: #8C8C8C;
  line-height: 30px;
  text-align: justify;
}
.pbanner .twobox .right .btnbox {
  margin-top: 40px;
  display: flex;
}
.pbanner .twobox .right .btn {
  margin-right: 30px;
  width: 104px;
  height: 36px;
  background: #5861F6;
  box-shadow: 0px 4px 16px 0px rgba(122, 76, 224, 0.1781);
  padding: 0;
  color: #fff;
  line-height: 36px;
}
.pbanner .twobox .right .btn:hover {
  background: #6F78FD;
}
.pbanner .twobox .right .btn.video {
  position: relative;
  width: 64px;
  padding: 0 36px 0 16px;
  display: block;
}
.pbanner .twobox .right .btn.video:after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/product/play.svg) center no-repeat;
  background-size: cover;
  top: 10px;
  right: 16px;
}
.sc4 {
  padding: 0 50px;
  margin-bottom: 80px;
}
.sc4 .swiper-wrapper {
  width: 100%;
}
.sc4 .swiper-wrapper .case-one {
  background: #F7F8FA;
  width: 1180px;
  margin: 0 auto;
  height: 338px;
}
.sc4 .swiper-wrapper .case-one .imgbox {
  position: relative;
  width: 50%;
  height: 100%;
}
.sc4 .swiper-wrapper .case-one .imgbox img {
  width: 100%;
  height: 100%;
}
.sc4 .swiper-wrapper .case-one .cimgp {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  top: 0;
}
.sc4 .swiper-wrapper .case-one .cimgp .cimg {
  width: 234px;
  height: 110px;
  background: #FCFCFF;
  box-shadow: 0px 4px 12px 1px rgba(0, 11, 188, 0.05), inset 5px 2px 10px 0px rgba(202, 207, 255, 0.08);
  border-radius: 8px 8px 8px 8px;
  opacity: 1;
  border: 2px solid #FFFFFF;
}
.sc4 .swiper-wrapper .case-sub-box {
  position: absolute;
  top: 48px;
  left: 654px;
}
.sc4 .swiper-wrapper .case-sub-box .case-t {
  height: 42px;
  font-size: 20px;
  font-weight: normal;
  color: rgba(0, 0, 0, 0.75);
  line-height: 42px;
  margin-bottom: 24px;
}
.sc4 .swiper-wrapper .case-sub-box .case-item {
  width: 498px;
  font-size: 16px;
  font-weight: normal;
  color: rgba(0, 0, 0, 0.65);
  line-height: 30px;
  margin-bottom: 12px;
  display: block;
}
.sc4 .swiper-wrapper .case-sub-box .case-item span:first-child {
  color: #000000;
}
.sc4 .swiper-wrapper .case-sub-box .case-item:last-child {
  margin-top: 24px;
  padding: 0;
  width: 69px;
  height: 36px;
  background: #555EEF;
  box-shadow: 0px 4px 16px 0px rgba(122, 76, 224, 0.1781);
  line-height: 36px;
  padding-right: 32px;
  padding-left: 15px;
  color: #fff;
  position: relative;
  cursor: pointer;
  border-radius: 4px;
}
.sc4 .swiper-wrapper .case-sub-box .case-item:last-child span {
  color: #fff;
}
.sc4 .swiper-wrapper .case-sub-box .case-item:last-child:hover {
  background: #6F78FD;
}
.sc4 .swiper-wrapper .case-sub-box .case-item:last-child:after {
  content: '';
  position: absolute;
  width: 20px;
  height: 20px;
  background: url(../img/product/right.svg) center no-repeat;
  background-size: cover;
  top: 8px;
  right: 12px;
}
.sc4 .swiper-button-next2,
.sc4 .swiper-button-prev2 {
  width: 40px;
  height: 40px;
  background: rgba(255, 255, 255, 0.68);
  box-shadow: 0px 20px 30px 0px rgba(0, 11, 188, 0.05), inset 5px 2px 10px 0px rgba(202, 207, 255, 0.08);
  border: 1px solid rgba(235, 235, 235, 0.4);
  border-radius: 50%;
  position: absolute;
  top: 140px;
  left: 28px;
  z-index: 20;
  cursor: pointer;
}
.sc4 .swiper-button-next2 {
  left: inherit;
  right: 28px;
  -webkit-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  -moz-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
.sc4 .swiper-button-next2:after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/swipper-arrow-r.svg) center no-repeat;
  background-size: cover;
  top: 12px;
  right: 12px;
}
.sc4 .swiper-button-prev2:after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/swipper-arrow-r.svg) center no-repeat;
  background-size: cover;
  top: 12px;
  right: 12px;
}
.stepv {
  height: 380px;
}
.stepv .img-cover {
  height: 100%;
}
.stepv .img-cover img {
  height: 100%;
}
.stepv .jz-box {
  display: flex;
  justify-content: space-between;
}
.stepv .jz-box .jz-card {
  height: 106px;
  width: 277px;
  display: block;
  position: relative;
}
.stepv .jz-box .jz-card img {
  width: 40px;
  height: 40px;
  margin: 0 auto 16px;
  display: block;
}
.stepv .jz-box .jz-card p {
  text-align: center;
  height: 28px;
  font-size: 16px;
  font-weight: normal;
  color: #FFFFFF;
  line-height: 28px;
  display: block;
}
.stepv .jz-box .jz-card:after {
  content: '';
  position: absolute;
  display: block;
  top: 48px;
  width: 12px;
  height: 40px;
  right: -12px;
  border-right: 1px solid #D8D8D8;
  opacity: 0.4;
}
.stepv .jz-box .jz-card:last-child:after {
  content: none;
}
.title-cover {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
}
.title-cover h2 {
  padding-top: 80px;
  margin: 0px auto 64px;
}
.steps {
  height: 612px;
}
.steps .img-cover {
  height: 100%;
}
.steps .img-cover img {
  height: 100%;
}
.steps .s-box {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.steps .s-box .s-card {
  width: 578px;
  height: 150px;
  background: #FFFBFB;
  border-radius: 8px;
  margin-bottom: 44px;
  position: relative;
  transition: all .2s;
}
.steps .s-box .s-card:hover {
  transform: translateY(-8px);
  box-shadow: 0px 20px 30px 0px rgba(3, 9, 108, 0.4);
}
.steps .s-box .s-card img {
  position: absolute;
  width: 40px;
  height: 40px;
  top: 55px;
  left: 56px;
}
.steps .s-box .s-card .bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: none;
}
.steps .s-box .s-card:hover .bg {
  display: none;
}
.steps .s-box .s-card .icon {
  position: absolute;
  width: 40px;
  height: 40px;
  top: 55px;
  left: 56px;
}
.steps .s-box .s-card p {
  position: absolute;
  width: 394px;
  top: 40px;
  left: 124px;
  height: 64px;
  font-size: 18px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 32px;
}
.steps .s-box .s-card p span:last-child {
  color: #555FFF;
}
.stepq .q-box {
  display: flex;
  justify-content: space-between;
}
.stepq .q-box .q-card {
  width: 277px;
  height: 304px;
  background: #F7F8FA;
  border-radius: 8px;
  margin-bottom: 80px;
  position: relative;
  transition: all .2s;
}
.stepq .q-box .q-card:hover {
  transform: translateY(-8px);
  box-shadow: 0px 20px 30px 0px rgba(3, 9, 108, 0.1), inset 5px 2px 10px 0px rgba(202, 207, 255, 0.08);
}
.stepq .q-box .q-card:hover img {
  animation: heartBeat;
  /* referring directly to the animation's @keyframe declaration */
  animation-duration: 2s;
  /* don't forget to set a duration! */
}
.stepq .q-box .q-card img {
  width: 80px;
  height: 80px;
  margin: 38px auto 16px;
  display: block;
}
.stepq .q-box .q-card h3 {
  height: 40px;
  font-size: 22px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 40px;
  margin: 0 auto;
  margin-bottom: 16px;
  text-align: center;
}
.stepq .q-box .q-card p {
  display: block;
  width: 180px;
  font-size: 14px;
  font-weight: normal;
  margin: 0 auto;
  color: #8C8C8C;
  line-height: 26px;
  text-align: center;
}
.stepp .twobox {
  height: 418px;
}
.stepp .p-card h3 {
  height: 42px;
  font-size: 24px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 42px;
  padding-top: 56px;
  margin-bottom: 24px;
}
.stepp .p-card p {
  width: 478px;
  font-size: 16px;
  font-weight: normal;
  color: #595959;
  line-height: 30px;
  margin-bottom: 12px;
}
.stepp .p-card p {
  padding-left: 22px;
  position: relative;
}
.stepp .p-card p:before {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background: url(../img/point-o.png) center no-repeat;
  background-size: cover;
  left: 0px;
  top: 5px;
}
.stepp .p-card p:last-child {
  height: 36px;
  background: #555EEF;
  box-shadow: 0px 4px 16px 0px rgba(122, 76, 224, 0.1781);
  opacity: 1;
  padding: 0 20px;
  display: block;
  width: fit-content;
  line-height: 36px;
  color: #fff;
  text-align: center;
  margin-top: 24px;
  border-radius: 4px;
  cursor: pointer;
}
.stepp .p-card p:last-child:before {
  content: none;
}
.stepp .p-card p:last-child:hover {
  background: #6F78FD;
}
.stepp .twobox:nth-child(even) {
  flex-direction: row-reverse;
  background: #F7F8FA;
}
.stepp .twobox:nth-child(even) .left {
  justify-content: flex-end;
}
.stepp .twobox:nth-child(even) .left img {
  -webkit-transform: translateZ(0) translate(25%, 0) scale(0.5, 0.5);
  -ms-transform: translateZ(0) translate(25%, 0) scale(0.5, 0.5);
  -moz-transform: translateZ(0) translate(25%, 0) scale(0.5, 0.5);
  transform: translateZ(0) translate(25%, 0) scale(0.5, 0.5);
}
.stepp .twobox:nth-child(even) .right {
  justify-content: flex-start;
}
.stepp .steppbtnpbox {
  position: absolute;
  bottom: 0px;
  width: 100%;
  left: 0;
  display: flex;
  justify-content: center;
}
.stepp .steppbtnpbox .steppbtn {
  position: initial;
  margin: 0 12px 60px;
}
.stepp .tpla-pbox {
  display: flex;
}
.stepp .tpla-pbox a,
.stepp .tpla-pbox p {
  height: 36px;
  background: #555EEF;
  box-shadow: 0px 4px 16px 0px rgba(122, 76, 224, 0.1781);
  opacity: 1;
  padding: 0 20px;
  display: block;
  width: fit-content;
  line-height: 36px;
  color: #fff;
  text-align: center;
  margin-top: 24px;
  border-radius: 4px;
  cursor: pointer;
  margin-right: 24px;
}
.stepp .tpla-pbox a:before,
.stepp .tpla-pbox p:before {
  content: none!important;
}
.stepp .tpla-pbox a:hover,
.stepp .tpla-pbox p:hover {
  background: rgba(111, 120, 253, 0.84);
}
.step_jg {
  height: 689px;
}
.step_jg .title-cover h2 {
  color: #3D3D3D;
}
.step_jg .img-cover {
  background: #fff;
  width: 100%;
  height: 100%;
}
.step_jg .img-cover img {
  width: 100%;
  height: 100%;
}
.step_jg .s-box img {
  width: 100%;
  height: auto;
}
.stepr .r-box {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 60px;
}
.stepr .r-box .r-card {
  cursor: pointer;
  position: relative;
  width: 217px;
  height: 204px;
  background: #F7F8FA;
  border-radius: 8px 8px 8px 8px;
  opacity: 1;
  margin-bottom: 24px;
}
.stepr .r-box .r-card .op {
  display: none;
}
.stepr .r-box .r-card img {
  margin: 32px 74px 0;
  width: 68px;
  height: 68px;
}
.stepr .r-box .r-card .t {
  width: 120px;
  height: 36px;
  font-size: 20px;
  font-weight: normal;
  line-height: 36px;
  color: #3D3D3D;
  margin: 0 auto;
  margin-top: 16px;
  text-align: center;
}
.stepr .r-box .r-card .rarrow {
  width: 16px;
  height: 16px;
  background: url(../img/product/rarrow.svg) center no-repeat;
  background-size: cover;
  margin-left: 101px;
  margin-top: 12px;
}
.stepr .r-box .r-card .op {
  font-size: 14px;
  font-weight: normal;
  color: #FFFFFF;
  line-height: 24px;
  padding: 0 24px;
}
.stepr .r-box .r-card:hover {
  background: #6F71FF;
}
.stepr .r-box .r-card:hover .rarrow {
  width: 32px;
  height: 32px;
  background: url(../img/product/rarrow-w.svg) center no-repeat;
  background-size: cover;
  position: absolute;
  left: 24px;
  bottom: 8px;
  padding: 0;
  margin: 0;
}
.stepr .r-box .r-card:hover p {
  color: #FFFFFF;
}
.stepr .r-box .r-card:hover .op {
  display: block;
}
.stepr .r-box .r-card:hover .t {
  text-align: left;
  margin: 24px 0 16px 24px;
}
.stepr .r-box .r-card:hover img {
  display: none;
}
.stepr .r-box .r-card.end:hover,
.stepr .r-box .r-card.end {
  background: #6F71FF;
}
.stepr .r-box .r-card.end:hover p,
.stepr .r-box .r-card.end p {
  padding: 0;
  margin: 0;
  color: #FFFFFF;
  margin-top: 64px;
  width: 128px;
  margin-left: 24px;
}
.stepr .r-box .r-card.end:hover .rarrow,
.stepr .r-box .r-card.end .rarrow {
  width: 32px;
  height: 32px;
  background: url(../img/product/rarrow-w.svg) center no-repeat;
  background-size: cover;
  position: absolute;
  left: 24px;
  bottom: 60px;
  padding: 0;
  margin: 0;
}
.stepr .r-box .r-card.space {
  opacity: 0;
}
.stepp.stepmodule .twobox {
  flex-direction: row-reverse;
  height: 682px;
}
.stepp.stepmodule .twobox .left {
  width: 680px;
  justify-content: flex-end;
}
.stepp.stepmodule .twobox .right {
  width: 500px;
  justify-content: flex-start;
}
.stepp.stepmodule .p-card {
  width: 377px;
  margin-top: 60px;
}
.stepp.stepmodule .p-card p {
  padding-left: inherit;
}
.stepp.stepmodule .p-card p:before {
  content: none;
}
.stepp.stepmodule .p-card .p-card-one {
  cursor: pointer;
  width: 377px;
  border-left: solid 4px #F4F4F4;
  position: relative;
  margin: 4px 0;
  height: auto;
  display: flex;
  flex-direction: column;
}
.stepp.stepmodule .p-card .p-card-one.active {
  background: #FFFFFF;
  border-left: solid 4px #555FFF;
}
.stepp.stepmodule .p-card .p-card-one p {
  position: static;
  padding-left: 28px;
  height: auto;
  width: 337px;
}
.stepp.stepmodule .p-card .p-card-one img {
  width: 24px;
  height: 24px;
  left: 24px;
  top: 20px;
  position: absolute;
}
.stepp.stepmodule .p-card .p-card-one p:nth-child(2) {
  font-size: 18px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 32px;
  padding-left: 60px;
  height: 32px;
  margin-top: 16px;
  margin-bottom: 0;
}
.stepp.stepmodule .p-card .p-card-one p:nth-child(3) {
  width: 337px;
  left: 24px;
  top: 52px;
  font-size: 14px;
  padding-top: 4px;
  margin-bottom: 16px;
}
.stepp.stepmodule .twobox:nth-child(even) {
  flex-direction: row;
  background: #F7F8FA;
}
.stepp.stepmodule .twobox:nth-child(even) img {
  padding: 0px;
}
.stepp.stepmodule .twobox:nth-child(even) .left {
  justify-content: flex-end;
}
.stepp.stepmodule .twobox:nth-child(even) .right {
  justify-content: flex-end;
}
.stepp.stepmodule .twobox:nth-child(odd) .p-card .p-card-one.active {
  background: #F7F8FA;
}
.stepp.stepmodule .twobox:nth-child(odd) .left {
  justify-content: flex-start;
}
.stepp.stepmodule .twobox:nth-child(odd) .right {
  justify-content: flex-start;
}
.pbanner .banner p {
  width: 442px;
}
.step1 .left > img {
  width: 587px;
  height: 289px;
  transform: none;
}
.step1 .right > div {
  padding-left: 114px;
}
.stepp .twobox {
  height: 418px;
  padding-bottom: 126px;
  position: relative;
}
.stepp .steppbtn {
  position: absolute;
  width: 200px;
  height: 50px;
  background: #5861F6;
  box-shadow: 0px 4px 16px 0px rgba(122, 76, 224, 0.1781);
  opacity: 1;
  text-align: center;
  font-size: 18px;
  font-weight: 500;
  color: #FFFFFF;
  line-height: 50px;
  bottom: 0px;
  margin: 0 auto 60px;
  cursor: pointer;
  display: block;
  border-radius: 4px;
}
.stepp .steppbtn:hover {
  background: rgba(111, 120, 253, 0.84);
}
.stepp .p-card h3 {
  height: 42px;
  font-size: 24px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 42px;
  padding-top: 56px;
  margin-bottom: 0px;
}
.stepp .p-card h4 {
  height: 26px;
  font-size: 14px;
  font-weight: normal;
  color: #555FFF;
  line-height: 26px;
  margin-bottom: 24px;
}
.stepp .p-card p {
  width: 532px;
  font-size: 16px;
  font-weight: normal;
  color: #595959;
  line-height: 30px;
  height: 30px;
  margin-bottom: 8px;
  display: block;
  padding-left: 22px;
  position: relative;
}
.stepp .p-card p:before {
  content: '';
  position: absolute;
  display: block;
  top: 5px;
  width: 16px;
  height: 16px;
  left: 0px;
  background: url(../img/product/lipoint.svg) center no-repeat;
  background-size: cover;
}
.stepp .p-card .label {
  margin-top: 40px;
}
.stepp .p-card .label span {
  height: 28px;
  background: #FFFFFF;
  border-radius: 2px 2px 2px 2px;
  margin-right: 16px;
  line-height: 28px;
  text-align: center;
  padding: 0 16px;
  font-size: 14px;
  display: inline-block;
  color: #555FFF;
}
.stepp .p-card .label span:hover {
  color: #F0A86F;
}
.stepp .twobox:nth-child(even) {
  flex-direction: row-reverse;
  background: #F7F8FA;
}
.stepp .twobox:nth-child(even) img {
  padding-left: 108px;
}
.stepp .twobox:nth-child(odd) .p-card {
  width: 530px;
  padding-left: 0px;
}
.stepp .twobox:nth-child(odd) .p-card .label span {
  background: #F7F8FA;
}
.stepv {
  height: 416px;
}
.stepv .img-cover {
  height: 416px;
}
.stepv .img-cover img {
  height: 416px;
}
.stepv .jz-box .jz-card {
  height: 126px;
  width: 377px;
  display: block;
}
.stepv .jz-box .jz-card p {
  text-align: center;
  font-weight: normal;
  color: #FFFFFF;
  display: block;
  height: 32px;
  font-size: 20px;
  line-height: 32px;
  margin-bottom: 16px;
}
.stepv .jz-box .jz-card p:last-child {
  height: 26px;
  font-size: 14px;
  font-weight: normal;
  color: #FFFFFF;
  line-height: 26px;
}
.stepv .jz-box .jz-card p:last-child span {
  display: inline-block;
  width: 24px;
}
.stepv .jz-box .jz-card:after {
  content: '';
  position: absolute;
  display: block;
  top: 23px;
  width: 12px;
  height: 80px;
  right: -8px;
  border-right: 1px solid #D8D8D8;
  opacity: 0.4;
}
.stepv .jz-box .jz-card:last-child:after {
  content: none;
}
.stepq .q-box .q-card {
  width: 277px;
  height: 314px;
}
.stepq .q-box .q-card img {
  width: 80px;
  height: 80px;
  margin: 40px auto 24px;
}
.stepq .q-box .q-card h3 {
  height: 36px;
  font-size: 20px;
  font-weight: normal;
  color: #3D3D3D;
  line-height: 36px;
  margin: 0 auto;
  margin-bottom: 16px;
  text-align: center;
  display: block;
}
.stepq .q-box .q-card p {
  width: 181px;
  height: 78px;
  font-size: 16px;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.45);
  line-height: 26px;
  text-align: center;
  margin: 0 auto;
  display: block;
}