@charset "utf-8";

/* CSS Document*/

header{background-size: cover!important;}

header .header{background-color: rgba(0,0,0,.7);}

.product{padding-bottom: 70px;}

.product .pro_tit{display: block; margin: 50px auto 60px;}

.product .pro_fl{width: 100%; border-bottom: 1px solid #cba972; text-align: center;}

.product .pro_fl>a{font-size: 24px; color: #999; border-bottom: 5px solid transparent; display: inline-block;

	height: 70px; line-height: 70px; margin: 0 40px; transition: .4s;}

.product .pro_fl>a:hover{color: #cba972;}

.border{color: #cba972!important; border-bottom: 5px solid #cba972!important;}



.page{border-bottom: 1px solid #cba972; line-height: 40px;}

.fenye{margin: 8px 0; float: left;}

.fenye span{font-size: 18px; color: #333; padding-right: 10px;}

.fenye a{font-size: 18px; color: #999; padding-right: 10px;}

.fenye a:hover{color: #cba972;}

.fenye select{width: 45px; outline: none; font-size: 18px; color: #333; border: 1px solid #c9c9c9;

    margin-right: 10px;}

.sanji_dh>li{float: left; font-size: 16px; width: 144px; height: 56px; line-height: 56px; text-align: center;}

.sanji_dh>li>a{color: #333; display: inline-block; width: 100%; height: 100%; transition: .4s;}

.sanji_dh>li>a:hover{color: #cba972;}

.sanji_active{color: #fff!important; background-color: #cba972;}



.qianyan{font-size: 18px; color: #333; line-height: 32px; padding: 55px 0;}

.qianyan>span{font-size: 24px; color: #cba972;}



.demo-gallery>ul>li{float: left; margin-bottom: 30px; margin-right: 2.6%; width: 31.6%;}

.demo-gallery>ul>li:nth-child(3n){margin-right: 0;}

.demo-gallery>ul>li:hover .img{box-shadow: 5px 5px 10px #ccc;}

.demo-gallery>ul>li .img{width: 100%; background-color: #f2f2f2; padding: 25px; box-sizing: border-box;

	transition: .4s;}

.demo-gallery>ul>li a>img{

    -webkit-transition: -webkit-transform 0.15s ease 0s;

    -moz-transition: -moz-transform 0.15s ease 0s;

    -o-transition: -o-transform 0.15s ease 0s;

    transition: transform 0.15s ease 0s;

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

    height: 100%;

    width: 100%;

}

.demo-gallery>ul>li .img>img{display: block; width: 100%;}

.demo-gallery > ul > li a:hover .demo-gallery-poster > img {opacity: 1;}

.demo-gallery > ul > li a .demo-gallery-poster {

    background-color: rgba(0, 0, 0, 0.1);

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    -webkit-transition: background-color 0.15s ease 0s;

    -o-transition: background-color 0.15s ease 0s;

    transition: background-color 0.15s ease 0s;

}

.demo-gallery > ul > li a .demo-gallery-poster > img {

    left: 50%;

    margin-left: -10px;

    margin-top: -10px;

    opacity: 0;

    position: absolute;

    top: 50%;

    -webkit-transition: opacity 0.3s ease 0s;

    -o-transition: opacity 0.3s ease 0s;

    transition: opacity 0.3s ease 0s;

}

.demo-gallery > ul > li a:hover .demo-gallery-poster {

    background-color: rgba(0, 0, 0, 0.5);

}

.demo-gallery .justified-gallery > a:hover .demo-gallery-poster > img {

    opacity: 1;

}

.demo-gallery .justified-gallery > a .demo-gallery-poster {

    background-color: rgba(0, 0, 0, 0.1);

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    -webkit-transition: background-color 0.15s ease 0s;

    -o-transition: background-color 0.15s ease 0s;

    transition: background-color 0.15s ease 0s;

}

.demo-gallery .justified-gallery > a .demo-gallery-poster > img {

    left: 50%;

    margin-left: -10px;

    margin-top: -10px;

    opacity: 0;

    position: absolute;

    top: 50%;

    -webkit-transition: opacity 0.3s ease 0s;

    -o-transition: opacity 0.3s ease 0s;

    transition: opacity 0.3s ease 0s;

}

.demo-gallery .justified-gallery > a:hover .demo-gallery-poster {

    background-color: rgba(0, 0, 0, 0.5);

}

.demo-gallery .video .demo-gallery-poster img {

    height: 48px;

    margin-left: -24px;

    margin-top: -24px;

    opacity: 0.8;

    width: 48px;

}

.demo-gallery.dark > ul > li a {

    border: 3px solid #04070a;

}

.honor_tit{font-size: 24px; color: #333; padding-top: 5px; transition: .5s; width: 100%; white-space: nowrap;

	overflow: hidden; text-overflow: ellipsis;}

.size{font-size: 18px; color: #333; transition: .5s;}

.demo-gallery>ul>li:hover .honor_tit{color: #cba972;}

.demo-gallery>ul>li:hover .size{color: #cba972;}

.lg-sub-html h4{font-size: 20px;}

.lg-sub-html p{font-size: 16px;}

.pagination{padding-top: 40px; padding-bottom: 20px;}
.pagination li{float: left; width: auto!important; margin-right: 0!important;}
.pagination a, .pagination span{width: 38px; height: 38px; line-height: 38px; background-color: #f7f7f7;
    font-size: 20px; padding: 0; text-align: center; border-radius: 0; font-size: 20px; color: #666666;}
.active span{color: #ffffff; background-color: #cba972;}

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

    .wap_banner{width: 100%; background-size: cover!important; height: 230px;}

    .wap_sanji .sanji_tit{width: 100%; height: 40px; background-color: #cbaa72; text-align: center;

        font-size: 17px; color: #fff; line-height: 40px; display: block;}

    .wap_sanji .sanji_tit>img{width: 15px;}


    .wap_sanji .sanji_tit2{width: 100%; height: 40px; background-color: #cbaa72; text-align: center;

        font-size: 17px; color: #fff; line-height: 40px; display: block;}

    .wap_sanji .sanji_tit2>img{width: 15px;}


    .wap_sanji .sanji_nav{display: none;}

    .wap_sanji .sanji_nav>li>a{display: block; height: 40px; line-height: 40px; text-align: center;

        font-size: 16px; border-bottom: 1px solid #ccc; color: #666;}

    .rotate{transform: rotate(180deg);}

    .fenye span{font-size: 16px; padding-right: 8px;}

    .fenye a{font-size: 16px; padding-right: 8px;}

    .fenye select{margin-right: 8px;}

    .fenye span:last-child{display: none;}

    .product{padding-bottom: 20px;}

    .product .pro_tit{display: none;}

    .qianyan{font-size: 16px; padding: 20px 0; line-height: 28px;}

    .qianyan>span{font-size: 18px;}

    .demo-gallery>ul>li{width: 48%; margin-right: 0; margin-bottom: 20px;}

    .demo-gallery>ul>li:nth-child(2n){float: right!important;}

    .demo-gallery>ul>li .img{padding: 8px;}

    .honor_tit{font-size: 16px;}

    .size{font-size: 14px;}

    .pagination{padding-top: 30px;}
    .pagination a, .pagination span{width: 32px; height: 32px; line-height: 32px; font-size: 18px;}

}
