210720 UIUX WebDesign jQuery 연습_12_6(index.html -> slick_btn.css)

@charset 'UTF-8';
/* Slider */

/* Arrows */
.slick-prev,.slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; z-index: 999; display: block; width: 50px; height: 50px; transform: translate(0, -50%); cursor: pointer; border: none; outline: none; }
.slick-prev:hover,.slick-prev:focus,.slick-next:hover,.slick-next:focus { opacity: .5; }
.slick-prev { left: 100px; background: rgba(0,0,0,0.5) url('../images/mv_prev.png') no-repeat center center; }
.slick-next { right: 100px; background: rgba(0,0,0,0.5) url('../images/mv_next.png') no-repeat center center; }

/* Dots */
.slick-dots { position: absolute; bottom: 30px; display: block; width: 100%; padding: 0; margin: 0; text-align: center; }
.slick-dots li { position: relative; display: inline-block; width: 10px; height: 10px; margin: 0 5px; background: #ddd; border-radius: 50%; padding: 0; opacity: 0.5; cursor: pointer; }
.slick-dots li button { font-size: 0; line-height: 0; display: block; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; }
.slick-dots li.slick-active { opacity: 1; }