@charset "UTF-8";

._fnctWrap {line-height:1.5;}

.class-event-box{position: relative;}
.class-event-box img{width: 100%;}

.class-event-box .control .stop{width: 10px; height: 13px; background-image: url(../images/event_stop.png);}
.class-event-box .control .play{width: 10px; height: 13px; background-image: url(../images/event_play.png);}


.class-event-box .control{position: absolute; top: 20px; right: 20px;}
.class-event-box .paging{overflow: hidden; float: left;}
.class-event-box .slick-dots li{float: left; width: 10px; margin-right: 10px;}
.class-event-box .slick-dots li button{width: 10px; height: 10px; background-color: white; text-indent: -9999px; border-radius: 50%; display: inline-block; box-shadow: 0px 2px 2px #8d8d8d; position: relative;}
.class-event-box .paging .slick-active::after{content: ""; display: block; width: 10px; height: 3px; background-color: white; position: relative; top: -7px;}
.class-event-box .paging .slick-active button::before{content: ""; position: absolute; width: 6px; height: 6px; border-radius: 50%; background-color: #ff8477; top: 50%; left: 50%; margin: -3px 0 0 -3px;}


.class-event-box .playstop{float: left; margin-left: 10px; margin-top: 3px;}
.class-event-box .playstop button{display: none;}
.class-event-box .playstop .on{display: block;}

@media all and (max-width:1023px){
  .class-event-box img{height:310px;}
}

@media all and (max-width:767px){
  .class-event-box{width: 100%; float: none; margin-right: 0; margin-bottom: 30px;}
  .class-event-box img{height:auto;}
}