.lb-box {width:250px;height:173px;margin-top:5px;position: relative;overflow: hidden;}
.lb-content {width:100%;height:100%;}
.lb-item {width: 100%;height: 100%;display: none;position: relative;}
.lb-item > a {width: 100%;height: 100%;display: block;}
.lb-item > a > img {width: 100%;height: 100%;}
.lb-item > a > span {width: 100%;display: block;position: absolute;bottom: 0px;padding:10px 15px;color: #fff;background-color: rgba(0,0,0,0.7);}
@media (max-width:568px) {.lb-item > a > span {padding: 10px;}}
.lb-item.active {display: block;left: 0%;}
.lb-item.active.left {left: -100%;}
.lb-item.active.right {left: 100%;}

.lb-item.next,.lb-item.prev {display: block;position: absolute;top: 0px;}
.lb-item.next {left: 100%;}
.lb-item.prev {left: -100%;}
.lb-item.next.left,.lb-item.prev.right {left: 0%;}
.lb-sign {position: absolute;right: 10px;top:6px;padding: 5px 3px;border-radius: 6px;list-style: none;user-select: none;background-color: rgba(0,0,0,0.3);}
.lb-sign li {width: 22px;height: 20px;font-size: 14px;font-weight: 500;line-height: 20px;text-align: center;float: left;color: #aaa;margin: auto 4px;border-radius: 3px;cursor: pointer;}
.lb-sign li:hover {color: #fff;}
.lb-sign li.active {color: #000;background-color: #EBEBEB;}
.lb-ctrl {position: absolute;top: 50%;transform: translateY(-50%);font-size:20px;font-weight: 900;user-select: none;background-color: rgba(0,0,0,0.5);color: #fff;border-radius: 5px;cursor: pointer;transition: all 0.1s linear;}
.lb-ctrl.left {left: -50px;}
.lb-ctrl.right {right: -50px;}
.lb-box:hover .lb-ctrl.left {left: 10px;}
.lb-box:hover .lb-ctrl.right {right: 10px;}
.lb-ctrl:hover {background-color: #000;}