@charset "UTF-8";
/* 全局颜色 */
.light-blue {
  color: #1D9AFE;
}

/*背景图相关*/
.comp-background-blue {
  background-color: #1D9AFE;
}
.comp-background-size-cover {
  background-size: 100% 100%;
}

/*class类组件*/
.comp-container {
  width: 1440px;
  margin: 0 auto;
}

#header {
  height: 72px;
  background: #FFFFFF;
  width: 100%;
  box-shadow: 0 2px 14px 0 rgba(16, 96, 188, 0.18);
}
#header .header-logo {
  width: 150px;
  height: 48px;
}
#header .header-logo img {
  width: 100%;
  height: 100%;
}

.comp-fill {
  flex: 1 1 auto;
}

/*上下视图布局  容器给comp-top-bottom  布局在上边的容器给comp-top  布局在下边的给comp-bottm*/
.comp-top-bottom {
  display: flex;
  flex-direction: column;
}
.comp-top-bottom .comp-top {
  max-height: 100%;
  max-width: 100%;
  overflow: hidden;
}
.comp-top-bottom .comp-bottm {
  max-height: 100%;
  max-width: 100%;
  overflow: hidden;
}

.comp-left-right {
  display: flex;
}
.comp-left-right .comp-left {
  max-height: 100%;
  max-width: 100%;
  overflow: hidden;
}
.comp-left-right .comp-right {
  max-height: 100%;
  max-width: 100%;
  overflow: hidden;
}

/*上中下 三栏布局*/
.comp-top-bottom-foot {
  display: flex;
}

/*上下居中*/
.comp-child-middle {
  display: flex;
  align-items: center;
}

/*左右居中*/
.comp-child-center {
  display: flex;
  justify-content: center;
}

/*上下居中 左右居中*/
.comp-child-center-middle {
  display: flex;
  align-items: center;
  justify-content: center;
}
.comp-child-center-middle > * {
  max-width: 100%;
  max-height: 100%;
}

.comp-tit-1 {
  font-weight: 600;
  font-size: 36px;
  color: #1D9AFE;
  margin-bottom: 18px;
  text-align: center;
}

.comp-desc-1 {
  font-weight: 400;
  font-size: 21px;
  color: #666666;
  line-height: 34px;
}

.comp-btn-1 {
  min-width: 144px;
  padding: 0 40px;
  height: 56px;
  line-height: 56px;
  background: #1D9AFE;
  color: white;
  cursor: pointer;
}

.comp-btn-2 {
  min-width: 140px;
  line-height: 36px;
  background: linear-gradient(270deg, #6893FF 0%, #3C67FF 100%);
  border-radius: 18px;
  color: white;
}
.comp-btn-2 a {
  letter-spacing: 3px;
}
.comp-btn-2 path {
  stroke: white;
}

.comp-linear-gradient-1 {
  background: linear-gradient(180deg, #EDF4FF 0%, #FFFFFF 100%);
}

.icon-size-2 {
  width: 67px;
  height: 12px;
}

.icon-size-3 {
  width: 35px;
  height: 11px;
}

.comp-dian {
  width: 6px;
  height: 6px;
  display: inline-block;
  border-radius: 50%;
  margin-right: 5px;
  background-color: #1D9AFE;
  vertical-align: middle;
}

.index-card {
  width: 330px;
  transition: all 0.2s ease-out;
  height: 460px;
  overflow: hidden;
  margin-bottom: 20px;
}
.index-card:hover {
  transform: translate(0, -30px);
}
.index-card:hover .index-card-icon-arrow {
  display: inline-block;
}
.index-card .index-card-bottom {
  height: 80px;
  line-height: 80px;
}
.index-card .index-card-icon-arrow {
  transition: all 0.2s ease-out;
}
.index-card .index-card-img {
  width: 100%;
}

.index-bz1 {
  top: -110px;
  width: 1062px;
  height: 764px;
}
.index-bz1 .index-bz1-img {
  width: 100%;
  height: 100%;
}
.index-bz1 .index-bz2-img {
  width: 74px;
  height: 74px;
}

.index-card-2 {
  width: 390px;
  background-color: white;
  padding: 30px 25px;
}

.index-card-3 {
  left: 50%;
  transform: translate(-50%, 0);
  bottom: 110px;
}

.index-card-4 {
  width: 289px;
  height: 180px;
}
.index-card-4 img {
  width: 69px;
  height: 79px;
}

.index-card-5 {
  padding: 24px 40px;
  width: 453px;
  height: 218px;
}

.icon-size-4 {
  width: 56px;
  height: 56px;
}

.shake-horizontal {
  animation: shake-horizontal 15s linear infinite both;
}

@keyframes shake-horizontal {
  0%, 100% {
    transform: translateX(0);
  }
  10%, 30%, 50%, 70% {
    transform: translateX(-10px);
  }
  20%, 40%, 60% {
    transform: translateX(10px);
  }
  80% {
    transform: translateX(8px);
  }
  90% {
    transform: translateX(-8px);
  }
}

/*# sourceMappingURL=comp.css.map */