﻿@charset "utf-8";

.lp_wrap .solution {
  overflow: hidden;
}
.lp_wrap .solution .marquee {
  position: absolute;
  top: -1.7%;
  left: 0%;
  width: 408.8%;
  display: flex;
}
.lp_wrap .solution .marquee div {
  animation: 13s solution_marquee linear infinite;
}
@keyframes solution_marquee {
  to {
    transform: translateX(-100%);
  }
}
.lp_wrap .solution .ex_mark {
  position: absolute;
  top: 15.6%;
  left: 5.3%;
  z-index: 1;
  width: 9.333%;
}
.lp_wrap .solution .ex_mark img {
  transition: 0.6s cubic-bezier(0.34, 1.56, 0.58, 1);
  transform: scale(0);
  opacity: 0;
}
.lp_wrap .solution .ex_mark.move img {
  transform: scale(1);
  opacity: 1;
}
.lp_wrap .solution .head div {
  position: absolute;
}
.lp_wrap .solution .head div:nth-child(1) {
  top: 18.5%;
  left: 21%;
  width: 71.6%;
  transition: 1.01s 0.2s;
  mask-image: linear-gradient(270deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, 1) 55%, rgba(0, 0, 0, 1) 100%);
  mask-size: 250% 100%;
  mask-position: 100% 0%;
}
.lp_wrap .solution .head div:nth-child(2) {
  top: 24.8%;
  left: 84%;
  z-index: 1;
  width: 11.467%;
  transition: 1.4s 0.6s;
  mask-image: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, 1) 55%, rgba(0, 0, 0, 1) 100%);
  mask-size: 100% 250%;
  mask-position: 0% 100%;
}
.lp_wrap .solution .ex_mark.move ~ .head div {
  mask-position: 0% 0%;
}
.lp_wrap .solution .video {
  position: absolute;
  top: 26.5%;
  left: 0%;
  width: 78.667%;
  overflow: hidden;
  border-radius: 0px min(5vw, 37.5px) min(5vw, 37.5px) 0px;
}
.lp_wrap .solution .goods li {
  position: absolute;
}
.lp_wrap .solution .goods li:nth-child(1) {
  top: 64.7%;
  left: -2.2%;
  width: 67.6%;
}
.lp_wrap .solution .goods li:nth-child(2) {
  top: 52.3%;
  left: 36.6%;
  width: 72%;
}
.lp_wrap .solution .goods li img {
  transform: scale(0);
  opacity: 0;
  transition: 0.8s cubic-bezier(0.34, 1.56, 0.58, 1);
}
.lp_wrap .solution .goods li.move ~ li img {
  transition: 0.8s 0.1s cubic-bezier(0.34, 1.56, 0.58, 1);
}
.lp_wrap .solution .goods li.move img,
.lp_wrap .solution .goods li.move ~ li img {
  transform: scale(1);
  opacity: 1;
}