.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 .title{position:absolute;width:auto;height:100%;left:0;top:0;font-size:30px;font-weight:bold;-webkit-writing-mode:vertical-rl;writing-mode:vertical-rl;animation-name:fadeInLeft;-webkit-animation-name:fadeInLeft;transition:all 0.4s ease-in-out 0s}
#articleInfo4:hover .title{letter-spacing:10px}
#articleInfo4 .slashBox{position:absolute;top: 460px;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;margin-left: 3%;position: relative;display: flex;}
#articleInfo4 .info .leftBox,#articleInfo4 .info .rightBox{float:left;width:55%}
#articleInfo4 .info .photoBox img{-webkit-transition:opacity 0.35s,-webkit-transform 0.35s;transition:opacity 0.35s,transform 0.35s}
#articleInfo4 .info .leftBox .photoBox,#articleInfo4 .info .leftBox .articleJ{margin-left:0}
#articleInfo4 .info .leftBox .sTitle{margin:20px 0 40px;animation-name:fadeInLeft;-webkit-animation-name:fadeInLeft}
@keyframes animatedIcon{0%{letter-spacing:0}
50%{letter-spacing:10px}
100%{letter-spacing:0}
}@-o-keyframes animatedIcon{0%{letter-spacing:0}
50%{letter-spacing:10px}
100%{letter-spacing:0}
}@-webkit-keyframes animatedIcon{0%{letter-spacing:0}
50%{letter-spacing:10px}
100%{letter-spacing:0}
}@-moz-keyframes animatedIcon{0%{letter-spacing:0}
50%{letter-spacing:10px}
100%{letter-spacing:0}
}@-ms-keyframes animatedIcon{0%{letter-spacing:0}
50%{letter-spacing:10px}
100%{letter-spacing:0}
}#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 .titleawan{font-size:max(2.4*(1vw + 1vh) / 2,24px)}
#articleInfo4 .toliiJtitle{background:#8d4745;padding:20px;color:#e6ded4;font-size:max(1.4*(1vw + 1vh) / 2,18px);letter-spacing:0.15em;margin:10px 0 0}
#articleInfo4 .info .leftBox .articleJ{font-size:16px;line-height:170%;animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#articleInfo4 .info .rightBox{margin-left:5%;width:40%}
#articleInfo4 .info .rightBox .photoBox{animation-name:fadeInRight;-webkit-animation-name:fadeInRight}


@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 .leftBox{width:100%}
	#articleInfo4 .info .rightBox{display:none}
	#articleInfo4 .slashBox{top:470px}
	#articleInfo4 .slashBox:before,#articleInfo4 .slashBox:after{width:250px;height:270px}
	#articleInfo4 .slashBox:before{height:250px}
	#articleInfo4 .info .leftBox .sTitle p:after{width:60%}
}

@media screen and (max-width: 640px) {
	#articleInfo4 .slashBox:before{height:150px}
	#articleInfo4 .slashBox:after{height:170px}
}

@media screen and (max-width: 480px) {
	#articleInfo4 .slashBox{display:none}
	#articleInfo4 .info .leftBox .articleJ{margin-left:0}
}

@media screen and (max-width: 450px) {
	#articleInfo4 .title{position:relative;height:auto;-webkit-writing-mode:horizontal-tb;writing-mode:horizontal-tb}
	#articleInfo4 .info,#articleInfo4 .info .leftBox .photoBox{margin-left:0}
	#articleInfo4 .info .leftBox .sTitle{margin:20px 0 10px}
	#articleInfo4 .info .leftBox .sTitle p:after{width:40%}
}
