.links-list {

    max-width: 1148px;

    margin: 0 auto;

}



.links-list .pic-box {

    border: 1px solid #666666;

    padding: 10px;

    margin-bottom: 10px;

}



.links-list .item {

    width: 25%;

    padding: 0 15px;

}



.links-list .item:nth-child(4n+1) {

    clear: left;

}



.links-list .cover {

    position: absolute !important;

    left: 0;

    right: 0;

    top: 0;

    bottom: 0;

    z-index: 5;

    font-size: 0;

}



.links-list .box {

    margin: 0 auto 50px;

    text-align: left;

    position: relative;

}



.links-list .pic img {

    width: 100%;

}



.links-list .pic {

    position: relative;

    overflow: hidden;

    /* margin: 0 auto 10px; */

}



.links-list .pic:before {

    content: " ";

    position: absolute;

    top: 0;

    bottom: 0;

    right: 0;

    left: 0;

    background: url('../../images/common/links/hover.png') 50% 50% no-repeat rgba(0, 0, 0, 0.6);

    opacity: 0;

    margin: 0;

    -webkit-transition: all 0.3s;

    -o-transition: all 0.3s;

    transition: all 0.3s;

}



.links-list .item:hover .pic:before {

    opacity: 1;

}



.links-list .name,

.links-list .url {

    /* max-width: 240px; */

    margin: 0 auto;

}



.links-list .name {

    font-size: 16px;

    color: #fff;

    text-align: left;

    padding: 5px 0;

    position: relative;

    display: -webkit-inline-box;

}



.links-list .box:hover .name {

    color: #C3975B;

}



.links-list .item .name:after {

    content: '';

    width: 34px;

    height: 1px;

    background: #FFB973;

    position: absolute;

    left: 0;

    transition: all .3s ease;

    bottom: 0;

}



.links-list .item:hover .name:after {

    width: 100%;

}



.links-list .url {

    color: #999;

    font-size: 13px;

    white-space: nowrap;

    text-overflow: ellipsis;

    overflow: hidden;

    height: 21px;

    margin: 10px 0;

}



@media screen and (max-width: 1000px) {

    .links-list .item {

        width: 50%;

    }



    .links-list .item:nth-child(4n+1) {

        clear: none;

    }



    .links-list .item:nth-child(2n+1) {

        clear: left;

    }



    .links-list .box {

        margin: 0 auto 30px;

    }



}



@media screen and (max-width: 480px) {

    .links-list .item {

        width: 100%;

    }



    .links-list .item:nth-child(n) {

        clear: none;

    }

}