.nav { height: 58px; } .nav .center { width: 1190px; margin: 0 auto; } .logo img{ width: 138.7px; height: 42px; margin-top: 8px; margin-right: 45px; } .menu li { float: left; } .logo .city { margin-right: 50px; } .logo .city i { font-size: 17px; vertical-align: bottom; } .logo .city .city_name { font-size: 12px; color: #333; } .logo .city a { font-size: 12px; margin-left: 10px; color: #32be4a; } .logo .menu {} .logo .menu .active { position: relative; } .logo .menu .active a { color: #32be4a; font-weight: 700; } .logo .menu .active::after { content: ""; position: absolute; width: 23px; height: 3px; background:#32be4a; bottom: 0; left: 50%; transform: translate(-50%); } .logo .menu li { margin-right: 40px; } .logo .menu li a { font-size: 15px; color: #333; font-weight: 400; } .logo .city, .logo .menu{ line-height: 58px; } .r_menu li { float: left; margin-left: 40px; } .r_menu li a { color: #333; line-height: 58px; position: relative; } .r_menu li a span{ font-size: 15px; } .r_menu li a>i { font-size: 20px; vertical-align: middle; } .r_menu li a .icon-zhankai-copy { font-size: 12px; } .r_menu li a:hover .drop_menu { display: block; } .r_menu .drop_menu { padding: 18px 25px; background: #fff; box-shadow: 0 0 10px 0 rgb(0 0 0 / 10%); line-height: 21px; border-radius: 10px; position: absolute; top: 23px; left: 50%; transform: translateX(-50%); text-align: center; display: none; } .r_menu .drop_menu img{ width: 100px; height: 100px; margin-top: 10px; } .r_menu .drop_menu .menu_title{ font-size: 16px; font-weight: 700; } .r_menu .drop_menu .menu_desc{ font-size: 14px; font-weight: 400; }