@charset 'UTF-8';

/* Arrows */
.slick-arrow{position: absolute; top: 50%;  display:block; width:20px; height: 20px; cursor: pointer; font-size:0; color:transparent; z-index:3;}


.slick-prev{left: -25px;}
.slick-next{right: -25px;}


/* Dots */
.slick-dotted.slick-slider { margin-bottom:0px; }
.slick-dots { position: absolute; bottom: 0px; /* display: block; width: 100%; */ padding: 0; margin: 0; list-style: none; text-align: center; }
.slick-dots li { position: relative; display: inline-block;  width:14px; height:14px; margin:3px; padding: 0; cursor: pointer; box-sizing:border-box;}



/**/
.arw_st01 .slick-arrow{width:60px; height:60px; border-radius:100%; top:50%; margin-top:-30px; border:1px solid #ddd; background:#FFF no-repeat center center; background-size:100% 100%;}
.arw_st01 .slick-prev{left:-30px; background-image:url(/img/common/slide_arw_prev.png);}
.arw_st01 .slick-next{right:-30px;  background-image:url(/img/common/slide_arw_next.png);}
@media (max-width: 1620px){
	.arw_st01 .slick-arrow{width:40px; height:40px; margin-top:-20px}
	.arw_st01 .slick-prev{left:-1%;}
	.arw_st01 .slick-next{right:-1%;}
}
@media (max-width: 550px){
	.arw_st01 .slick-prev{left:3%;}
	.arw_st01 .slick-next{right:3%;}
}

/**/
.slick-dots li button{display:none;}

.dot_bx .slick-dots li{width:10px; height:10px;  border:1px solid #FFF; margin:0 8px 0 0;}
.dot_bx .slick-dots li.slick-active{width:55px; background:#FFF;}
.dot_bx .slick-dots li:hover{background:#FFF;}

.dot_bx2 .slick-dots li{width:12px; height:12px;  border:1px solid #FFF; margin:0 3px;}
.dot_bx2 .slick-dots li.slick-active{background:#FFF;}
.dot_bx2 .slick-dots li:hover{background:rgba(255,255,255,0.6);}

.dot_wh .slick-dots li{width:13px; height:13px; background:rgba(0,0,0, 0.1); margin:0 3px; border-radius:13px;}
.dot_wh .slick-dots li.slick-active{background:#ee225d}
.dot_wh .slick-dots li:hover{ background:rgba(238,34,93,0.7); }

.dot_or .slick-dots li{width:10px; height:10px; border-radius:100%; border:1px solid rgba(255, 114, 20, 0.5); margin:0 4px;}
.dot_or .slick-dots li.slick-active{background:#FF7214}
.dot_or .slick-dots li:hover{border:1px solid #FF7214;}

@media all and (max-width:650px) {
	.dot_bx2 .slick-dots li{width:8px; height:8px; margin:0 2px;}
}