.slider.tree .list > div {
    padding: 0px;
    display: flex;
    line-height: 50px;
}

    .slider.tree .list > div * {
        width: 50px;
        height: 50px;
        text-align: center;
        cursor: pointer;
    }

    .slider.tree .list > div .text {
        flex: 1;
        text-align: left;
        padding-left: 5px;
        padding-right: 5px;
        position: relative;
    }

        .slider.tree .list > div .text.selected:before {
            position: absolute;
            content: "\f00c";
            font-family: FontAwesome;
            color: #fff;
            display: block;
            background-color: #f00;
            width: 20px;
            height: 20px;
            text-align: center;
            line-height: 20px;
            border-radius: 50%;
            margin-left: -25px;
            margin-top: 15px;
        }

    /*.slider.tree .list > div .upper {
        border-right: 1px solid #eaeaea;
    }*/
    .slider.tree .list > div .upper::after {
        content: "\f053";
        font-family: FontAwesome;
    }

    /*.slider.tree .list > div .sub {
        border-left: 1px solid #eaeaea;
    }*/

    .slider.tree .list > div .sub::after {
        content: "\f054";
        font-family: FontAwesome;
    }

    .slider.tree .list > div .upper:hover,
    .slider.tree .list > div .sub:hover {
        background-color: #eaeaea
    }