ul,ol,li{
    margin: 0;
    padding:0;
    list-style: none;
}
.slide-box{
    width: 800px;
    /* height: 300px; */
    border: solid 1px red;
    overflow: hidden;
    position: relative;
    padding-bottom: 20px;
}
.slide-container{
    width: 3200px;
    /* height: 300px; */
    /* border: solid 1px green; */
    position: absolute;
    top:0;
    left:0;
  
    
}
.slide-container::after{
    content: "";
    display: block;
    overflow: hidden;
    clear: both;
}
.slide-container li{
    width: 800px;
    /* height: 300px; */
    float: left;
    overflow: hidden;
}
.opinter-container{
    position: absolute;
    right: 0;
    bottom: 10px;
    /* border: solid 1px black; */
}
.opinter-container li{
    width: 20px;
    height: 5px;
    background: #4a4a4a;
    float: left;
    margin-left:5px;
}

.clearfix{
    content: "";
    display: block;
    overflow: hidden;
    clear: both;
}
.direction{
    position: absolute;
    right: 0;
    top:50%;
    transform: translateY(-50%);
    cursor: pointer;
    border: solid 1px red;
}
.opinter-container .opinter-container-active{
    background-color: #D5081E;
}
.direction{
    display: none;
}