.wheel-slider {
  width: 100%;
  height: 900px;
  position: relative;
  overflow: hidden;
}

.slide-orbit {
  position: absolute;
  width: 80%;
  height: 80%;
  object-fit: contain;
  left: 0;
  top: 0;
  opacity: 0;
  pointer-events: none;
  will-change: transform, opacity;
}

.focus-box {
  position: absolute;
  width: 120px;
  height: 80px;

  border: 2px solid #9ccfd9;
  opacity: 0;
  z-index: 50;
  pointer-events: none;

  transform: scale(1.2);
  transition: opacity .25s ease, transform .25s ease;
}

.focus-box.active {
  opacity: 1;
  transform: scale(1);
}

.focus-box::before,
.focus-box::after {
  content: '';
  position: absolute;
  width: 20px;
  height: 20px;
}

.focus-box::before {
  top: -2px;
  left: -2px;
  border-top: 3px solid #9ccfd9;
  border-left: 3px solid #9ccfd9;
}

.focus-box::after {
  bottom: -2px;
  right: -2px;
  border-bottom: 3px solid #9ccfd9;
  border-right: 3px solid #9ccfd9;
}

.focus-box span {
  position: absolute;
  top: -26px;
  left: 0;
  background: #9ccfd9;
  color: #000;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 6px;
}