.scrolltop { width: 40px; height: 40px; background: var(--color-01); border: 1px solid rgba(255, 255, 255, .25); border-radius: 0px; position: fixed; right: 15px; bottom: 15px; z-index: 100; visibility: hidden; opacity: 0; transition: all 0.4s;}
.scrolltop i { color: var(--color-12); font-size: 16px; line-height: 0;}
.scrolltop:hover { background-color: color-mix(in srgb, var(--color-02), transparent 20%); color: var(--color-12);}
.scrolltop.active { visibility: visible; opacity: 1;}

@media all and (max-width: 767px) {
  .scrolltop { width: 30px; height: 30px; right: 0px; bottom: 0px;}
  .scrolltop i { font-size: 12px;}
}