.wow{animation-name:fadeInDown;-webkit-animation-name:fadeInDown;animation-duration:1.5s;-webkit-animation-duration:1.5s;animation-fill-mode:both;-webkit-animation-fill-mode:both;animation-duration:1s;-webkit-animation-duration:1s}
#articleInfo4{position:relative}
#articleInfo4 a{color:#fff;background:#29A6DD}
#articleInfo4 a:hover{background:#0A7BAC}
#articleInfo4 .title{text-align:center;font-size:30px;animation-name:fadeInUp;-webkit-animation-name:fadeInUp;font-weight:500;margin-bottom: 50px;}
#articleInfo4 .slashBox{position:absolute;top:430px;left:15px;z-index:-1;animation-name:fadeInLeftBig;-webkit-animation-name:fadeInLeftBig}
#articleInfo4 .slashBox:before,#articleInfo4 .slashBox:after{position:absolute;height:250px;width:250px;display:block;content:""}
#articleInfo4 .slashBox:before{height:230px;background:#fff;left:calc(10% + 20px);z-index:-1}
#articleInfo4 .slashBox:after{background:url(/images/style/04/img-slash.png) top left;left:10%;z-index:-2}
#articleInfo4 .info{overflow:hidden;display:flex;flex-wrap:wrap;justify-content:space-between;margin-bottom:60px}
#articleInfo4 .info .leftBox,#articleInfo4 .info .rightBox{width:55%}
#articleInfo4 .info .photoBox img{-webkit-transition:opacity 0.35s,-webkit-transform 0.35s;transition:opacity 0.35s,transform 0.35s}
#articleInfo4 .info .photoBox:hover img{opacity:0.5;-webkit-transform:scale(0.98);transform:scale(0.98)}
#articleInfo4 .info .leftBox .sTitle{margin:70px 0 40px;animation-name:fadeInLeft;-webkit-animation-name:fadeInLeft}
#articleInfo4 .info .leftBox .sTitle:hover h3{animation:animatedIcon 1s;-webkit-animation:animatedIcon 1.5s infinite linear;-moz-animation:animatedIcon 1.5s infinite linear;-ms-animation:animatedIcon 1.5s infinite linear;-o-animation:animatedIcon 1.5s infinite linear}
#articleInfo4 .info .leftBox .sTitle p{font-size:18px;font-weight:bold}
#articleInfo4 .info .leftBox .sTitle p:after{margin-left:10px;width:150px;height:2px;background:#000;display:inline-block;content:"";vertical-align:middle}
#articleInfo4 .info .leftBox .sTitle h3{font-size:35px}
#articleInfo4 .info .leftBox article{font-size:16px;line-height:170%;animation-name:fadeInUp;-webkit-animation-name:fadeInUp;font-weight:300}
#articleInfo4 .info .rightBox{width:40%}
#articleInfo4 .info .rightBox .photoBox{animation-name:fadeInRight;-webkit-animation-name:fadeInRight;margin-bottom:50px;border-radius:5px;overflow:hidden}
#articleInfo4 .into{display:flex;flex-wrap: wrap;justify-content: space-between;align-items: center;margin-bottom: 100px;}#articleInfo4 .into >div{width: 45%;}
#articleInfo4 .into.two{margin:0;}
#articleInfo4 .into .right{width: 55%;}
#articleInfo4 .into .right h4{font-size: 24px;font-weight: 500;margin-bottom: 30px;}
#articleInfo4 .into .right p{font-weight: 300;}
#articleInfo4 ul{display: flex;flex-wrap: wrap;justify-content: center;margin-bottom: 90px;}
#articleInfo4 li{width: calc(50% - 102px);border: 1px solid #29A6DD;padding: 40px;margin: 10px;border-radius: 5px;}
#articleInfo4 li h5{font-weight: 400;text-align: center;color: var(--primary);margin-bottom: 30px;}
#articleInfo4 li:last-child h5{margin:0;}
#articleInfo4 li p{font-size: 14px;font-weight: 300;}
#articleInfo4 .table{display: flex;flex-wrap: wrap;justify-content: space-between;margin-bottom: 100px;}
#articleInfo4 .table .photo{width: 40%;}
#articleInfo4 .table .photo img{width:100%;}
#articleInfo4 .table .left{width: 55%;}
#articleInfo4 .application{display:flex;flex-wrap: wrap;justify-content: center;margin-bottom: 180px;}
#articleInfo4 .application .a-info{width: calc(50% - 20px);box-shadow: 0 0 10px rgb(0 0 0 / 10%);border-radius: 5px;background: #fff;margin: 10px;display: flex;flex-direction: column;align-items: center;overflow: hidden;}
#articleInfo4 .application .a-info h4{margin: 40px 0;font-size: 18px;text-align: center;font-weight: 400;color: var(--primary);}
#articleInfo4 .application .a-info h4 b{display: block;font-size: 18px;text-align: center;font-weight: 400;color: var(--primary);}
#articleInfo4 .application .a-info a{background:#CECECE;display: flex;justify-content: center;align-items: center;width: 100%;padding: 15px 0;border-radius: 5px 5px 0 0;}
#articleInfo4 .application .a-info a svg{width: 14px;height: 14px;}
#articleInfo4 .application .a-info a:hover{background:#29A6DD}
#articleInfo4 .application .a-info a:hover svg{fill:#fff;}
#articleInfo4 .cases{display: flex;flex-direction: column;align-items: center;}
#articleInfo4 .cases h3{f}
#articleInfo4 .cases h4{font-size: 24px;color: var(--primary);font-weight: 400;margin: 5px 0;}
#articleInfo4 .cases p{font-weight: 300;margin-bottom: 40px;}
table{margin:15px 0;width:100%;border-collapse:collapse}
td,th{padding:10px;border:1px solid #a2a9b1}
tr:nth-child(odd){background:#e4e4e4;}
tr:first-child{background:#5b9bd5;}
tr:first-child td{color: #fff !important;}

@media screen and (max-width:1280px){
	#articleInfo4 .slashBox:before,#articleInfo4 .slashBox:after{width:150px;height:170px}
	#articleInfo4 .slashBox:before{height:150px}
}
@media screen and (max-width:768px){
	#articleInfo4 .info, #articleInfo4 .into{display:block}
	#articleInfo4 .info .leftBox, #articleInfo4 .info .rightBox{width:100%;margin: 25px 0;}
	#articleInfo4 .info .rightBox, #articleInfo4 .info .rightBox .photoBox{text-align: center;}
	#articleInfo4 .into >div, #articleInfo4 .into .right{width:100%;}
	#articleInfo4 .into .right{margin-top:50px;}
	#articleInfo4 .into >div img{width:100%;}
	#articleInfo4 li{padding: 30px;width:100%;}
	#articleInfo4 .table{margin-top:30px;display:block;}
	#articleInfo4 .table .left, #articleInfo4 .table .photo{width:100%;}
}
@media screen and (max-width:640px){
	#articleInfo4 .slashBox:before{height:150px}
	#articleInfo4 .slashBox:after{height:170px}
	#articleInfo4 .title{margin-bottom: 0;}
	#articleInfo4 .table{margin-bottom: 40px;}
	#articleInfo4 .application .a-info{width:100%;}
}