body {
    font-family: 'Noto Sans JP', sans-serif;
}

.text-shadow {
    text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.1);
}

.text-stroke-white {
    -webkit-text-stroke: 4px white;
    paint-order: stroke fill;
}

.text-stroke-black {
    -webkit-text-stroke: 1px black;
}

/* Custom Colors based on the image */
.bg-brand-yellow {
    background-color: #FCDE55;
}

.bg-brand-red {
    background-color: #E31C24;
}

.bg-brand-black {
    background-color: #1A1A1A;
}

.bg-brand-beige {
    background-color: #F2F2EB;
}

.bg-brand-blue {
    background-color: #D6F6FA;
}

.text-brand-red {
    color: #E31C24;
}

.triangle-down {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #E31C24;
    margin: 0 auto;
}

/* Tab Animation */
.store-card {
    transition: all 0.3s ease-in-out;
}

.store-card.hidden-card {
    display: none;
}

.store-card2 {
    transition: all 0.3s ease-in-out;
}

.store-card2.hidden-card {
    display: none;
}

.fade-in {
    animation: fadeIn 0.5s;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 無限スライドのためのカスタムアニメーション */
@keyframes scroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

.animate-scroll {
    display: flex;
    width: max-content;
    animation: scroll 40s linear infinite;
}

/* ホバー時に一時停止するオプション（必要に応じて） */
.slider-container:hover .animate-scroll {
    animation-play-state: paused;
}