body { 
 background: #000
}


@keyframes blink {
  40% {
    opacity:.5;
  }
  80% {
    opacity: 1;
  }
}


.rotated_one_conic_box,
.rotated_one_conic_box_demo{
  position: relative;
  width: 200px;
  height: 200px;
  overflow: hidden;
  border-radius: 10px;
  padding: 2rem;
//   border : 1px solid #fff;

  &::before {
    content: "";
    position: absolute;
    left: -50%;
    top: -50%;
    width: 200%;
    height: 200%;
    background: conic-gradient(transparent, rgba(168, 239, 255, 1), transparent 30%);
    animation: rotate 4s linear infinite;
  }

  &:after {
    content: "";
    position: absolute;
    top: 6px;
    left: 6px;
    right: 6px;
    bottom: 6px;
    background: #000;
  }
}

.rotated_one_conic_box_demo::after { 
    animation: blink 5s linear infinite;
}

@keyframes rotate {
  100% {
    transform: rotate(1turn);
  }
}