.hero-photo {
  height: 540px;
  position: relative;
  overflow: hidden;
  background: #d8dddc;
  box-shadow: 0 28px 70px rgba(8, 29, 43, .18);
}
.hero-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(8, 31, 46, .05), transparent 45%, rgba(253, 187, 55, .12));
  pointer-events: none;
}
.hero-photo img,
.product-photo img,
.solution-photo img,
.about-photo > img,
.detail-visual > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero-photo img { object-position: center center; }
.product-photo {
  height: 220px;
  overflow: hidden;
  background: #dce1df;
  position: relative;
}
.product-photo::after {
  content: "实拍";
  position: absolute;
  top: 14px;
  left: 14px;
  padding: 7px 10px;
  background: rgba(9, 32, 47, .88);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .14em;
}
.product-photo img { transition: transform .45s ease; }
.product-card:hover .product-photo img { transform: scale(1.035); }
.solution-photo {
  height: 195px;
  overflow: hidden;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  margin-bottom: 23px;
  position: relative;
  background: #173145;
}
.solution-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(5, 22, 34, .38));
}
.solution-photo img { filter: saturate(.88) contrast(1.04); }
.about-photo {
  height: 535px;
  position: relative;
  overflow: hidden;
  background: #0b2332;
}
.about-photo > img { filter: saturate(.82) contrast(1.04); }
.about-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 48%, rgba(5, 25, 39, .74));
}
.about-photo-label {
  position: absolute;
  z-index: 2;
  left: 28px;
  bottom: 27px;
  display: flex;
  align-items: center;
  gap: 14px;
  color: #fff;
}
.about-photo-label strong {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  background: #fdbb37;
  color: #0b2332;
  font-size: 25px;
}
.about-photo-label span {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: .06em;
}
.detail-visual {
  overflow: hidden;
  display: block;
  background: #dce1df;
}
.detail-visual::before,
.detail-visual::after { display: none; }
.detail-visual > img {
  position: absolute;
  inset: 0;
}
.detail-visual-code,
.detail-visual small {
  z-index: 2;
  background: rgba(9, 32, 47, .88);
  color: #fff;
  padding: 8px 11px;
}
.detail-visual small {
  left: 30px;
  bottom: 27px;
}
@media (max-width: 980px) {
  .hero-photo { height: 500px; }
  .about-photo { width: min(570px, 94%); }
}
@media (max-width: 640px) {
  .hero-photo { height: 360px; margin-top: 24px; }
  .product-photo { height: 230px; }
  .about-photo { height: 390px; width: 100%; }
  .solution-photo { height: 210px; }
  .detail-visual-code { top: 18px; left: 18px; }
  .detail-visual small { left: 18px; bottom: 18px; }
}