.bg1 {
  background: url(../img/3c0fe590-7fd0-4db4-a086-170c8c86d3f7.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  background-position: top center;
}
.bg2 {
  background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../img/1727316355581243.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  background-position: top center;
  padding: 5rem 0;
}
.mt3 {
  margin-top: 3rem;
}
.bg2 .title2 {
  color: #fff;
}
.bg2 .BLogo ul li p:nth-child(2) {
  color: #fff;
}
.oemProcess {
  margin: 3rem 0;
}
.oemProcess ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 20px;
  margin: 2rem 0;
}

.oemProcess ul li {
  text-align: center;
  border: 1px solid var(--c1);
  padding: 10px;
  position: relative;
}

.oemProcess ul li::after {
  content: '';
  position: absolute;
  width: 60px;
  height: 4px;
  background: var(--c1);
  left: 50%;
  bottom: -2px;
  transform: translate(-50%, 0%);
}

.oemProcess ul li p:nth-child(1) {
  background-color: #fff;
  text-align: center;
  padding: 10px;
  box-shadow: 0 0 20px 0 rgba(0, 0, 105, 0.15);
  height: 300px;
  overflow: hidden;
}
.oemProcess ul li p:nth-child(2) {
  margin-top: 10px;
}

.title2 {
  text-align: center;
}
.title2 hr {
  width: 8rem;
  height: 4px;
  background: var(--c2);
}
.title2 p {
  font-size: 14px;
}
.oem2 {
  background: url(../img/bg.jpg?id=2);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  background-position: top center;
  padding: 5rem 0;
}

.oem2 .title2 {
  color: #fff;
}

.oem2 .title2 hr {
  background: var(--c1);
}
.Material {
  padding: 3rem 0rem 0;
  width: 80%;
  margin: 0 auto;
}
.Material ul {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-gap: 2rem;
}

.Material ul li {
  text-align: center;
  color: #fff;
}

.Color img {
  margin: 10px auto;
  display: block;
}

.oem3 {
  margin: 3rem auto;
}

.Color {
  padding: 2rem 4rem 0;
}
.BLogo {
  margin: 3rem 0 2rem;
}
.BLogo ul {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 1rem;
}

.BLogo ul li {
  text-align: center;
}

.BLogo ul li p:nth-child(2) {
  margin-top: 10px;
}
.BLogo ul li p:nth-child(1) {
  background-color: #fff;
  text-align: center;
  padding: 10px;
  box-shadow: 0 0 20px 0 rgba(0, 0, 105, 0.15);
  height: 300px;
}

.ly ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 1rem 2rem;
}

.ly ul li {
  text-align: center;
  padding: 3rem 10px;
  position: relative;
}
.ly ul li::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  background: url(../img/stat-bg.png);
  height: 100%;
  background-repeat: no-repeat;
  background-position: 98%;
  opacity: 0.2;
}
.ly ul li p:nth-child(1) {
  font-size: 3rem;
  position: relative;
  z-index: 9;
}
.ly ul li p:nth-child(1)::after {
  content: '';
  background: #2391eb94;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  right: 0;
  position: absolute;
  left: 53%;
  top: -12%;
  transform: translate(-50%, -50%);
  z-index: -1;
}

.ly ul li p:nth-child(2) {
  margin-top: 14px;
}

.ly ul li p:nth-child(2) span {
  display: block;
  font-size: 14px;
}

.ly ul li p:nth-child(2) span:nth-child(1) {
  font-size: 18px;
  margin: 26px 0 10px;
}

@media screen and (max-width: 700px) {
  .oemProcess ul li p:nth-child(1),
  .BLogo ul li p:nth-child(1) {
    height: 150px !important;
  }
  .Color {
    padding: 2rem 0rem 0 !important;
  }

  .oemProcess ul,
  .Material ul,
  .BLogo ul {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .ly ul {
    grid-template-columns: repeat(1, 1fr) !important;
    grid-gap: 0 !important;
  }
  .ly ul li {
    padding: 2rem 10px !important;
  }
}