.case-banner{background-image: url('../img/case-banner_2x.jpg');}

.custom .classify{display: grid;margin-bottom: 5px;grid-template-columns: repeat(8, 1fr);
    grid-row-gap: 3px;    grid-column-gap: 3px;}
#lan_en .custom .classify{display:grid;grid-template-columns: repeat(4, 1fr);}
.custom .classify li{text-align: center;height: 50px;line-height: 50px;background-color: #fff;color: #666666;font-size: 18px;font-weight: 400;cursor: pointer;box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.05);}
.custom .classify li:hover{/*background-color: #EEF9FF;*/}
.custom .classify .active{background-color: #3468BE;color: #fff;pointer-events: none;}
.custom #custom-con .custom-con{display: none;height: auto;width: 100%;background: #FFFFFF;border: 1px solid rgba(51, 51, 51, 0.1);
box-shadow: 0px 18px 40px 10px rgba(0, 0, 0, 0.05);padding:20px;grid-template-columns:repeat(2, 1fr);grid-row-gap: 20px;grid-column-gap: 15px;}
.custom #custom-con .active{display: grid;display: -webkit-grid;}
.custom #custom-con .custom-con li{/*width: 160px;*/height: 60px;display: -webkit-inline-flex;display:inline-flex;align-items: center;text-align: center;justify-content:left;cursor: pointer;padding: 0 15px;position:relative;border-bottom: 1px solid #eee;}
.custom #custom-con .custom-con li::after{content: '';
    width: 18px;
    height: 16px;
    background-image: url(../img/download.png);
    background-repeat: no-repeat;
    position: absolute;
    right: 15px;}
.custom #custom-con .custom-con li:nth-child(6n+6){margin-right: 0;}
.custom #custom-con .custom-con i{display: block;width: 57px;height: 60px;}
.custom #custom-con .custom-con li a{display:flex;align-items:center;font-size:16px;color:#6d6d6d;}
.custom #custom-con .custom-con li img{max-width: 70%;max-height: 30px;transition: all 0.5s;transform: scale(1);margin-right:15px;}
.custom #custom-con .custom-con li:hover{border:1px solid #eeeeee;box-shadow: 0 5px 15px rgb(100 100 100 / 10%);}
.custom #custom-con .custom-con li:hover img{transform: scale(1.1);}
.cases{background: #F8F8F8;padding:76px 0 130px 0;}
.cases .main-wrap h2{font-weight: 400;font-size: 28px;color: #000;text-align: center;margin-bottom: 72px;}
.cases .cases-con{height: 1170px;width: 100%;display: grid;display: -webkit-grid;grid-template-columns:repeat(3, 1fr);grid-row-gap: 72px;grid-column-gap: 27px;}
.cases .cases-con li{position: relative;overflow: hidden;background-color: #fff;box-shadow: 0px 2px 8px 2px rgba(0, 0, 0, 0.05);}
.cases .cases-con .cases-cover{position: relative;}
.cases .cases-con .cases-cover img{width: 100%;display: block;}
.cases .cases-con .cases-cover h3{display: block;width: 252px;background-color: rgba(255,255, 255, 0.8);position: relative;font-size: 24px;height: 45px;
    line-height: 45px;font-weight: 500;left: 0;padding-left: 38px;top: -45px;margin-bottom: -45px;opacity:0;}
.cases .cases-con .cases-cover p{font-size: 21px;color: #666666;padding: 23px 38px;background-color: #fff;
text-align: justify;text-align-last: left;line-height: 24px;
text-justify: inter-ideograph; /*为了兼容IE*/
text-align-last: left;/* ie9*/
-moz-text-align: justify;
-moz-text-align-last: left;/*ff*/
-webkit-text-align:justify;
-webkit-text-align-last: left;/*chrome 20+*/
}
#lan_en .cases .cases-con .cases-cover p{font-size: 12px;line-height:17px;text-align:left;hyphens: auto; -webkit-hyphens: auto;}
.cases .cases-con .cases-info{color: #fff;background: linear-gradient(180deg, rgba(52, 104, 190, 0.95) 0%, rgba(157, 188, 240, 0.95) 100%);width: 100%;height: 100%;padding:88px 35px;transition: all 0.5s;position: absolute;top:371px;opacity: 0;}
#lan_en .cases .cases-con .cases-info{padding:37px 35px;}
.cases .cases-con .cases-info h3{font-size: 24px;font-weight: 500;text-align: center;margin-bottom: 28px;color:#fff;}
#lan_en .cases .cases-con .cases-info h3{font-size:22px;text-align:left;margin-bottom: 16px;}
.cases .cases-con .cases-info p{font-size: 14px;font-weight: 400;
text-align: justify;text-align-last: left;line-height: 24px;
text-justify: inter-ideograph; /*为了兼容IE*/
text-align-last: left;/* ie9*/
-moz-text-align: justify;
-moz-text-align-last: left;/*ff*/
-webkit-text-align:justify;
-webkit-text-align-last: left;/*chrome 20+*/
}
#lan_en .cases .cases-con .cases-info p{font-size:12px;line-height:17px;hyphens: auto; -webkit-hyphens: auto;text-align: left;}
.cases .cases-con .cases-info a{font-size: 14px;font-weight: 400;display: block;width: 150px;background: #FF8D37;height: 25px;line-height: 25px;
    border-radius: 6px;text-align: center;color: #fff;position: absolute;bottom: 50px;left: 50%;margin-left: -75px;}
#lan_en .cases .cases-con li{min-height:395px;}
.cases .cases-con li:hover .cases-info{top:0px;opacity: 1;}

/*大于1200*/
@media only screen and (min-width: 1200px){
	
}
/*750-1199*/
@media only screen and (min-width: 750px) and (max-width: 1199px){
.custom #custom-con .custom-con{grid-template-columns:repeat(4, 1fr);;grid-template-rows:repeat(8, 1fr);;height: auto;}
.custom #custom-con .active{display: grid;grid-template-columns:repeat(4, 1fr);;grid-template-rows:repeat(8, 1fr);;height: auto;}
.custom .classify{grid-template-columns: repeat(6, 1fr);}
#lan_en .custom .classify{grid-template-columns: repeat(3, 1fr);}
}
@media only screen and (max-width: 860px){
.custom .classify{grid-template-columns: repeat(4, 1fr);}
}
/*小于750*/
@media only screen and (max-width: 749px){
#lan_en .custom .classify{grid-template-columns: repeat(2, 1fr);}
#lan_en .custom .classify li{font-size:12px;}
.custom #custom-con .custom-con{grid-template-columns:repeat(3, 1fr);height: auto;}
.custom #custom-con .active{display: grid;grid-template-columns:repeat(3, 1fr);height: auto;}
.cases .cases-con .cases-info{padding: 40px 35px;}
.cases .cases-con{height: auto;grid-template-columns:repeat(2, 1fr);;grid-template-rows:repeat(5, 1fr);}
}
/*小于520*/
@media only screen and (max-width: 520px){
	.custom .classify{grid-template-columns: repeat(3, 1fr);width: 90vw;margin: 0 auto;}
.custom .classify li{min-width: 30vw;}
.custom #custom-con .custom-con{grid-template-columns:repeat(3, 1fr);height: auto;}
.custom #custom-con .active{display: grid;grid-template-columns:repeat(1, 1fr);height: auto;}
#lan_en .custom #custom-con .active{grid-template-rows: unset;}
.cases .cases-con{height: auto;grid-template-columns: 1fr;grid-template-rows:repeat(9, 1fr);}
}