@charset "utf-8";
@import "/fonts/fonts.css";

.mc-splash{
  position: relative;
  display: inline-block; /* 子要素のサイズに応じて伸縮 */
  margin: 0;  
}

.mc-splash__img {
  position: relative;
  display: block;

  width: 100%; /* 親の幅に合わせる */
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

.mc-splash__text{
  position: absolute;
  display: inline-block;
  
  bottom: 8%;
  right: 8%;

  font-family: var(--font-pixel);
  font-size: calc(2rem + 1vw);
  color: #ffffff;
  text-shadow: 2px 2px 0px #000000;
  /* transform-origin: center; */
  white-space: nowrap;
  
  /* アニメーション */
  animation: splash-pulse 2s ease-in-out infinite;
  /*DEBUG:*/
}

@keyframes splash-pulse {
  0%, 100% {
    transform: rotate(-15deg) scale(1);
    filter: brightness(0.8);
  }
  50% {
    transform: rotate(-15deg) scale(1.2);
    filter: brightness(1.5);
  }
}