/* - banner - start*/
.ys_banner {
  width: 100%;
  position: relative;
  overflow: hidden;
}

.ys_ban_li {
  position: relative;
  overflow: hidden;
}

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

.ys_ban_imgbox img {
  width: 100%;
}

.ys_ban_li>a {
  display: block;
}

.ys_ban_ph {
  display: none !important;
}

.ys_ban_video {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ys_ban_li:not(:first-child) {
  display: none;
}

.ys_ban_imgbox::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  /* background: rgba(0, 0, 0, .3); */
}

.ys_ban_txtbox {
  z-index: 5;
}

/* - banner - end*/
.he_bandits {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 6.5%;
  z-index: 10;
}

.he_bandili {
  cursor: pointer;
  margin: 30px 0;
  display: flex;
  align-items: center;
  text-align: right;
  width: 100%;
}

.he_bandili svg {
  display: inline-block;
  vertical-align: middle;
  width: 30px;
  height: 30px;
}

.he_bandili p {
  width: calc(100% - 30px);
  font-size: 18px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.4);
  transition: all 0.36s;
  padding-right: 15px;
}

.he_bandili.act p {
  color: #fff;
}

.he_bandili svg .circle {
  fill: #fff;
  transition: all 0.56s;
}

.he_bandili.act svg .circle {
  opacity: 0;
}

.he_bandili svg .wrapper {
  transition: all 0.56s;
  transform: scale(0);
  transform-origin: 50% 50%;
}

.he_bandili.act svg .wrapper {
  transform: scale(1);
}

.he_bandili .background {
  transform-origin: 15px 15px;
  stroke: #fff;
  -webkit-transition: stroke 0.2s linear;
  transition: stroke 0.2s linear;
}

.he_bandili .foreground {
  transform-origin: 15px 15px;
  stroke-dasharray: 87.9646px, 87.9646px;
  transform: rotate(-90deg);
  stroke: #fff;
}

.he_bandili circle {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.he_bandili.act .foreground {
  animation: stroke 6.1s linear 0.2s;
}

@keyframes stroke {
  0% {
    stroke-dasharray: 0, 87.9646px;
  }

  100% {
    stroke-dasharray: 87.9646px, 87.9646px;
  }
}

.he_svgdonx {
  position: absolute;
  top: 43%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 1920px;
  max-height: 940px;
  height: 100%;
  z-index: 100;
  pointer-events: none;
}
.he_svgdonx svg{
  margin-top: 9vh;
}
.he_svgdonx .circle {
  transition: all 0.56s ease-in;
}

.he_svgdonx .cursor_dian {
  transition: all 0.36s 0.6s;
}

.he_svgdonx .cursor-circle {
  transition: transform 0.36s ease-in-out;
  transform: scale(0);
  opacity: 0;
}

.he_svgdonx.on1 .cursor-circle {
  transform: scale(1);
  opacity: 1;
}

.he_svgdonx.act .cursor-circle {
  transform: scale(0);
  transition: all 0.16s;
}

.he_svgdonx .dotted-circle2 {
  transition: all 0s;
}

.he_svgdonx.act .dotted-circle2 {
  r: 1260px;
  transition: all 2.4s cubic-bezier(0.77, 0, 0.175, 1);
}

.he_tith1 {
  font-size: 60px;
  line-height: 1.5;
  color: #fff;
}

.he_tith2 {
  font-size: 48px;
  line-height: 1.5;
  color: #fff;
}

.he_tith3 {
  font-size: 40px;
  line-height: 1.5;
  color: #fff;
}

.he_tith4 {
  font-size: 30px;
  line-height: 1.5;
  color: #fff;
}

.he_tith5 {
  font-size: 24 px;
  line-height: 1.5;
  color: #fff;
}

.he_bant1 p {
  font-size: 30px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.6);
  font-weight: bold;
}

.he_bant2 p {
  font-size: 50px;
  line-height: 1.5;
  color: #ffffff;
  font-weight: bold;
}

.he_puclmo {
  width: 180px;
}

.he_puclmo a {
  display: inline-block;
  /* border: 1px solid #fff; */
  border-radius: 5px;
  padding: 0 0px;
  width: 100%;
  position: relative;
  z-index: 1;
  overflow: hidden;
  transition: all 0.6s;
}

.he_puclkri {
  width: 12px;
  line-height: 54px;
}

.he_puclkri img {
  width: 100%;
}

.he_puclkle p {
  font-size: 14px;
  line-height: 54px;
  color: #fff;
  transition: all 0.6s;
}

.he_puclkle p span {
  font-size: 27px;
  color: #00a1e8;
  margin-left: 20px;
  position: relative;
  top: 4px;
  transition: all 0.2s linear;
}

.he_puclkle {
  width: calc(100% - 12px);
}

.he_puclkri span {
  font-size: 12px;
  color: #fff;
  transition: all 0.6s;
}

.he_bamo {
  margin-top: 100px;
}

.ys_ban_li.slick-active .ys_ban_imgbox img {
  animation: mymove4 8s ease;
  -webkit-animation: mymove4 8s ease;
  animation-iteration-count: 1;
}

@-webkit-keyframes mymove4 {
  from {
    transform: scale(1.3);
  }

  to {
    transform: scale(1);
  }
}

.circlecs {
  transform: translate(0px, -0px) rotate(-90deg) translate(-686px, -0px)
}