@charset "UTF-8";

* {

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}



body {

    overflow-x: hidden;

    font-family: "Microsoft YaHei";

}



ul {

    padding: 0;

    margin: 0;

}

li {

    list-style: none;

}



/* 分页基本样式 */

.xypg-pagination {

    margin-top: 20px;

    text-align: center;

    font-size: 0;

}

.xypg-pagination .pagin-left, .xypg-pagination .pagin-mid, .xypg-pagination .pagin-right, .xypg-pagination .pagin-select {

    display: inline-block;

    vertical-align: middle;

}

.xypg-pagination a, .xypg-pagination #current {

    display: inline-block;

    font-size: 14px;

    color: #333333;

    font-family: "Microsoft YaHei", Arial;

    line-height: 26px;

    border: 1px solid #cbcbcb;

    margin: 0 5px;

    padding: 0 8px;

}

.xypg-pagination #current, .xypg-pagination a:hover {

    color: #fff;

    border-color: #00aeff;

    background: #00aeff;

}

.xypg-pagination .pagin-mid {

    font-size: 14px;

}



.xypg-pagination .pagin-mid .mob-pagin-mid {

    display: none;

}



.xypg-pagination .pagin-select {

    font-size: 14px;

}



.xypg-pagination .pagin-select select {

    height: 28px;

    padding: 0 8px;

    margin: -1px 5px 0 5px;

}





@media (max-width: 990px) {

    /* 弹出框之后 body 上增加一个禁止滚动的类*/

    body.no-scroll, html.no-scroll {

        height: 100vh;

        overflow: hidden;

    }



    .xymob-menu-click {

        position: fixed;

        width: 100vw;

        overflow-y: scroll;

        top: 0;

        left: 100%;

        -webkit-transition: all .5s ease;

        transition: all .5s ease;

        z-index: 999999;

        height: 100vh;

        background: rgba(0, 0, 0, 0.7);

    }



    .xymob-menu-click .xypg-left-news, .xymob-menu-click .xypg-left-keys, .xymob-menu-click .xypg-left-contact, .xymob-menu-click .page-message-img {

        display: none;

    }



    .xymob-menu-click .xymob-left-close-btn {

        display: block;

        position: absolute;

        top: 15px;

        right: 15px;

        width: 32px;

        height: 32px;

        line-height: 32px;

        border-radius: 50%;

        border: 1px solid #fff;

        text-align: center;

        background: black;

    }



    .xymob-menu-click .xymob-left-close-btn .icon-font {

        display: block;

        width: 100%;

        height: 100%;

    }



    .xymob-menu-click .xymob-left-close-btn .icon-font:after {

        background-position: -30px -300px;

    }



    .xymob-menu-click .xypg-left {

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;

        -webkit-box-align: center;

        -ms-flex-align: center;

        align-items: center;

        -webkit-box-pack: center;

        -ms-flex-pack: center;

        justify-content: center;

        min-height: 90vh;

        padding: 5vh 0;

    }



    .xymob-menu-click .xypg-left .xypg-left-menu {

        width: 90%;

        background: #fff;

    }



    .xymob-menu-click.click {

        left: 0;

    }

}









/* 图片样式  排版 */

.xypg-album-list {

    margin: 0 -1%;

}



.xypg-album-list li {

    float: left;

    width: 31.33333%;

    margin: 0 1% 20px 1%;

    position: relative;
    border: 1px solid #e0e0e0;

}



.xypg-album-list li .img {

    display: block;

    overflow: hidden;

}



.xypg-album-list li .img img {

    width: 100%;

    -webkit-transition: all .5s ease;

    transition: all .5s ease;

}



.xypg-album-list li h3 {

    position: absolute;

    left: 0;

    right: 0;
margin: 0;
    bottom: 0;

    z-index: 9;

    /* background: rgba(0, 0, 0, 0.5); */

    text-align: center;

    color: #fff;

    line-height: 40px;

    font-weight: normal;

    font-size: 16px;

}



.xypg-album-list li:hover .img img {

    -webkit-transform: scale(1.1);

    transform: scale(1.1);

}



@media (max-width: 768px) {

    .xypg-album-list li {

        width: 48%;

    }

}



@media (max-width: 420px) {

    .xypg-album-list {

        margin: 0;

    }



    .xypg-album-list li {

        width: 100%;

        margin: 0 0 20px 0;

    }

}



@media (max-width: 1200px) {

    .xypg-album-list.xypg-getkey-list li {

        width: 31.3333%;

    }

}

