.ul-list {
    display: flex;
}

    .ul-list > li {
        flex: 1;
        border-right: 1px solid #3cabfc;
        position: relative;
    }

        .ul-list > li:last-child {
            border-right: none;
        }

        .ul-list > li > a {
            text-align: center;
            height: 35px;
            display: flex;
            align-items: center;
            justify-content: center;
            text-decoration: none;
            color: #fff;
            background: #4fa0db;
        }

            .ul-list > li > a:hover {
                background: #3cabfc;
            }

        .ul-list > li > span {
            color: #fff;
            height: 35px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: #4fa0db;
        }

        .ul-list > li:hover .ol-list {
            display: block;
        }

.ol-list {
    display: none;
    position: absolute;
    top: 35px;
    left: 0;
    z-index: 999;
    background: #4fa0db;
    width: 100%;
}
    .ol-list li {
        display: inline;
    }
    .ol-list > li > a {
        text-align: center;
        text-decoration: none;
        color: #fff;
        height: 35px;
        display: flex;
        align-items: center;
        border-bottom: 1px solid #3cabfc;
        justify-content: center;
        width: 100% !important;
    }

        .ol-list > li > a:hover {
            background: #3cabfc;
        }