.swiper-container{position: relative;overflow: hidden;}
.panel-img-list-mobile-slide{display: none;margin-bottom: 20px;}
.swiper-container .img-box{position: relative;}
.swiper-container .img-box img{display: block;width: 100%;}
.swiper-container .text-box{width: calc(100% - 20px); height: auto;position: absolute;left: 0;color: #fff;text-align: left;-webkit-transition: all 0.5s;transition: all 0.5s;z-index: 4;bottom: 18px;padding: 15px 10px;font-size: 16px;}
.swiper-container .text-box .category{font-size: 14px;line-height: 20px;}
.swiper-container .text-box .name{font-size: 18px;font-weight: bold;line-height: 26px;}
.container-custom{text-align: center;position:relative;width: 85.652%;max-width: 1430px;margin-right: auto;margin-left: auto;padding-left: 15px;padding-right: 15px;margin-bottom: 70px;}
.title-box{margin-bottom: 35px; margin-top:35px;}
.title-box h2{color: #333;font-size: 32px;text-align: center;position: relative;padding-bottom: 8px;display: inline-block;max-width: 80%;}
.title-box h2:after {content: '';width: 45px;height: 2px;background-color: #c7000b;position: absolute;left: 0;right: 0;margin: 0 auto;bottom: 0;}

.panel-img-list{display: flex;position: relative;flex-wrap: wrap;}
.panel-img-list .panel-img-box{display: block;margin-right: 30px;width: calc(33.3333333% - 20px);margin-bottom: 30px;position: relative;}
.panel-img-list .panel-img-box:nth-child(1){width: calc(66.6666666% - 10px);}
.panel-img-list .panel-img-box:nth-child(2){width: calc(33.3333333% - 20px);}
.panel-img-list .panel-img-box:nth-child(3){width: calc(33.3333333% - 20px);}
.panel-img-list .panel-img-box:nth-child(4){width: calc(66.6666666% - 10px);}
.panel-img-list .panel-img-box:nth-child(2),.panel-img-list .panel-img-box:nth-child(4),.panel-img-list .panel-img-box:last-child{margin-right: 0;}
.panel-img-list .panel-img-box .img-box img{display: block;width: 100%;-webkit-transition: all 0.5s;transition: all 0.5s;position: relative;}
.panel-img-list .panel-img-box:nth-child(1) .img-box img,.panel-img-list .panel-img-box:nth-child(2) .img-box img,
.panel-img-list .panel-img-box:nth-child(3) .img-box img,.panel-img-list .panel-img-box:nth-child(4) .img-box img{height: 23vw;}
.panel-img-list .panel-img-box a {color: #fff;text-decoration: none;display: block;overflow: hidden;position: relative; height: 100%;}
.panel-img-list .panel-img-box .img-box{position: relative;}
.panel-img-list .panel-img-box .mask {position: absolute;z-index: 2;visibility: visible;opacity: 1;height: 70%;width: 100%;content: "";background: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 70%);display: block; top: auto;bottom: 0;}

.panel-img-list .panel-img-box .text-box {width: calc(100% - 60px); height: auto;position: absolute;left: 0;color: #fff;text-align: left;-webkit-transition: all 0.5s;transition: all 0.5s;z-index: 4;bottom: -50px;padding: 25px 30px;font-size: 16px;}
.panel-img-list .panel-img-box .text-box .category {font-size: 18px;line-height: 26px;color: #fff;}
.panel-img-list .panel-img-box .text-box .category-name {line-height: 34px;font-weight: bold;margin: 0;font-size: 24px;}
.panel-img-list .panel-img-box:nth-child(3) .text-box .category-name {margin-bottom: 15px;}
.panel-img-list .panel-img-box .text-box .category-text {font-size: 18px;line-height: 26px;opacity: 0.7;display: block;margin-bottom: 15px;}
.panel-img-list .panel-img-box .text-box .read-more{position: relative;display: inline-block;text-decoration: none;vertical-align: middle;font-size: 18px;color: #fff;line-height: 26px;}
.panel-img-list .panel-img-box:hover .img-box img {-webkit-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);}
.panel-img-list .panel-img-box:hover .mask {
        opacity: 1;
        visibility: visible;
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        z-index: 2;
        background-image: url(../images/mask_grad.png);
        background-repeat: repeat-x;
        background-position: left bottom;
        background-size: auto 100%;
    }
.panel-img-list .panel-img-box:hover .text-box {bottom: 0;}



@media (max-width:1440px) {
    .panel-img-list .panel-img-box .text-box .category,.panel-img-list .panel-img-box .text-box .category-text,
    .panel-img-list .panel-img-box .text-box .read-more{font-size: 16px;line-height: 24px;}	
    .panel-img-list .panel-img-box .text-box .category-name{font-size: 20px;line-height: 32px;}
}

@media (max-width:1280px) {
    .panel-img-list .panel-img-box .text-box .category,.panel-img-list .panel-img-box .text-box .category-text,
    .panel-img-list .panel-img-box .text-box .read-more{font-size: 14px;line-height: 24px;}	
    .panel-img-list .panel-img-box .text-box .category-name{font-size: 18px;line-height: 22px;}
}  
    
@media (max-width:991px) {
	.panel-img-list-mobile-slide{display: block;}
  	.container-custom{width:auto;max-width: initial; margin-bottom: 35px;}
  	.title-box{margin-bottom: 35px;margin-top: 35px;}
 /* 	.panel-img-list .panel-img-box a{display: flex;flex-wrap: wrap;background: #f5f5f5;}*/
  	.panel-img-list .panel-img-box{width: 100% !important;margin-right: 4% !important;}
  	.panel-img-list .panel-img-box:nth-child(2n){margin-right: 0 !important;}
  	.swiper-container .mask {
    	position: absolute;
    	width: 100%;
    	height: 100%;
    	left: 0;
    	top: 0;
    	z-index: 2;
    	background-image: url(../images/mask_grad.png);
    	background-repeat: repeat-x;
    	background-position: left bottom;
    	background-size: auto 100%;
    	visibility: visible;
	}
	.panel-img-list .panel-img-box .mask{display: none;}
	.panel-img-list .panel-img-box .img-box{background: #ffffff;width: 100%;}
	.panel-img-list .panel-img-box .text-box {
		width: calc(100% - 30px);
    	font-size: 14px;
        position: static;
        color: #000;
        background: #f5f5f5;
        padding: 10px 15px;
    }
    .panel-img-list .panel-img-box .text-box .category-text,.panel-img-list .panel-img-box .text-box {display: block; line-height:20px;}
	.panel-img-list .panel-img-box .text-box .read-more{display: none; }
    .panel-img-list .panel-img-box .text-box .category {
        color: #666;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        font-size: 14px;
    }
    .panel-img-list .panel-img-box .text-box .category-name {
        min-height: 2.8em;
        overflow: hidden;
        color: #333;
        font-size: 1.1em;
        max-height: 63px;
        line-height: 22px;
    }
   
}

@media (max-width:768px) {
	
}