#far_menu{
    position: relative;
    width: 100%;
    height: 45px;
    background: #144552;
    top: 40px;
}
.far_menu{
    width: 1170px;
    height: 100%;
    margin: 0 auto;
}
.far_menu>ul{
    width: 100%;
    height: 100%;
}
.far_menu>ul>li{
    float: right;
    height: 100%;
}
.far_menu>ul>li>a{
    margin-left: 30px;
    color: #f1fffa;
    line-height: 45px;
    font-size: 18px;
}
.far_menu>ul>li>a:hover{
    color: #8bbbb9;
}
.far_menu>ul>li>ul{
    position: absolute;
    width: 100%;
    right: 0;
    top: 100%;
    background: #e2ece9;
    z-index: 100;
    display: flex;
    flex-flow: wrap;
    justify-content: space-around;
    border-bottom: 1px solid #8bbbb9;
    box-shadow: 0 0 30px #144552;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
.far_menu>ul>li>ul>li{
    margin: 20px;
}
.far_menu .title{
    margin-top: 20px;
    color: #144552;
    font-size: 18px;
}
.far_menu>ul>li>ul>li>a>img{
    border-radius: 6px;
}
.far_menu>ul>li>ul>li:hover>a>img{
    box-shadow: 2px 2px 15px #144552;
}
.far_menu>ul>li>ul>li:hover>.title{
    color: #8bbbb9;
}
.far_menu>ul>li:hover>ul{
    opacity: 1;
    visibility: visible;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}