/* 鯉のぼり */
#id_carpframe{
  transform:rotateY(-20deg) rotateZ(7deg);
  transform-origin:0px 300px 0px;
  animation-name: vem_carpframe;
  animation-fill-mode:backwards;
  animation-duration:13.0s;
  animation-iteration-count:infinite;
  animation-timing-function:ease-in;
  animation-delay: 0.0s;
  animation-direction:normal;
  opacity:0.0;
}

#id_carp_A0{
  position:absolute; 
  width:12px; 
  height:0px; 
  border:1px solid;
}
#id_carp_A1{
  position:absolute; 
  height:54px; 
  background-size:100% 100%;
  animation-name: vem_carp_A1;
  animation-fill-mode:backwards;
  animation-duration:11.5s;
  animation-iteration-count:infinite;
  animation-timing-function:linear;
  animation-delay: 0.0s;
  animation-direction:alternate;
}
#id_carp_A2{
  position:absolute; 
  height:54px; 
  background-size:100% 100%;
  animation-name: vem_carp_A2;
  animation-fill-mode:backwards;
  animation-duration:11.5s;
  animation-iteration-count:infinite;
  animation-timing-function:linear;
  animation-delay: 0.0s;
  animation-direction:alternate;
}
#id_carp_B0{
  position:absolute; 
  width:13px; 
  height:0px; 
  border:1px solid;
}
#id_carp_B1{
  position:absolute; 
  height:54px; 
  background-size:100% 100%;
  animation-name: vem_carp_B1;
  animation-fill-mode:backwards;
  animation-duration:9.5s;
  animation-iteration-count:infinite;
  animation-timing-function:linear;
  animation-delay: 0.0s;
  animation-direction:normal;
}
#id_carp_B2{
  position:absolute; 
  height:54px; 
  background-size:100% 100%;
  animation-name: vem_carp_B2;
  animation-fill-mode:backwards;
  animation-duration:9.5s;
  animation-iteration-count:infinite;
  animation-timing-function:linear;
  animation-delay: 0.0s;
  animation-direction:normal;
}
#id_carp_C0{
  position:absolute; 
  width:13px; 
  height:0px; 
  border:1px solid;
}
#id_carp_C1{
  position:absolute; 
  height:54px; 
  background-size:100% 100%;
  animation-name: vem_carp_C1;
  animation-fill-mode:backwards;
  animation-duration:7.0s;
  animation-iteration-count:infinite;
  animation-timing-function:linear;
  animation-delay: 0.0s;
  animation-direction:alternate-reverse;
}
#id_carp_C2{
  position:absolute; 
  height:54px; 
  background-size:100% 100%;
  animation-name: vem_carp_C2;
  animation-fill-mode:backwards;
  animation-duration:7.0s;
  animation-iteration-count:infinite;
  animation-timing-function:linear;
  animation-delay: 0.0s;
  animation-direction:alternate-reverse;
}
#id_ball{
  position:absolute; 
  top:17px; 
  width:45px; 
  height:45px;
  background-image:url(../images/kazaguruma.png); 
  background-size:100% 100%;
  animation-name: vem_ball;
  animation-fill-mode:backwards;
  animation-duration:0.2s;
  animation-iteration-count:infinite;
  animation-timing-function:linear;
  animation-delay: 0.0s;
  animation-direction:normal;
}
#id_pole {
  position:absolute; 
  top:40px; 
  width:7px; 
  height:260px;
  background-color:#cd853f;
}

@keyframes vem_carpframe {
  0%{ transform:rotateY(-20deg) rotateZ(7deg); opacity:1.0; }
  27%{ transform:rotateY(-21deg) rotateZ(9deg); }
  35%{ transform:rotateY(-23deg) rotateZ(10deg); }
  47%{ transform:rotateY(-27deg) rotateZ(7deg); }
  52%{ transform:rotateY(-25deg) rotateZ(10deg); }
  57%{ transform:rotateY(-31deg) rotateZ(7deg); }
  95%{ transform:rotateY(-26deg) rotateZ(9deg); }
  100%{ transform:rotateY(-20deg) rotateZ(7deg); opacity:1.0; }
}

@keyframes vem_carp_A1 {
  0%  { translate:0px 0px; rotate:z 0deg; background-image:url(../images/carp/carp_s1.png); }
  3%  { translate:0px 1px; rotate:z 1deg; }
  6%  { translate:0px 2px; rotate:z 2deg; }
  9%  { translate:0px 3px; rotate:z 3deg; }
  12% { translate:0px 4px; rotate:z 4deg; }
  15% { translate:0px 5px; rotate:z 5deg; }
  18% { translate:0px 6px; rotate:z 6deg; }
  21% { translate:0px 7px; rotate:z 7deg; }
  24% { translate:0px 8px; rotate:z 8deg; background-image:url(../images/carp/carp_s1.png); }
  27% { translate:0px 9px; rotate:z 9deg; }
  30% { translate:0px 10px; rotate:z 10deg; }
  33% { translate:0px 9px; rotate:z 8deg; }
  36% { translate:0px 8px; rotate:z 6deg; }
  39% { translate:0px 7px; rotate:z 4deg; }
  42% { translate:0px 6px; rotate:z 2deg; }
  45% { translate:0px 5px; rotate:z 0deg; }
  48% { translate:0px 4px; rotate:z -2deg; }
  51% { translate:0px 3px; rotate:z -4deg; background-image:url(../images/carp/carp_g1.png); }
  54% { translate:0px 2px; rotate:z -6deg; }
  57% { translate:0px 1px; rotate:z -8deg; }
  60% { translate:0px 0px; rotate:z -10deg; }
  63% { translate:0px 1px; rotate:z 1deg; }
  66% { translate:0px 2px; rotate:z 2deg; }
  69% { translate:0px 3px; rotate:z 3deg; }
  72% { translate:0px 4px; rotate:z 4deg; }
  75% { translate:0px 5px; rotate:z 5deg; background-image:url(../images/carp/carp_g1.png); }
  78% { translate:0px 5px; rotate:z 0deg; }
  81% { translate:0px 4px; rotate:z -2deg; }
  84% { translate:0px 3px; rotate:z -4deg; }
  87% { translate:0px 2px; rotate:z -6deg; }
  91% { translate:0px 1px; rotate:z -8deg; }
 100% { translate:0px 0px; rotate:z -10deg; background-image:url(../images/carp/carp_s1.png); }
}
@keyframes vem_carp_A2 {
  0%  { translate: 0px 0px; rotate:z 0deg; background-image:url(../images/carp/carp_s2.png); }
  3%  { translate:-1px 1px; rotate:z -2deg; }
  6%  { translate:-2px 2px; rotate:z -4deg; }
  9%  { translate:-3px 3px; rotate:z -6deg; }
  12% { translate:-4px 4px; rotate:z -8deg; }
  15% { translate:-5px 5px; rotate:z -10deg; }
  18% { translate:-6px 6px; rotate:z -12deg; }
  21% { translate:-7px 7px; rotate:z -14deg; }
  24% { translate:-8px 8px; rotate:z -16deg; background-image:url(../images/carp/carp_s2.png); }
  27% { translate:-9px 9px; rotate:z -18deg; }
  30% { translate:-10px 10px; rotate:z -20deg; }
  33% { translate:-10.2px 8px; rotate:z -17deg; }
  36% { translate:-10.4px 6px; rotate:z -14deg; }
  39% { translate:-10.6px 4px; rotate:z -11deg; }
  42% { translate:-10.8px 2px; rotate:z -8deg; }
  45% { translate:-11.0px 0px; rotate:z -5deg; }
  48% { translate:-11.2px -2px; rotate:z -2deg; }
  51% { translate:-11.4px -4px; rotate:z 1deg; background-image:url(../images/carp/carp_g2.png); }
  54% { translate:-11.6px -6px; rotate:z 4deg; }
  57% { translate:-11.8px -8px; rotate:z 7deg; }
  60% { translate:-12.0px -10px; rotate:z 10deg; }
  63% { translate:-1px 1px; rotate:z -2deg; }
  66% { translate:-2px 2px; rotate:z -4deg; }
  69% { translate:-3px 3px; rotate:z -6deg; }
  72% { translate:-4px 4px; rotate:z -8deg; }
  75% { translate:-5px 5px; rotate:z -10deg; background-image:url(../images/carp/carp_g2.png); }
  78% { translate:-11.0px 0px; rotate:z -5deg; }
  81% { translate:-11.2px -2px; rotate:z -2deg; }
  84% { translate:-11.4px -4px; rotate:z 1deg; }
  87% { translate:-11.6px -6px; rotate:z 4deg; }
  91% { translate:-11.8px -8px; rotate:z 7deg; }
 100% { translate:-12.0px -10px; rotate:z 10deg; background-image:url(../images/carp/carp_s2.png); }
}
@keyframes vem_carp_B1 {
  0%  { translate: 0px 0px; rotate:z 0deg; background-image:url(../images/carp/carp_t1.png); }
  3%  { translate:0.1px 1px; rotate:z 1deg;}
  6%  { translate:0.2px 2px; rotate:z 2deg;}
  9%  { translate:0.3px 3px; rotate:z 3deg;}
  12% { translate:0.4px 4px; rotate:z 4deg;}
  15% { translate:0.5px 5px; rotate:z 5deg;}
  18% { translate:0.6px 6px; rotate:z 6deg;}
  21% { translate:0.7px 7px; rotate:z 7deg;}
  24% { translate:0.8px 8px; rotate:z 8deg; background-image:url(../images/carp/carp_t1.png); }
  27% { translate:0.9px 9px; rotate:z 9deg;}
  30% { translate:1px 10px; rotate:z 10deg;}
  33% { translate:0.9px 9px; rotate:z 9deg;}
  36% { translate:0.8px 8px; rotate:z 8deg;}
  39% { translate:0.7px 7px; rotate:z 7deg;}
  42% { translate:0.6px 6px; rotate:z 6deg;}
  45% { translate:0.5px 5px; rotate:z 5deg;}
  48% { translate:0.6px 6px; rotate:z 6deg;}
  51% { translate:0.7px 7px; rotate:z 7deg; background-image:url(../images/carp/carp_v1.png); }
  54% { translate:0.8px 8px; rotate:z 8deg;}
  57% { translate:0.9px 9px; rotate:z 9deg;}
  60% { translate:1px 10px; rotate:z 10deg;}
  63% { translate:1px 10px; rotate:z 10deg;}
  66% { translate:1px 10px; rotate:z 10deg;}
  69% { translate:0.9px 9px; rotate:z 9deg;}
  72% { translate:0.8px 8px; rotate:z 8deg;}
  75% { translate:0.7px 7px; rotate:z 7deg; background-image:url(../images/carp/carp_v1.png); }
  78% { translate:0.6px 6px; rotate:z 6deg;}
  81% { translate:0.5px 5px; rotate:z 5deg;}
  84% { translate:0.4px 4px; rotate:z 4deg;}
  87% { translate:0.3px 3px; rotate:z 3deg;}
  90% { translate:0.1px 2px; rotate:z 2deg;}
  93% { translate:0.1px 1px; rotate:z 1deg;}
  96% { translate:0px 0px; rotate:z 0deg;}
  100% { translate:0px 0px; rotate:z 0deg;  background-image:url(../images/carp/carp_t1.png); }
}
@keyframes vem_carp_B2 {
  0%  { translate: 0px 0px; rotate:z 0deg; background-image:url(../images/carp/carp_t2.png); }
  3%  { translate:-0.5px 1px; rotate:z -2deg;}
  6%  { translate:-1.0px 2px; rotate:z -4deg;}
  9%  { translate:-1.5px 3px; rotate:z -6deg;}
  12% { translate:-2.0px 4px; rotate:z -8deg;}
  15% { translate:-2.5px 5px; rotate:z -10deg;}
  18% { translate:-3.0px 6px; rotate:z -12deg;}
  21% { translate:-3.5px 7px; rotate:z -14deg;}
  24% { translate:-4.0px 8px; rotate:z -16deg; background-image:url(../images/carp/carp_t2.png); }
  27% { translate:-4.5px 9px; rotate:z -18deg;}
  30% { translate:-5px 10px; rotate:z -20deg;}
  33% { translate:-4.0px 8px; rotate:z -16deg;}
  36% { translate:-3.5px 7px; rotate:z -14deg;}
  39% { translate:-3.0px 6px; rotate:z -12deg;}
  42% { translate:-2.5px 5px; rotate:z -10deg;}
  45% { translate:-2.0px 4px; rotate:z -8deg;}
  48% { translate:-3.0px 6px; rotate:z -12deg;}
  51% { translate:-3.5px 7px; rotate:z -14deg; background-image:url(../images/carp/carp_v2.png); }
  54% { translate:-4.0px 8px; rotate:z -16deg;}
  57% { translate:-4.5px 9px; rotate:z -18deg;}
  60% { translate:-5px 10px; rotate:z -20deg;}
  63% { translate:-5px 10px; rotate:z -20deg;}
  66% { translate:-4.5px 9px; rotate:z -18deg;}
  69% { translate:-4.0px 8px; rotate:z -16deg;}
  72% { translate:-3.5px 7px; rotate:z -14deg;}
  75% { translate:-3.0px 6px; rotate:z -12deg; background-image:url(../images/carp/carp_v2.png); }
  78% { translate:-2.5px 5px; rotate:z -10deg;}
  81% { translate:-2.0px 4px; rotate:z -8deg;}
  84% { translate:-1.5px 3px; rotate:z -6deg;}
  87% { translate:-1.0px 2px; rotate:z -4deg;}
  90% { translate:-0.5px 1px; rotate:z -2deg;}
  93% { translate:0px 0px; rotate:z 0deg;}
  96% { translate:0px 0px; rotate:z 0deg;}
  100% { translate:0px 0px; rotate:z 0deg; background-image:url(../images/carp/carp_t2.png); }
}
@keyframes vem_carp_C1 {
  0%  { translate: 0px 0px; rotate:z 0deg; background-image:url(../images/carp/carp_u1.png); }
  3%  { translate:0px 1px; rotate:z 1deg;}
  6%  { translate:0px 2px; rotate:z 2deg;}
  9%  { translate:0px 3px; rotate:z 3deg;}
  12% { translate:0px 4px; rotate:z 4deg;}
  15% { translate:0px 5px; rotate:z 5deg;}
  18% { translate:0px 6px; rotate:z 6deg;}
  21% { translate:0px 7px; rotate:z 7deg;}
  24% { translate:0px 8px; rotate:z 8deg; background-image:url(../images/carp/carp_u1.png); }
  27% { translate:0px 9px; rotate:z 9deg;}
  30% { translate:0px 10px; rotate:z 10deg;}
  33% { translate:0px 9px; rotate:z 8deg;}
  36% { translate:0px 8px; rotate:z 6deg;}
  39% { translate:0px 7px; rotate:z 4deg;}
  42% { translate:0px 6px; rotate:z 2deg;}
  45% { translate:0px 5px; rotate:z 0deg;}
  48% { translate:0px 4px; rotate:z -2deg;}
  51% { translate:0px 3px; rotate:z -4deg; background-image:url(../images/carp/carp_z1.png); }
  54% { translate:0px 2px; rotate:z -6deg;}
  57% { translate:0px 1px; rotate:z -8deg;}
  60% { translate:0px 0px; rotate:z -10deg;}
  63% { translate:0px 1px; rotate:z 1deg;}
  66% { translate:0px 2px; rotate:z 2deg;}
  69% { translate:0px 3px; rotate:z 3deg;}
  72% { translate:0px 4px; rotate:z 4deg; background-image:url(../images/carp/carp_z1.png); }
  75% { translate:0px 5px; rotate:z 5deg;}
  78% { translate:0px 5px; rotate:z 0deg;}
  81% { translate:0px 4px; rotate:z -2deg;}
  84% { translate:0px 3px; rotate:z -4deg;}
  87% { translate:0px 2px; rotate:z -6deg;}
  91% { translate:0px 1px; rotate:z -8deg;}
  100% { translate:0px 0px; rotate:z -10deg; background-image:url(../images/carp/carp_u1.png); }
}
@keyframes vem_carp_C2 {
  0%  { translate: 0px 0px; rotate:z 0deg; background-image:url(../images/carp/carp_u2.png); }
  3% { translate:-1px 1px; rotate:z -2deg; }
  6% { translate:-2px 2px; rotate:z -4deg; }
  9% { translate:-3px 3px; rotate:z -6deg; }
  12% { translate:-4px 4px; rotate:z -8deg; }
  15% { translate:-5px 5px; rotate:z -10deg; }
  18% { translate:-6px 6px; rotate:z -12deg; }
  21% { translate:-7px 7px; rotate:z -14deg; }
  24% { translate:-8px 8px; rotate:z -16deg; background-image:url(../images/carp/carp_u2.png); }
  27% { translate:-9px 9px; rotate:z -18deg; }
  30% { translate:-10px 10px; rotate:z -20deg; }
  33% { translate:-10.2px 8px; rotate:z -17deg; }
  36% { translate:-10.4px 6px; rotate:z -14deg; }
  39% { translate:-10.6px 4px; rotate:z -11deg; }
  42% { translate:-10.8px 2px; rotate:z -8deg; }
  45% { translate:-11.0px 0px; rotate:z -5deg; }
  48% { translate:-11.2px -2px; rotate:z -2deg; }
  51% { translate:-11.4px -4px; rotate:z 1deg; background-image:url(../images/carp/carp_z2.png); }
  54% { translate:-11.6px -6px; rotate:z 4deg; }
  57% { translate:-11.8px -8px; rotate:z 7deg; }
  60% { translate:-12.0px -10px; rotate:z 10deg; }
  63% { translate:-1px 1px; rotate:z -2deg; }
  66% { translate:-2px 2px; rotate:z -4deg; }
  69% { translate:-3px 3px; rotate:z -6deg; }
  72% { translate:-4px 4px; rotate:z -8deg; }
  75% { translate:-5px 5px; rotate:z -10deg; background-image:url(../images/carp/carp_z2.png); }
  78% { translate:-11.0px 0px; rotate:z -5deg; }
  81% { translate:-11.2px -2px; rotate:z -2deg; }
  84% { translate:-11.4px -4px; rotate:z 1deg; }
  87% { translate:-11.6px -6px; rotate:z 4deg; }
  91% { translate:-11.8px -8px; rotate:z 7deg; }
  100% { translate:-12.0px -10px; rotate:z 10deg; background-image:url(../images/carp/carp_u2.png); }
}
@keyframes vem_ball {
  0% { rotate: 0deg; }
  33% { rotate: 25deg; }
  66% { rotate: 50deg; }
  100% { rotate: 75deg; }
}