/** Shopify CDN: Minification failed

Line 90:0 Expected percentage but found "@keyframes"
Line 106:0 Expected "}" to go with "{"

**/
.slide-text__text {
  width: 100%;
  overflow: hidden;      /* コンテナからはみ出すテキストは表示しない */
}

.slide-text__text p {
  animation: animetxt_left 30s linear infinite;
  transform: translateX(100%);
}

.slide-text__text h1 {
  animation: animetxt_right 30s linear infinite;
  transform: translateX(-100%);
}

.slide-text__text h2 {
  display: inline-block;   /* 横並びにするためにインラインブロック */
  white-space: nowrap;     /* テキスト内で改行しない */
  animation: scroll 120s linear infinite; /* 10秒かけて左へ移動、無限ループ */
}
/* ③ 疑似要素でテキストを複製 */
.slide-text__text:after h2 {
  content: attr(data-text);  /* data-text 属性の内容を複製 */
  padding-left: 2em;         /* 複製部分との隙間（お好みで調整） */
}

.slide-text__text h3 {
  white-space: nowrap;
  animation: marquee 20s linear infinite;
}

.slide-text__text h5 {
  animation: animetxt_left 30s linear infinite;
  transform: translateX(100%);
}

.scrolling-text {
  display: inline-block;
  white-space: nowrap;  /* 改行させず1行にする */
  animation: marquee 20s linear infinite; /* 20秒で1セット分流す */
}

/* ① スクロールの表示エリアとなるコンテナ */
.scroll-container {
  width: 100%;
  overflow: hidden;      /* コンテナからはみ出すテキストは表示しない */
  background: #f0f0f0;    /* （任意）背景色 */
}

/* ② スクロール対象のテキスト要素 */
.scroll-text {
  display: inline-block;   /* 横並びにするためにインラインブロック */
  white-space: nowrap;     /* テキスト内で改行しない */
  animation: scroll 10s linear infinite; /* 10秒かけて左へ移動、無限ループ */
}

/* ③ 疑似要素でテキストを複製 */
.scroll-text:after {
  content: attr(data-text);  /* data-text 属性の内容を複製 */
  padding-left: 2em;         /* 複製部分との隙間（お好みで調整） */
}

/* ④ アニメーションのキーフレーム定義 */
@keyframes scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}

@keyframes animetxt_left2 {
100% {
  transform: translateX(-100%);
 }
}

@keyframes animetxt_left {
  0%  {
    transform: translateX(0);
  }
  100%  {
    /* ここで 50% や 200% にして微調整する場合もあり */
    transform: translateX(-25%);
  }

@keyframes animetxt_right {
100% {
  transform: translateX(+100%);
 }
}

@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    /* テキストが2セット分あるので、1セット分（全体の半分）だけ移動させる */
    transform: translateX(-100%);
  }
}