@keyframes shinta-swing {
  0% {
    transform: rotate(0deg);
  }

  52% {
    transform: rotate(0deg);
  }

  60% {
    transform: rotate(10deg);
  }

  68% {
    transform: rotate(0deg);
  }

  76% {
    transform: rotate(10deg);
  }

  84% {
    transform: rotate(0deg);
  }

  92% {
    transform: rotate(10deg);
  }

  100% {
    transform: rotate(0deg);
  }
}

@keyframes fadeout {
  50% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.l-content-block.is-move {
  animation: fadeout 1s ease-out 0.5s 1 forwards;
}

.l-content-block.is-move-re {
  animation: fadeout 0.5s ease-out 0.5s 1 backwards reverse !important;
}

.l-content-block .is-hide {
  display: none !important;
}

.l-content-block .l-character-info {
  inset: 0;
  position: absolute;
}

.l-content-block .l-character-info .c-character-name {
  left: 50%;
  position: absolute;
  top: 50%;
}

.l-content-block .l-character-info .c-character-img {
  left: 50%;
  position: absolute;
  top: 50%;
}

.l-content-block .l-character-info .c-character-img > img {
  animation: shinta-swing steps(1) 4s forwards infinite;
  transform-origin: center;
}

.l-content-block .l-size-img {
  left: 50%;
  position: absolute;
  top: 50%;
}

@media screen and (max-width: 799px) {
  .l-content-block .l-character-info .c-character-name {
    transform: translate(-43.75vw, -78.13vw);
    width: 46.87vw;
  }

  .l-content-block .l-character-info .c-character-img {
    transform: translate(-40%, -42.19vw);
    width: 68.75vw;
  }

  .l-content-block .l-size-img {
    transform: translate(18.75vw, -68.75vw);
    width: 25vw;
  }
}

@media print, screen and (min-width: 800px) {
  .l-content-block .l-character-info .c-character-name {
    transform: translate(-46.1vw, -23.65vw);
    width: 27.65vw;
  }

  .l-content-block .l-character-info .c-character-img {
    transform: translate(-13.34vw, -23.34vw);
    width: 31.25vw;
  }

  .l-content-block .l-size-img {
    transform: translate(27.81vw, -2.5vw);
    width: 16.66vw;
  }
}
