@charset "utf-8";
/* CSS Document */

* {            
	margin: 0px;
    padding: 0px;
  }
#anim1frame,#anim2frame,#anim3frame,#anim4frame,#anim5frame,#anim6frame,#anim7frame  {
		width:1020px;
		height:450px;
		position:relative;
		/*border:solid 1px #555;*
		margin-left: 5px;*/
		background-color:#000000;
		overflow:hidden;
	}
#anim1frame-list img, #anim2frame-list img, #anim3frame-list img, #anim4frame-list img, #anim5frame-list img, #anim6frame-list img, #anim7frame-list img {
		width:1020px;
		height:450px;
		margin:0px;
	}
#anim1frame-list{
 		padding:0;
 		margin:0;
		list-style-type:none;
		display:flex;
		display: -webkit-flex;
		position:absolute;
		-webkit-animation:fadeInOut 10s forwards;
		animation:fadeInOut 10s forwards;
	}
#anim2frame-list{
 		padding:0;
 		margin:0;
		list-style-type:none;
		display:flex;
		display: -webkit-flex;
		position:absolute;
		-webkit-animation:fadeInOut1steps 20s steps(1) infinite;
		animation:fadeInOut1steps 20s steps(1) infinite;
	}
#anim3frame-list{
 		padding:0;
 		margin:0;
		list-style-type:none;
		display:flex;
		display: -webkit-flex;
		position:absolute;
		-webkit-animation:fadeInOut2steps 24s steps(2) infinite;
		animation:fadeInOut2steps 24s steps(2) infinite;
	}
#anim4frame-list{
 		padding:0;
 		margin:0;
		list-style-type:none;
		display:flex;
		display: -webkit-flex;
		position:absolute;
		-webkit-animation:fadeInOut3steps 28s steps(3) infinite;
		animation:fadeInOut3steps 28s steps(3) infinite;
	}
#anim5frame-list{
 		padding:0;
 		margin:0;
		list-style-type:none;
		display:flex;
		display: -webkit-flex;
		position:absolute;
		-webkit-animation:fadeInOut4steps 35s steps(4) infinite;
		animation:fadeInOut4steps 35s steps(4) infinite;
	}
#anim6frame-list{
 		padding:0;
 		margin:0;
		list-style-type:none;
		display:flex;
		display: -webkit-flex;
		position:absolute;
		-webkit-animation:fadeInOut5steps 48s steps(5) infinite;
		animation:fadeInOut5steps 48s steps(5) infinite;
	}
        
#anim7frame-list{
 		padding:0;
 		margin:0;
		list-style-type:none;
		display:flex;
		display: -webkit-flex;
		position:absolute;
		-webkit-animation:fadeInOut6steps 12s steps(6) forwards;
		animation:fadeInOut6steps 12s steps(6) forwards;
	}
/* ----------------------- keyframes ------------------*/
@keyframes fadeInOut {
			0% {opacity: 1;left:0px;}
			18% {opacity: 1;animation-timing-function: ease-in;}
			78%	{opacity: 1;}
			100% {opacity: 1;}
			}
@-webkit-keyframes fadeInOut {
			0% {opacity: 1;left:0px;}
			18% {opacity: 1;-webkit-animation-timing-function: ease-in;}
			78%	{opacity: 1;}
			100% {opacity: 1;}
			}
@keyframes fadeInOut1steps {
			0% {opacity: 0;left:0px;}
			2% {opacity: 1; animation-timing-function: ease-out;}
			48%	{opacity: 1; animation-timing-function: ease-in;}
			50% {opacity: 0;left:-1020px;}
			52%	{opacity: 1;animation-timing-function: ease-out;}
			99% {opacity: 1; animation-timing-function: ease-in;}
			100% {opacity: 0;left:-1020px;}
			}
@-webkit-keyframes fadeInOut1steps {
			0% {opacity: 0;left:0px;}
			2% {opacity: 1;  -webkit-animation-timing-function: ease-out;}
			48%	{opacity: 1; -webkit-animation-timing-function: ease-in;}
			50% {opacity: 0;left:-1020px;}
			52%	{opacity: 1;-webkit-animation-timing-function: ease-out;}
			91% {opacity: 1; -webkit-animation-timing-function: ease-in;}
			100% {opacity: 1;left:-1020px;}
			}
@keyframes fadeInOut2steps {
			0% {opacity: 1;left:0px;}
			/*3% {opacity: 1; animation-timing-function: ease-out;}*/
			31.8%	{opacity: 1; animation-timing-function: ease-in;}
			33.33333333% {opacity: 0; animation-timing-function: ease-out;}
			34.8%	{opacity: 1;}
			65.16% {opacity: 1; animation-timing-function: ease-in;}
			66.66666666% {opacity: 0;left:-2040px;animation-timing-function: ease-out;}
			68.16%	{opacity: 1;}
			98.5% {opacity: 1; animation-timing-function: ease-in;}
			100% {opacity: 0;left:-2040px;}
			}
@-webkit-keyframes fadeInOut2steps {
			0% {opacity: 0;left:0px;}
			3% {opacity: 1; -webkit-animation-timing-function: ease-in;}
			31.8%{opacity: 1; -webkit-animation-timing-function: ease-out;}
			33.33333333% {opacity: 0;}
			34.8% {opacity: 1; -webkit-animation-timing-function: ease-in;}
			65.56% {opacity: 1; -webkit-animation-timing-function: ease-out;}
			66.66666666% {opacity: 0;left:-2040px;}
			68.16%	{opacity: 1; -webkit-animation-timing-function: ease-in;}
			99% {opacity: 1; -webkit-animation-timing-function: ease-in;}
			100% {opacity: 0;left:-2040px;}
			}
@keyframes fadeInOut3steps {
			0% {opacity: 0;left:0px;}
			3% {opacity: 1; animation-timing-function: ease-in;}
			23.5%{opacity: 1; animation-timing-function: ease-out;}
			25% {opacity: 0;}
			26.5% {opacity: 1; animation-timing-function: ease-in;}
			48.5% {opacity: 1; animation-timing-function: ease-out;}
			50% {opacity: 0;}
			51.5%	{opacity: 1; animation-timing-function: ease-in;}
			73.5% {opacity: 1; animation-timing-function: ease-out;}
			75% {opacity: 0;left:-3060px;}
			76.5%	{opacity: 1; animation-timing-function: ease-in;}
			98% {opacity: 1; animation-timing-function: ease-in;}
			100% {opacity: 0;left:-3060px;}
			}
@-webkit-keyframes fadeInOut3steps {
			0% {opacity: 0;left:0px;}
			3% {opacity: 1; -webkit-animation-timing-function: ease-in;}
			23.5%{opacity: 1; -webkit-animation-timing-function: ease-out;}
			25% {opacity: 0;}
			26.5% {opacity: 1; -webkit-animation-timing-function: ease-in;}
			48.5% {opacity: 1; -webkit-animation-timing-function: ease-out;}
			50% {opacity: 0;}
			51.5%	{opacity: 1; -webkit-animation-timing-function: ease-in;}
			73.5% {opacity: 1; -webkit-animation-timing-function: ease-out;}
			75% {opacity: 0;left:-3060px;}
			76.5%	{opacity: 1; -webkit-animation-timing-function: ease-in;}
			98% {opacity: 1; -webkit-animation-timing-function: ease-in;}
			100% {opacity: 0;left:-3060px;}
			}
@keyframes fadeInOut4steps {
			0% {opacity: 1;left:0px;}
			18% {opacity: 1;animation-timing-function: ease-in;}
			20% {opacity: 0;animation-timing-function: ease-out;}
			22% {opacity: 1;}
			38%	{opacity: 1; animation-timing-function: ease-in;}
			40% {opacity: 0; animation-timing-function: ease-out;}
			42% {opacity: 1;}
			58%	{opacity: 1; animation-timing-function: ease-in;}
			60% {opacity: 0; animation-timing-function: ease-out;}
			62%	{opacity: 1;}
			78%	{opacity: 1; animation-timing-function: ease-in;}
			80% {opacity: 0;left:-4080px;animation-timing-function: ease-out;}
			82%	{opacity: 1;}
			100% {opacity: 1;left:-4080px;}
			}
@-webkit-keyframes fadeInOut4steps {
			0% {opacity: 1;left:0px;}
			18% {opacity: 1; -webkit-animation-timing-function: ease-in;}
			20% {opacity: 0; -webkit-animation-timing-function: ease-out;}
			22% {opacity: 1;}
			38%	{opacity: 1;-webkit-animation-timing-function: ease-in;}
			40% {opacity: 0;-webkit-animation-timing-function: ease-out;}
			42% {opacity: 1;}
			58%	{opacity: 1;-webkit-animation-timing-function: ease-in;}
			60% {opacity: 0;-webkit-animation-timing-function: ease-out;}
			62%	{opacity: 1;}
			78%	{opacity: 1;-webkit-animation-timing-function: ease-in;}
			80% {opacity: 0;left:-4080px;-webkit-animation-timing-function: ease-out;}
			82%	{opacity: 1;}
			100% {opacity: 1;left:-4080px;}
			}
@keyframes fadeInOut5steps {
		0% {opacity: 1;left:0%;}
		14% {opacity: 1; animation-timing-function: ease-in;}
		16.666666% {opacity: 0; animation-timing-function: ease-out;}
		20% {opacity: 1;}
		30% {opacity: 1; animation-timing-function: ease-in;}
		33.333333% {opacity: 0; animation-timing-function: ease-out;}
		36% {opacity: 1;}
		46%	{opacity: 1; animation-timing-function: ease-in;}
		49.999998% {opacity: 0; animation-timing-function: ease-out;}
		52% {opacity: 1;}
		63%	{opacity: 1; animation-timing-function: ease-in;}
		66.666664% {opacity: 0; animation-timing-function: ease-out;}
		69%	{opacity: 1;}
		80%	{opacity: 1; animation-timing-function: ease-in;}
		83.333333% {opacity: 0;left:-5100px; animation-timing-function: ease-out;}
		86%	{opacity: 1;}
		100% {opacity: 1;left:-5100px;}
}
@-webkit-keyframes fadeInOut5steps {
		0% {opacity: 1;left:0%;}
		14% {opacity: 1; -webkit-animation-timing-function: ease-in;}
		16.666666% {opacity: 0; -webkit-animation-timing-function: ease-out;}
		20% {opacity: 1;}
		30% {opacity: 1; -webkit-animation-timing-function: ease-in;}
		33.333333% {opacity: 0; -webkit-animation-timing-function: ease-out;}
		36% {opacity: 1;}
		46%	{opacity: 1;-webkit-animation-timing-function: ease-in;}
		49.999998% {opacity: 0;-webkit-animation-timing-function: ease-out;}
		52% {opacity: 1;}
		63%	{opacity: 1;-webkit-animation-timing-function: ease-in;}
		66.666664% {opacity: 0;-webkit-animation-timing-function: ease-out;}
		69%	{opacity: 1;}
		80%	{opacity: 1;-webkit-animation-timing-function: ease-in;}
		83.333333% {opacity: 0;left:-5100px;-webkit-animation-timing-function: ease-out;}
		86%	{opacity: 1;}
		100% {opacity: 1;left:-5100px;}
}

@keyframes fadeInOut6steps {
		0% {opacity: 1;left:0%;}
		12.8% {opacity: 1; animation-timing-function: ease-in;}
		14.285714285714% {opacity: 0; animation-timing-function: ease-out;}
		15.8% {opacity: 1;}
		27% {opacity: 1; animation-timing-function: ease-in;}
		28.5714284% {opacity: 0; animation-timing-function: ease-out;}
		30% {opacity: 1;}
		41.3%	{opacity: 1; animation-timing-function: ease-in;}
		42.8571426% {opacity: 0; animation-timing-function: ease-out;}
		44.3% {opacity: 1;}
		55.7%	{opacity: 1; animation-timing-function: ease-in;}
		57.1428568% {opacity: 0; animation-timing-function: ease-out;}
		58.7%	{opacity: 1;}
		69.9%	{opacity: 1; animation-timing-function: ease-in;}
		71.428571% {opacity: 0; animation-timing-function: ease-out;}
		72.9%	{opacity: 1;}
		84.2%	{opacity: 1; animation-timing-function: ease-in;}
		85.7142852% {opacity: 0;left:-6120px; animation-timing-function: ease-out;}
		87.2%	{opacity: 1;}
		100% {opacity: 1;left:-6120px;}
}
@-webkit-keyframes fadeInOut6steps {
		0% {opacity: 1;left:0%;}
		12.8% {opacity: 1; -webkit-animation-timing-function: ease-in;}
		14.285714285714% {opacity: 0; -webkit-animation-timing-function: ease-out;}
		15.8% {opacity: 1;}
		27% {opacity: 1; -webkit-animation-timing-function: ease-in;}
		28.5714284% {opacity: 0; -webkit-animation-timing-function: ease-out;}
		30% {opacity: 1;}
		41.3%	{opacity: 1; -webkit-animation-timing-function: ease-in;}
		42.8571426% {opacity: 0; -webkit-animation-timing-function: ease-out;}
		44.3% {opacity: 1;}
		55.7%	{opacity: 1; -webkit-animation-timing-function: ease-in;}
		57.1428568% {opacity: 0; -webkit-animation-timing-function: ease-out;}
		58.7%	{opacity: 1;}
		69.9%	{opacity: 1; -webkit-animation-timing-function: ease-in;}
		71.428571% {opacity: 0; -webkit-animation-timing-function: ease-out;}
		72.9%	{opacity: 1;}
		84.2%	{opacity: 1; -webkit-animation-timing-function: ease-in;}
		85.7142852% {opacity: 0;left:-6120px; -webkit-animation-timing-function: ease-out;}
		87.2%	{opacity: 1;}
		100% {opacity: 1;left:-6120px;}
}