[HTML, CSS]애니메이션 효과(keyframes, scrollTop, scrollLeft)

<style>
	.ani_background_color{
				-webkit-animation-name: bc;
				-webkit-animation-duration: 0.5s;
				-webkit-animation-iteration-count: 2; 
				animation-duration: 0.5s;
  				animation-name: bc;
  				animation-iteration-count: 2;
                }
  	@-webkit-keyframes bc {
    	from {background-color: white;}
	    to {background-color: #eee;}
	}
	@keyframes bc {
	    from {background-color: white;}
	    to {background-color: #eee;}
	}
</style>



<script>
	
	$(document).ready(function(){
			
		var contract_num = sessionStorage.getItem("contractNum");
		
		if(contract_num != null){
			for(let i = 1; i < 13; i++){
				var data_contractnum = $("li.item:nth-child("+i+")").data("contractnum");
				if(contract_num == data_contractnum){
					$('li.item[data-contractnum="' + contract_num + '"]').addClass("ani_background_color");
				}
			}
			
			$('html, body').animate({scrollTop: $('.ani_background_color').offset().top-300, scrollLeft : 500}, '300');
			
		sessionStorage.clear();
		}
		
		
	});
	
</script>