@charset "utf-8";

.modal-transfer{ width:650px; height:490px; position:relative}
.modal-transfer .first{ background-color:#FFF}
.modal-transfer .anime1{ position:absolute; left:0; top:0; opacity:0; background-color:#FFF;
animation:animation1 4s ease alternate forwards; -webkit-animation:animation1 4s ease 0s forwards; -o-animation:animation1 4s ease 0s forwards;
animation-delay:2s; -webkit-animation-delay:2s; -o-animation-delay:2s}
.modal-transfer .anime2{ position:absolute; left:146px; top:68px; opacity:0;
animation:animation2 2s ease alternate forwards; -webkit-animation:animation2 2s ease 0s forwards; -o-animation:animation2 2s ease 0s forwards; 
animation-delay:3s; -webkit-animation-delay:3s; -o-animation-delay:3s}
.modal-transfer .anime3{ position:absolute; left:45px; top:163px; opacity:0;
animation:animation3 2s ease alternate forwards; -webkit-animation:animation3 2s ease 0s forwards; -o-animation:animation3 2s ease 0s forwards;
animation-delay:4s; -webkit-animation-delay:4s; -o-animation-delay:4s}
.modal-transfer .anime3.transfer{ left:29px}
.modal-transfer .anime4{ position:absolute; left:88px; top:290px; opacity:0;
animation:animation3 2s ease alternate forwards; -webkit-animation:animation3 2s ease 0s forwards; -o-animation:animation3 2s ease 0s forwards;
animation-delay:5s; -webkit-animation-delay:5s; -o-animation-delay:5s}
.modal-transfer .anime4.transfer{ top:300px}
.modal-transfer .anime5{ position:absolute; left:238px; bottom:30px; opacity:0;
animation:animation3 2s ease alternate forwards; -webkit-animation:animation3 2s ease 0s forwards; -o-animation:animation3 2s ease 0s forwards;
animation-delay:6s; -webkit-animation-delay:6s; -o-animation-delay:6s}
@keyframes animation1{
0%{ opacity:0} 30%{ opacity:1} 100%{ opacity:1}
}
@keyframes animation2{
0%{ opacity: 0} 100%{ opacity: 1}
}
@keyframes animation3{
0%{ opacity: 0} 100%{ opacity: 1}
}
#topInfo{ width:1000px; margin:35px auto 0}