.station-stop {
    display: flex;
    gap: 5px;
}
.stop-name {
    transform: translateY(-7%);
    z-index: 2;
}
.stop-local {
    font-size: 15px;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    background-color: #202020;
    border-radius: 4px;
    color: #ffffff;
    z-index: 1;
}
.stop-semiexp {
    font-size: 15px;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    background-color: #0080ff;
    border-radius: 4px;
    color: #ffffff;
    z-index: 1;
}

.stop-exp {
    font-size: 15px;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    background-color: #ff8000;
    border-radius: 4px;
    color: #ffffff;
    z-index: 1;
}

.stop-rpd {
    font-size: 15px;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    background-color: #b527ff;
    border-radius: 4px;
    color: #ffffff;
    z-index: 1;
}

.stop-ltd {
    font-size: 15px;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    background-color: #ff0000;
    border-radius: 4px;
    color: #ffffff;
    z-index: 1;
}

.stop-ltd-white {
    font-size: 15px;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 18px;
    height: 18px;
    background-color: transparent; /* ← 背景を透明に */
    border: 1px solid #ff0000; /* ← 赤い縁線だけ表示 */
    border-radius: 4px;
    color: #ff0000; /* ← テキストも赤に揃える */
    z-index: 1;
}