/*
wap-col-1 
wap-col-2 
wap-col-3
pc-col-2
pc-col-3
pc-col-4
pc-col-6
col-auto
imgbox图片放大
wap-space-10px 手机间隙10px，20，30
pc-space-10px PC端间隙10px，20，30
*/

.list-img{width:100%;height: auto;border-radius: 10px;overflow: hidden;}
.list-img>img{width:100%;height: auto;}
.pc-col-6>ul,.pc-col-5>ul,.pc-col-4>ul,.pc-col-3>ul,.pc-col-2>ul,.wap-col-2>ul,.wap-col-3>ul{display: flex;flex-wrap: wrap;}/*高度一样*/
.pc-col-6>ul>li .imgbox,.pc-col-5>ul>li .imgbox,.pc-col-4>ul>li .imgbox,.pc-col-3>ul>li .imgbox,.pc-col-2>ul>li .imgbox{overflow: hidden;}
.pc-col-6>ul>li .imgbox>img,.pc-col-5>ul>li .imgbox>img,.pc-col-4>ul>li .imgbox>img,.pc-col-3>ul>li .imgbox>img,.pc-col-2>ul>li .imgbox>img{-ms-transition: 1s;-moz-transition: 1s;-webkit-transition: 1s;-o-transition: 1s;transition: 1s;}
.pc-col-6>ul>li:hover .imgbox>img,.pc-col-5>ul>li:hover .imgbox>img,.pc-col-4>ul>li:hover .imgbox>img,.pc-col-3>ul>li:hover .imgbox>img,.pc-col-2>ul>li:hover .imgbox>img{transform: scale(1.2, 1.2);-ms-transform: scale(1.2, 1.2);-moz-transform: scale(1.2, 1.2);-webkit-transform: scale(1.2, 1.2);-o-transform: scale(1.2, 1.2);}

.list-title{width:100%;color:#4b4b4b;text-align: center;}

@media screen and (max-width:899px){
    .pc-col-2>ul{margin:auto;}
    .pc-col-2>ul>li{width:auto;margin:auto;}

    .pc-col-3>ul{margin:auto;}
    .pc-col-3>ul>li{width:auto;margin:auto;}

	.pc-col-4>ul{margin:auto;}
    .pc-col-4>ul>li{width:auto;margin:auto;}

    .pc-col-6>ul{margin:auto;}
    .pc-col-6>ul>li{width:auto;margin:auto;}

    .pc-col-6>div{margin:auto;}

    .wap-col-1>ul{width:100%;}
    .wap-col-1>ul>li{width:100%;float: none;}
    .wap-col-1.wap-space-10px>ul{width:100%;}
    .wap-col-1.wap-space-10px>ul>li{width:100%;float: none;margin:10px 0px 0px 0px;}
    .wap-col-1.wap-space-20px>ul{width:100%;}
    .wap-col-1.wap-space-20px>ul>li{width:100%;float: none;margin:20px 0px 0px 0px;}
    .wap-col-1.wap-space-30px>ul{width:100%;}
    .wap-col-1.wap-space-30px>ul>li{width:100%;float: none;margin:30px 0px 0px 0px;}
/* 
    .wap-col-1>div{width:100%;float: none;}
    .wap-col-1.wap-space-10px>div{width:100%;float: none;margin:10px 0px 0px 0px;}
    .wap-col-1.wap-space-20px>div{width:100%;float: none;margin:20px 0px 0px 0px;}
    .wap-col-1.wap-space-30px>div{width:100%;float: none;margin:30px 0px 0px 0px;} */


    .wap-col-2{width: 100%;display: inline-block;}
    .wap-col-2>ul{margin:0px;}
    .wap-col-2>ul>li{width:50%;margin:0px;float:left;}
    .wap-col-2.wap-space-10px>ul{margin:-10px 0px 0px -10px;}
    .wap-col-2.wap-space-10px>ul>li{width:calc(50% - 10px);margin:10px 0px 0px 10px;float:left;}
    .wap-col-2.wap-space-20px>ul{margin:-20px 0px 0px -20px;}
    .wap-col-2.wap-space-20px>ul>li{width:calc(50% - 20px);margin:20px 0px 0px 20px;float:left;}
    .wap-col-2.wap-space-30px>ul{margin:-30px 0px 0px -30px;}
    .wap-col-2.wap-space-30px>ul>li{width:calc(50% - 30px);margin:30px 0px 0px 30px;float:left;}


    .wap-col-3{width: 100%;display: inline-block;}
    .wap-col-3>ul{margin:0px 0px 0px 0px;}
    .wap-col-3>ul>li{width:33.3333;margin:0px;float:left;}
    .wap-col-3.wap-space-10px>ul{margin:-10px 0px 0px -10px;}
    .wap-col-3.wap-space-10px>ul>li{width:calc(33.3333% - 10px);margin:10px 0px 0px 10px;float:left;}
    .wap-col-3.wap-space-20px>ul{margin:-20px 0px 0px -20px;}
    .wap-col-3.wap-space-20px>ul>li{width:calc(33.3333% - 20px);margin:20px 0px 0px 20px;float:left;}
    .wap-col-3.wap-space-30px>ul{margin:-30px 0px 0px -30px;}
    .wap-col-3.wap-space-30px>ul>li{width:calc(33.3333% - 30px);margin:20px 0px 0px 30px;float:left;}

    .col-auto{width: 100%;display: inline-block;}
	.col-auto>ul{margin:0px;}
    .col-auto>ul>li{width:100%;margin:0px;float:left;}
    .col-auto.space-10px>ul{margin: 0px;}
    .col-auto.space-10px>ul>li{width:100%;margin:10px 0px 0px 0px;float:left;}
    .col-auto.space-20px>ul{margin:0px;}
    .col-auto.space-20px>ul>li{width:100%;margin:20px 0px 0px 0px;float:left;}
    .col-auto.space-30px>ul{margin:0px;}
    .col-auto.space-30px>ul>li{width:100%;margin:30px 0px 0px 0px;float:left;}
}
@media screen and (min-width:900px) and (max-width:1299px){
    .wap-col-1>ul{width:auto;}
    .wap-col-1>ul>li{width:auto;}

    .wap-col-2>ul{margin:auto;}
    .wap-col-2>ul>li{width:auto;margin:auto;}

    .wap-col-3>ul{margin:auto;}
    .wap-col-3>ul>li{width:auto;margin:auto;}

    .pc-col-2{width: 100%;display: inline-block;}
    .pc-col-2>ul{margin:0px 0px 0px 0px;}
    .pc-col-2>ul>li{width:50%;margin:0px 0px 0px 0px;float:left;}
    .pc-col-2.pc-space-10px>ul{margin:-10px 0px 0px -10px;}
    .pc-col-2.pc-space-10px>ul>li{width:calc(50% - 10px);margin:10px 0px 0px 10px;float:left;}
    .pc-col-2.pc-space-20px>ul{margin:-20px 0px 0px -20px;}
    .pc-col-2.pc-space-20px>ul>li{width:calc(50% - 20px);margin:20px 0px 0px 20px;float:left;}    
    .pc-col-2.pc-space-30px>ul{margin:-30px 0px 0px -30px;}
    .pc-col-2.pc-space-30px>ul>li{width:calc(50% - 30px);margin:30px 0px 0px 30px;float:left;}

    .pc-col-3{width: 100%;display: inline-block;}
    .pc-col-3>ul{margin:0px;}
    .pc-col-3>ul>li{width:33.33%;margin: 0px;float:left;}
    .pc-col-3.pc-space-10px>ul{margin:-10px 0px 0px -10px;}
    .pc-col-3.pc-space-10px>ul>li{width:calc(33.33% - 10px);margin:10px 0px 0px 10px;float:left;}
    .pc-col-3.pc-space-20px>ul{margin:-20px 0px 0px -20px;}
    .pc-col-3.pc-space-20px>ul>li{width:calc(33.33% - 20px);margin:20px 0px 0px 20px;float:left;}
    .pc-col-3.pc-space-30px>ul{margin:-30px 0px 0px -30px;}
    .pc-col-3.pc-space-30px>ul>li{width:calc(33.33% - 30px);margin:30px 0px 0px 30px;float:left;}

    .pc-col-4{width: 100%;display: inline-block;}
	.pc-col-4>ul{margin:0px;}
    .pc-col-4>ul>li{width:25%;margin: 0px;float:left;}
    .pc-col-4.pc-space-10px>ul{margin:-10px 0px 0px -10px;}
    .pc-col-4.pc-space-10px>ul>li{width:calc(25% - 10px);margin:10px 0px 0px 10px;float:left;}
    .pc-col-4.pc-space-20px>ul{margin:-20px 0px 0px -20px;}
    .pc-col-4.pc-space-20px>ul>li{width:calc(25% - 20px);margin:20px 0px 0px 20px;float:left;}
    .pc-col-4.pc-space-30px>ul{margin:-30px 0px 0px -30px;}
    .pc-col-4.pc-space-30px>ul>li{width:calc(25% - 30px);margin:30px 0px 0px 30px;float:left;}

    .pc-col-6{width: 100%;display: inline-block;}
    .pc-col-6>ul{margin:0p;}
    .pc-col-6>ul>li{width:25%;margin:0px;float:left;}
    .pc-col-6.pc-space-10px>ul{margin:-10px 0px 0px -120px;}
    .pc-col-6.pc-space-10px>ul>li{width:calc(25% - 120px);margin:20px 0px 0px 20px;float:left;}
    .pc-col-6.pc-space-20px>ul{margin:-20px 0px 0px -20px;}
    .pc-col-6.pc-space-20px>ul>li{width:calc(25% - 20px);margin:20px 0px 0px 20px;float:left;}
    .pc-col-6.pc-space-30px>ul{margin:-30px 0px 0px -30px;}
    .pc-col-6.pc-space-30px>ul>li{width:calc(25% - 30px);margin:20px 0px 0px 20px;float:left;}


    .col-auto{width: 100%;display: inline-block;}
    .col-auto>ul{margin:0px;}
    .col-auto>ul>li{width:50%;margin:0px;float:left;}
    .col-auto.space-10px>ul{margin:-10px 0px 0px -10px;}
    .col-auto.space-10px>ul>li{width:calc(50% - 10px);margin:10px 0px 0px 10px;float:left;}
    .col-auto.space-20px>ul{margin:-20px 0px 0px -20px;}
    .col-auto.space-20px>ul>li{width:calc(50% - 20px);margin:30px 0px 0px 20px;float:left;}
    .col-auto.space-30px>ul{margin:-30px 0px 0px -30px;}
    .col-auto.space-30px>ul>li{width:calc(50% - 30px);margin:30px 0px 0px 30px;float:left;}

}
@media screen and (min-width:1300px){
    .wap-col-1>ul{width:auto;}
    .wap-col-1>ul>li{width:auto;}

    .wap-col-2>ul{margin:auto;}
    .wap-col-2>ul>li{width:auto;margin:auto;}

    .wap-col-3>ul{margin:auto;}
    .wap-col-3>ul>li{width:auto;margin:auto;}

    .pc-col-2{width: 100%;display: inline-block;}
    .pc-col-2>ul{margin:0px 0px 0px 0px;}
    .pc-col-2>ul>li{width:50%;margin:0px 0px 0px 0px;float:left;}
    .pc-col-2.pc-space-20px>ul{margin:-20px 0px 0px -20px;}
    .pc-col-2.pc-space-20px>ul>li{width:calc(50% - 20px);margin:20px 0px 0px 20px;float:left;}    
    .pc-col-2.pc-space-10px>ul{margin:-10px 0px 0px -10px;}
    .pc-col-2.pc-space-10px>ul>li{width:calc(50% - 10px);margin:10px 0px 0px 10px;float:left;}
    .pc-col-2.pc-space-30px>ul{margin:-30px 0px 0px -30px;}
    .pc-col-2.pc-space-30px>ul>li{width:calc(50% - 30px);margin:30px 0px 0px 30px;float:left;}

    .pc-col-3{width: 100%;display: inline-block;}
    .pc-col-3>ul{margin:0px;}
    .pc-col-3>ul>li{width:33.33%;margin: 0px;float:left;}
    .pc-col-3.pc-space-10px>ul{margin:-10px 0px 0px -10px;}
    .pc-col-3.pc-space-10px>ul>li{width:calc(33.33% - 10px);margin:10px 0px 0px 10px;float:left;}
    .pc-col-3.pc-space-20px>ul{margin:-20px 0px 0px -20px;}
    .pc-col-3.pc-space-20px>ul>li{width:calc(33.33% - 20px);margin:20px 0px 0px 20px;float:left;}
    .pc-col-3.pc-space-30px>ul{margin:-30px 0px 0px -30px;}
    .pc-col-3.pc-space-30px>ul>li{width:calc(33.33% - 30px);margin:30px 0px 0px 30px;float:left;}

    .pc-col-4{width: 100%;display: inline-block;}
	.pc-col-4>ul{margin:0px;}
    .pc-col-4>ul>li{width:25%;margin: 0px;float:left;}
    .pc-col-4.pc-space-10px>ul{margin:-10px 0px 0px -10px;}
    .pc-col-4.pc-space-10px>ul>li{width:calc(25% - 10px);margin:10px 0px 0px 10px;float:left;}
    .pc-col-4.pc-space-20px>ul{margin:-20px 0px 0px -20px;}
    .pc-col-4.pc-space-20px>ul>li{width:calc(25% - 20px);margin:20px 0px 0px 20px;float:left;}
    .pc-col-4.pc-space-30px>ul{margin:-30px 0px 0px -30px;}
    .pc-col-4.pc-space-30px>ul>li{width:calc(25% - 30px);margin:30px 0px 0px 30px;float:left;}

    .pc-col-6{width: 100%;display: inline-block;}
    .pc-col-6>ul{margin:0px;}
    .pc-col-6>ul>li{width:16.66%;margin:0px;float:left;}
    .pc-col-6.pc-space-10px>ul{margin:-10px 0px 0px -10px;}
    .pc-col-6.pc-space-10px>ul>li{width:calc(16.66% - 10px);margin:10px 0px 0px 10px;float:left;}
    .pc-col-6.pc-space-20px>ul{margin:-20px 0px 0px -20px;}
    .pc-col-6.pc-space-20px>ul>li{width:calc(16.66% - 20px);margin:20px 0px 0px 20px;float:left;}
    .pc-col-6.pc-space-30px>ul{margin:-30px 0px 0px -30px;}
    .pc-col-6.pc-space-30px>ul>li{width:calc(16.66% - 30px);margin:30px 0px 0px 30px;float:left;}


    .col-auto{width: 100%;display: inline-block;}
    .col-auto>ul{margin:0px;}
    .col-auto>ul>li{width:33.33%;margin:0px;float:left;}
    .col-auto.space-10px>ul{margin:-10px 0px 0px -10px;}
    .col-auto.space-10px>ul>li{width:calc(33.33% - 10px);margin:10px 0px 0px 10px;float:left;}
    .col-auto.space-20px>ul{margin:-20px 0px 0px -20px;}
    .col-auto.space-20px>ul>li{width:calc(33.33% - 20px);margin:30px 0px 0px 20px;float:left;}
    .col-auto.space-30px>ul{margin:-30px 0px 0px -30px;}
    .col-auto.space-30px>ul>li{width:calc(33.33% - 30px);margin:30px 0px 0px 30px;float:left;}
    
}
@media screen and (min-width:1600px){

    .col-auto{width: 100%;display: inline-block;}
    .col-auto>ul{margin:0px;}
    .col-auto>ul>li{width:25%;margin:0px;float:left;}
    .col-auto.space-10px>ul{margin:-10px 0px 0px -10px;}
    .col-auto.space-10px>ul>li{width:calc(25% - 10px);margin:10px 0px 0px 10px;float:left;}
    .col-auto.space-20px>ul{margin:-20px 0px 0px -20px;}
    .col-auto.space-20px>ul>li{width:calc(25% - 20px);margin:30px 0px 0px 20px;float:left;}
    .col-auto.space-30px>ul{margin:-30px 0px 0px -30px;}
    .col-auto.space-30px>ul>li{width:calc(25% - 30px);margin:30px 0px 0px 30px;float:left;}
}

@media screen and (min-width:2100px){
    .col-auto{width: 100%;display: inline-block;}
    .col-auto>ul{margin:0px;}
    .col-auto>ul>li{width:16.66%;margin:0px;float:left;}
    .col-auto.space-10px>ul{margin:-10px 0px 0px -10px;}
    .col-auto.space-10px>ul>li{width:calc(16.66% - 10px);margin:10px 0px 0px 10px;float:left;}
    .col-auto.space-20px>ul{margin:-20px 0px 0px -20px;}
    .col-auto.space-20px>ul>li{width:calc(16.66% - 20px);margin:30px 0px 0px 20px;float:left;}
    .col-auto.space-30px>ul{margin:-30px 0px 0px -30px;}
    .col-auto.space-30px>ul>li{width:calc(16.66% - 30px);margin:30px 0px 0px 30px;float:left;}
}
@media screen and (min-width:2600px){
    .col-auto{width: 100%;display: inline-block;}
    .col-auto>ul{margin:0px;}
    .col-auto>ul>li{width:12.5%;margin:0px;float:left;}
    .col-auto.space-10px>ul{margin:-10px 0px 0px -10px;}
    .col-auto.space-10px>ul>li{width:calc(12.5% - 10px);margin:10px 0px 0px 10px;float:left;}
    .col-auto.space-20px>ul{margin:-20px 0px 0px -20px;}
    .col-auto.space-20px>ul>li{width:calc(12.5% - 20px);margin:30px 0px 0px 20px;float:left;}
    .col-auto.space-30px>ul{margin:-30px 0px 0px -30px;}
    .col-auto.space-30px>ul>li{width:calc(12.5% - 30px);margin:30px 0px 0px 30px;float:left;}
}