ul,li {list-style: none;}
a {text-decoration: none;color: black;}
.box{width: 591px;height: 350px;overflow: hidden;position: relative;}
.box-1 ul{}
.box-1 ul li{width: 591px;height: 350px;position: relative;overflow: hidden;}
.box-1 ul li a img{display:block;width: 591px; height: 350px;}
.box-1 ul li p{position: absolute;left: 0;bottom: 0;height: 57px;width:480px;background: rgba(26,26,32,.6);text-indent: 1em;
    padding-right:111px ;font-size: 18px;line-height: 57px;text-overflow: ellipsis;overflow: hidden;
    white-space: nowrap;font-weight: normal;color: #fff}
.box-1 ul li p a{color: #fff}
.box-2{position: absolute;right: 10px;bottom: 23px;}
.box-2 ul li{float:left;width: 8px;height: 8px;overflow: hidden; margin: 0 4px; border-radius: 50%;
    background:#fff;text-indent: 100px;cursor: pointer;}
.box-2 ul .on{background: #004ea1;}

@media only screen and (max-width: 800px) {
    .box{width: 100%;height: 270px;overflow: hidden;position: relative;}
    .box-1 ul{}
    .box-1 ul li{width: 100%;height: 270px;position: relative;overflow: hidden;}
    .box-1 ul li a img{display:block;width:100%; height: 270px;}
    .box-1 ul li p{position: absolute;left: 0;bottom: 0;height: 40px;width:100%;background: rgba(26,26,32,.6);text-indent: 1em;
        padding-right:100px ;font-size: 0.8rem;line-height: 40px;text-overflow: ellipsis;overflow: hidden;
        white-space: nowrap;font-weight: normal;color: #fff}
    .box-1 ul li p a{color: #fff}
    .box-2{position: absolute;right: 10px;bottom: 15px;}
    .box-2 ul li{float:left;width: 8px;height: 8px;overflow: hidden; margin: 0 4px; border-radius: 50%;
        background:#fff;text-indent: 100px;cursor: pointer;}
    .box-2 ul .on_sjd{background: #004ea1;}
}