.sms-case {
    padding-top: 30px;
}

.case-title {
    font-size: 18px;
    font-weight: 600;
    color: #1A1A1A;
    line-height: 25px;
    letter-spacing: 1px;
    text-align: center;
    margin-bottom: 17px;

}

.case-description {
    font-size: 14px;
    font-weight: 400;
    color: #666666;
    line-height: 20px;
    text-align: center;
    margin-bottom: 35px;
}

.case-card-list {
    width: 1585px; /* 317 * 5 */
    display: flex;
    margin: 0 auto;
    transform: translateX(calc((317px - (100vw - 317px) / 2) * -1));
    transition: transform .5s;
}

.case-card {
    width: 315px;
    padding: 22px 20px;
    background: #FFFFFF;
    box-shadow: 0px 0px 4px 0px rgba(0, 145, 255, 0.15);
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    align-items: center;
    opacity: .5;
    margin: 0 6px;
    transform: scale(0.9333);
    transition: transform .5s, opacity .5s;
    flex-grow: 0;
    justify-content: center;
}

.case-card.active {
    opacity: 1;
    transform: scale(1);
}

.case-card-logo {
    height: 49px;
    margin-bottom: 15px;
}

.case-card-logo img {
    height: 100%;
}

.case-card-word {
    font-size: 13px;
    font-weight: 400;
    color: #1A1A1A;
    line-height: 20px;
    margin-bottom: 19px;
    text-align: center;
}

.case-card-symbol {
    width: 19px;
    height: 3px;
    background: #0091FF;
    border-radius: 2px;
    margin-bottom: 13px;
}

.case-card-name{
    font-size: 14px;
    font-weight: 500;
    color: #1A1A1A;
    line-height: 20px;
    margin-bottom: 2px;
}

.case-card-role{
    font-size: 11px;
    font-weight: 400;
    color: #1A1A1A;
    line-height: 16px;
}