
 
 
 .general-cards__wrap{
    margin-top: 30px;
     display:-ms-flexbox;
     display:flex
    }
 
 .general-cards__item{
     height:230px;
     display:-ms-flexbox;
     display:flex;
     -ms-flex:1 1 33.33%;
     flex:1 1 33.33%;
     position:relative;
     margin-right:5%;
     color:#fff;
     overflow:hidden;
     border-bottom:3px solid #ce1b2e;


    width: 30%;
    /* height: 280px; */
    cursor: pointer;
    float: left;
    /* overflow: hidden; */
    position: relative;
    border-radius: 10px;



    }
 .general-cards__item:last-child{margin-right:0}
 .general-cards__item>a{display:block;width:100%;height:100%;color:#fff}
 .general-cards__item-image{
     position:absolute;
     left:0;
     bottom:0;
     width:100%;
     height:100%;
     display:-ms-flexbox;
     display:flex;
     -ms-flex-align:center;
     align-items:center;
     -ms-flex-pack:center;
     justify-content:center;
     overflow:hidden;
     /* transform:scaleY(.8) translateZ(0); */
     /* transform-origin:bottom; */
     transition:transform .5s ease;
     z-index:0
    }
 .general-cards__item-image img{
     transform:scaleY(1) translateZ(0);
     /* transform-origin:bottom; */
     transition:transform .5s ease;
     min-width:100%;
     min-height:100%;
     -ms-flex-negative:0;
     flex-shrink:0;
     height:auto
    }
 .general-cards__item:hover{z-index:20}
 .general-cards__item:hover .general-cards__item-image,
 .general-cards__item:hover .general-cards__item-image img{
     transform:scaleY(1.2) translateZ(0);
    }
    /* 在之前插入内容 */
 .general-cards__item:hover:before{
     transition:transform .5s ease .1s;
     opacity:.8
    }
    /* 在之后出入内容 */
.general-cards__item:hover:after{
    opacity:1;
    transform:scaleY(1) translateZ(0)
}
 .general-cards__item:hover .general-cards__item-cont,
 .general-cards__item:hover .general-cards__item-cont h4{
     transform:translateY(0)
    }
 .general-cards__item:hover .general-cards__item-cont h4~*{
     transform:translateY(10px);opacity:1
    }
 .general-cards__item:hover .general-cards__item-cont h4:after,.general-cards__item:hover .general-cards__item-cont h4:before{
     transform:translateY(205px);
     transition:transform .5s ease 0ms
    }
    /* 竖线 上向下 */
 .general-cards__item:hover .general-cards__item-cont h4 .top-animated-strip{
     height:calc(100% + 23px);
     top:-27px;
     transform:translateZ(0);
     transition:height .5s ease .5s,top .5s ease .5s
    }
 .general-cards__item:before{
     height:200%;
     transform:translateY(0) scale(1);
     opacity:.6;
     background:linear-gradient(0deg,rgba(0,0,0,.9),rgba(0,0,0,.9) 50%,transparent 70%,transparent)
    }
 .general-cards__item:after,.general-cards__item:before{
     content:"";
     position:absolute;
     display:block;
     z-index:1;
     width:100%;
     top:0;
     left:0;
     transition:transform .5s ease,opacity .5s ease
    }
 .general-cards__item:after{
     height:100%;
     transform:scaleY(.8) translateZ(0);
     transform-origin:bottom;
     opacity:0;
     background:rgba(54,143,252,.9)
    }

    /* 划出层 */
 .general-cards__item-cont{
     position:relative;
     z-index:2;
     /* height:200px; */
     width:100%;
     display:-ms-flexbox;
     display:flex;
     -ms-flex-direction:column;
     flex-direction:column;
     -ms-flex-pack:end;
     justify-content:flex-end;
     padding:27px 15px 18px 38px;
     transform:translateY(100%) translateY(-53px);
     transition:transform .5s ease;
     text-shadow:0 0 5px #000
    }
 .general-cards__item-cont h4{
     position:relative;
     font-family:Roboto,sans-serif;
     font-size:20px;
     margin-bottom:10px;
     font-weight:600;
     transform:translateY(-100%);
     transition:transform .5s ease
    }

/* 竖线 下向上 */
 .general-cards__item-cont h4~*{transform:translateY(20px);opacity:0;transition:transform .5s ease .2s,opacity .5s ease .2s}
 .general-cards__item-cont h4:after,.general-cards__item-cont h4:before{content:"";position:absolute;transition:transform .5s ease .5s}
 .general-cards__item-cont h4:before{width:1px;height:200%;background:hsla(0,0%,100%,.3);left:-12px;top:3px}
 .general-cards__item-cont h4:after{width:5px;height:5px;background:#ce1b2e;left:-14px;top:3px}

 /* 竖线 上向下 */
 .general-cards__item-cont h4 .top-animated-strip{position:absolute;display:block;height:0;overflow:hidden;left:-14px;width:5px;transform:translateZ(0);transition:height .5s ease 0ms,top .5s ease 0ms;transform-origin:top;top:calc(100% - 280px*.8 + 26px)}
 .general-cards__item-cont h4 .top-animated-strip:after{content:"";display:block;position:absolute;width:5px;height:5px;left:0;bottom:0;background:#ce1b2e}
 .general-cards__item-cont h4 .top-animated-strip:before{content:"";display:block;position:absolute;width:1px;height:100%;background:hsla(0,0%,100%,.3);left:2px;top:0}



 .general-cards__item-cont p{color:#bdbcbc;font-size:17px;line-height:1.3;-ms-flex-positive:1;flex-grow:1}
 /* .intro-heading{padding:90px 25px}
 .intro-heading h3{color:#003a81;text-transform:uppercase;margin:0 auto 20px}
 .intro-heading h3,.intro-heading p{text-align:center;width:100%;max-width:900px}
 .intro-heading p{font-size:27px;margin:0 auto}.tabs{max-width:1130px;position:relative} */



 /* .general-cards__item-cont a{padding:10px 40px} */

/* 探索 */
 .link-arrow{
     color:#fff;
     font-size:13px;
     font-weight:700;
     text-transform:uppercase;
     height:35px;
     line-height:31px;
     display:inline-block;
     border-bottom:3px solid #fff
    }
 .link-arrow:after{
     content:"»";
     display:inline;
     font-family:Arial,Helvetica,sans-serif;
     font-size:20px;
     font-weight:700;
     margin-left:9px;
     position:relative;top:1px
    }
 .link-arrow:hover{color:#ce1b2e;border-color:#ce1b2e}
 .link-arrow.no-border{border:none}
 
 
 
 @media only screen and (max-width: 500px) {
 	
 		.general-cards__wrap{
 		   margin-top: 0px;
 		    display:-ms-flexbox;
 		    /* display:flex */
			flex-direction:column;
 		   }
 		
 		.general-cards__item{
			
 		    height:230px;
 		    display:-ms-flexbox;
 		    display:flex;
 		    -ms-flex:1 1 33.33%;
 		    flex:1 1 33.33%;
 		    position:relative;
 		    margin-right:5%;
 		    color:#fff;
 		    overflow:hidden;
 		    border-bottom:3px solid #ce1b2e;
 		
 		
 		   width: 100%;
 		   /* height: 280px; */
 		   cursor: pointer;
 		   /* float: left; */
 		   /* overflow: hidden; */
 		   position: relative;
 		   border-radius: 10px;
			margin-top: 20px;	
 		
 		
 		   }
 	
 	
 	}