/* slider.css より後に、独立したCSSファイルとして読み込みます。 */
/* 既存の画像・順序・寸法・アニメーションには変更を加えません。 */
.machimobi-slider {
  background: #faf8f1 !important;
  padding: 48px 20px 40px !important;
  color: #17203c;
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif !important;
}
.machimobi-slider .mm-sns-heading {
  max-width: 900px;
  margin: 0 auto 28px;
  text-align: center;
}
.machimobi-slider .mm-sns-kicker {
  margin: 0 0 12px;
  padding: 0;
  color: #936400;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .16em;
}
.machimobi-slider .mm-sns-title {
  margin: 0;
  padding: 0;
  color: #17203c;
  font-family: inherit;
  font-size: 36px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .025em;
  text-align: center;
  overflow-wrap: anywhere;
}
.machimobi-slider .mm-sns-title span {
  background: linear-gradient(transparent 75%, #ffda24 75%);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.machimobi-slider .mm-sns-description {
  margin: 14px 0 0;
  padding: 0;
  color: #4d5362;
  font-size: 14px;
  line-height: 1.9;
  text-align: center;
}
/* スライドのすき間を背景になじませます。動きやサイズは既存のままです。 */
.machimobi-slider .slider-wrapper,
.machimobi-slider .slider-container {
  background: #faf8f1 !important;
}
.machimobi-slider .slider-wrapper { box-shadow: none !important; }
.machimobi-slider .mm-sns-footer {
  margin: 28px 0 0;
  text-align: center;
}
.machimobi-slider .mm-sns-instagram {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  max-width: 100%;
  min-height: 54px;
  margin: 0;
  padding: 14px 28px;
  border: 0;
  border-radius: 100px;
  background: #ffda24;
  color: #17203c;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.6;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  overflow-wrap: anywhere;
}
.machimobi-slider .mm-sns-instagram:hover { background: #f3cb0a; opacity: 1; }
.machimobi-slider .mm-sns-instagram:focus-visible { outline: 3px solid #17203c; outline-offset: 4px; }
.machimobi-slider .mm-sns-handle {
  margin: 12px 0 0;
  padding: 0;
  color: #676657;
  font-size: 12px;
  line-height: 1.7;
  text-align: center;
  overflow-wrap: anywhere;
}
@media (max-width: 767px) {
  .machimobi-slider { padding: 36px 16px 32px !important; }
  .machimobi-slider .mm-sns-title { font-size: 27px; }
  .machimobi-slider .mm-sns-description { font-size: 13px; }
  .machimobi-slider .mm-sns-instagram { gap: 8px; padding: 14px 20px; font-size: 14px; }
}

/* 実際のSNS投稿9枚＋同じ9枚の複製で継ぎ目なく循環。
   以前の6枚/30秒と同じ移動速度で、9枚/45秒に設定。 */
.machimobi-slider .slider-track {
  width: max-content !important;
  gap: 0 !important;
  animation: mm-sns-loop-pc 45s linear infinite !important;
}
@keyframes mm-sns-loop-pc {
  from { transform: translateX(0); }
  to { transform: translateX(-3330px); }
}
@media (max-width: 768px) {
  .machimobi-slider .slider-track {
    animation-name: mm-sns-loop-mobile !important;
  }
}
@keyframes mm-sns-loop-mobile {
  from { transform: translateX(0); }
  to { transform: translateX(-2655px); }
}