.nav{color: #999;background: #f5f5f5;height: 36px;line-height: 36px;}
.nav a{color: #999;}
.divider{margin: 0 24px;height: 8px;line-height: 8px;width:	1px;background-color: #ddd;display: inline-block;}
a.nav-text{transition: color .3s;text-decoration: none;box-sizing: border-box;cursor: pointer;display: inline-block;}
a.nav-text:hover,.user-name:hover span{color:#3385ff}
a.nav-text:active{color:#0c65eb}
a.nav-text.active{color: #1a7af8;font-weight: 700;}
a.nav-text .num{color: #f61a6a;margin: 4px;}
span.iconfont.location{font-size:12px;}
.user-name{position: relative;vertical-align: top;padding-left: 24px;}
.user-name .avatar{z-index:1;position: absolute;top:9px;left:0px;height: 20px;border-radius: 10px;}
.user-name .ripple{position: absolute;top:9px;left:0px;border-radius:10px;width:20px;height:20px;opacity:1;transition:all .3s ease-out;background-color: rgba(255,255,255,1)}
@keyframes rip { 0% { transform: scale(1,1);opacity:0; }1% { transform: scale(1,1);opacity:1; }25% { transform: scale(2,2);opacity:.8; }50% { transform: scale(3,3);opacity:.5; }90% { transform: scale(4,4);opacity:0; }100% { transform: scale(0,0);opacity:0; } }
@keyframes move-x { 0% { background-position-x:0px }80% { background-position-x:-40px }95% { background-position-x:-43px }100% { background-position-x:-45px }}
.user-name:hover .ripple{animation: rip .3s}
.user-name:hover .rotate-90, .drop-down:hover .rotate-90{transform:rotate(270deg);-ms-transform:rotate(270deg);-moz-transform:rotate(270deg);-webkit-transform:rotate(270deg);-o-transform:rotate(270deg);}
.user-name:hover span, .drop-down:hover span, .drop-down:hover .text-cont, .nav-search-btn:hover span, .close-btn:hover span{color:#0c65eb;}
.user-name:hover .user-menu{transition: opacity .3s;opacity: 1;transform: translate(-50%,100%) scaleY(1);}
.user-menu{border-radius:5px;overflow:hidden;box-sizing: border-box;width: 360px;position: absolute;background: #fff;z-index: 200;left: 50%;bottom: 2px;transform: translate(-50%,-100%) scaleY(0);opacity: 0;box-shadow: 0 2px 24px 0 rgba(0,0,0,.08);user-select: none;cursor: default;font-size: 14px;}
.user-name .menu-arrow{display: none;user-select: none;box-sizing: border-box;position: absolute;top: 20px;left: 50%;transform: translate(-50%);z-index: 11;width: 0;height: 0;border: 0 dashed transparent;border-bottom-style: solid;border-bottom-color: #fff;border-width: 8px;}
.user-name:hover .menu-arrow{display: block;}
.user-menu .menu-bg{position:absolute;width: 400px;height: 400px;top:-120px;left: -20px;opacity: 0;z-index: 0;}
.user-menu .info-outer{position:relative;background-image: linear-gradient( 135deg, #81FFEF 10%, #F067B4 100%);height: 135px;}
.user-menu .info-outer .info{position: relative;width: 220px;overflow: hidden;margin-top: 38px;text-shadow: 0 1px 1px rgba(0,0,0,.3);color: #fff;}
.user-menu .info-outer .info .name{font-size: 20px;font-weight:400;line-height:30px;max-width: 170px;}
.user-menu .info-outer .info .tag-certificate{border-radius:2px;height:20px;padding: 0 6px;font-size:12px;line-height:20px;margin-top: 5px;}
.user-menu .info-outer .info .level-outer{display: flex;justify-content:space-between;margin-bottom:5px;}
.user-menu .info-outer .info .exp{font-size: 14px;font-weight:300;line-height:20px;}
.user-menu .info-outer .info .exp .num{font-size: 14px;color:#0c65eb}
.user-menu .info-outer .info .exp-bar-outer{background:#f9f9f9;height:2px;width:100%;overflow: hidden;}
.user-menu .info-outer .info .exp-bar{background:#f61a6a;height:2px;width:100%;}
.user-menu .info-outer .avatar{position: relative;margin: 25px 15px 25px 25px;width: 70px;height: 70px;overflow: hidden;border: 2px solid #fff;border-radius: 10px;}
.user-menu .info-outer .avatar-image{width:70px;}
.user-menu .menu-outer{background-color: #fff;height: 120px;display: flex;justify-content: space-between;}
.user-menu .menu-outer .menu-item{height:120px;width:50%;transition: all .3s;}
.user-menu .menu-outer .menu-item:not(:last-child){border-right:1px solid #f2f2f2;}
.user-menu .menu-outer .menu-item:hover{background-color: #f9f9f9}
.user-menu .menu-outer .menu-item{display: flex;flex-direction:column;justify-content: center;line-height:30px;text-align: center;}
.user-menu .menu-outer .menu-text{color:#999 !important;font-size:16px;}
.user-menu .menu-outer .menu-text.iconfont{font-size:24px;}
.user-menu .user-menu-footer{border-top:1px solid #f2f2f2;transition: all .3s;cursor:pointer;line-height: 44px;font-size:16px;text-align: center;color:#0c65eb;background-color:#f9f9f9;}
.user-menu .user-menu-footer:hover {color:#fff;background-color:#ef5640;}
.nav-row {height:78px;line-height:78px;background-color:#fff;
    color:#666;/*box-shadow:0 16px 32px 0 hsla(0,0%,60%,.08)*/;}
.nav-left{display: flex;}
.nav-left .logo-link{height: 78px;display: flex;justify-content: center;align-items: center;}
.nav-left .logo{height:38px;width:124px;margin-right:10px;/*background-image:url(../../images/site/logo.png)*/}
.main-nav{display: flex;position:relative;}
.main-nav .nav-list{line-height: 78px;box-sizing: border-box;display: flex;margin: 0 11px 0 16px;opacity: 1;transition: opacity .3s;}
.main-nav .text-cont, .main-nav .iconfont{font-size: 16px;color:#666;}
.main-nav .text-cont:hover{color:#0c65eb}
.main-nav .text-cont.rotate-90{line-height:16px;margin-top:30px;}
.main-nav .drop-down{position: relative;margin-right: 28px;}
.main-nav .drop-down:hover .panel-subs .sub-row{height:48px;opacity:1;overflow:visible;transition:opacity .3s,height .3s}
.main-nav .panel-subs{position: absolute;z-index: 200;left: 50%;bottom: 1px;width: 136px;transform: translate(-50%,100%) translate(-8px);box-shadow: 0 16px 32px 0 hsla(0,0%,60%,.08);}
.main-nav .panel-subs .sub-row{text-align: center;background: #fff;height: 0;opacity: 0;overflow: hidden;position: relative;}
.main-nav .panel-subs .sub-row:hover{background-color:#f9f9f9;}
.main-nav .panel-subs .sub-row .text-cont{position: relative;}
.main-nav .panel-subs .sub-row .text-cont:hover{color:#0c65eb}
.main-nav .panel-subs .sub-row .text-cont, .main-nav .panel-subs .sub-row .text{text-align: center;font-size: 14px;color:#666;line-height: 48px;display: block;}
.main-nav .panel-subs .sub-row .text-cont .nav-tag{font-size: 18px;text-align: center;position: absolute;display: block;padding: 0 10px;border-radius: 8px;border-bottom-left-radius: 0;top: 18px;right: 35px;z-index: 1;transform-origin: bottom left;transform: translate(100%,-100%) translateZ(0) scale(.4);height: 32px;line-height: 32px;color: #FFFFFF;background-color: #F61A6A;}
.main-nav .nav-search-btn{line-height: 78px; box-sizing: border-box;  padding: 0 16px; font-size: 16px; z-index: 1;cursor: pointer;color: #666;display: flex;justify-content: center;align-items: center;}
.main-nav .nav-search-cont{opacity:0;visibility:hidden;display:flex;justify-content:flex-start;line-height: 78px;color: #666;position: absolute;width: 100%;height: 78px;background: #fff;padding: 0 39px 0 0px;}
.main-nav .nav-search-cont .drop-down{width:80px;font-size:16px;text-align:center;cursor:pointer;color:#666}
.main-nav.search-stat .nav-search-cont{opacity:1;visibility:visible;transition:opacity .3s}
.main-nav .nav-search-cont .input-cont{width:70%;}
.main-nav .nav-search-cont .input-cont input{border:none;outline:none;padding:none;width:100%;font-size:14px;height:78px}
.main-nav .nav-search-cont .close-btn{position:absolute;right:0px;top:0px;font-size:16px;cursor:pointer;color:#666}
.main-nav .nav-search-cont .close-btn:hover{color:#3385ff}
.nav-btns{display:flex;align-items:center;height:78px}
.nav-btns a:not(:last-child){margin-right:8px;}
.btn-line{transition:all .3s;border-radius:17px;text-align:center;height:34px;line-height:34px;padding:0 16px;font-size:14px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-block;vertical-align:middle;color:#1a7af8;border:1px solid #1a7af8}
.btn-line:hover{color:#3385ff;border-color:#3385ff;background-color:#f7faff}
.btn-line:active{color:#0c65eb;border-color:#0c65eb;background-color:#f0f6ff}
.btn-fill{transition:all .3s;border-radius:17px;text-align:center;height:34px;line-height:34px;padding:0 16px;font-size:14px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-block;vertical-align:middle;background-color:#1a7af8;color:#fff}
.btn-fill:hover{color:#fff;background-color:#3385ff}
.btn-fill:active{color:#fff;background-color:#0c65eb}
.login-reg-modal{z-index:300;position:fixed;width:100%;height:100%;left:0;top:0;background:rgba(0,0,0,.7);display:-webkit-box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;-moz-align-items:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;-moz-justify-content:center;justify-content:center;overflow:auto}
.modal-box{/*animation: move-x 50s;*/animation-fill-mode:forwards;width:820px;height:540px;position:relative;border-radius:6px;overflow:hidden;background-image:url(../../images/site/login-reg-bg.png);background-size: contain;background-position-x: left}
.modal-box .modal-main{position:relative;padding:44px 70px 50px 70px;box-sizing:border-box;background:#fff;height:100%;margin-left:300px;}
.modal-box .modal-main .login-reg-tab{text-align:center;margin-bottom:40px;position:relative}
.modal-box .modal-main .login-reg-tab .tab-item{font-size:28px;display:inline-block;margin:0 20px;color:#666;line-height:44px;cursor:pointer;font-weight:700;user-select:none;-webkit-user-select:none;-ms-user-select:none;-moz-user-select:none}
.modal-box .modal-main .login-reg-tab .tab-item.active,.modal-box .modal-main .login-reg-tab .tab-item:hover{color:#3e82f7}
.modal-box .modal-main .login-reg-tab .tab-bar{position:absolute;bottom:0;height:2px;background:#3e82f7}
.modal-box .modal-main .login-reg-tab .tab-bar.moving{transition:left .3s,width .3s;width: 56px;}
.modal-box .modal-main .login-reg-close{position:absolute;color:#ccc;top:15px;right:15px;line-height:20px;padding:5px;cursor:pointer}
.modal-box .modal-main .login-reg-close .iconfont{font-size:20px;}
.modal-box .modal-main .login-reg-close:hover{color:#999}
.modal-box .modal-main .login-cont-outer{height:170px;}
.modal-box .modal-main .input-outer{position:relative;margin-top:15px;}
.modal-box .modal-main .input-outer input{width:100%;box-sizing:border-box;height:46px;line-height:46px;padding:0 15px;font-size:16px;border:1px solid #ddd;border-radius:2px;transition:border .3s}
.modal-box .modal-main .input-outer input::placeholder{color:#aaa;}
.modal-box .modal-main .input-outer input:focus{border-color:#3e82f7}
.modal-box .modal-main .input-outer .btn-msg{position:absolute;height:44px;line-height:44px;text-align:center;width:120px;font-size:14px;color:#fff;background:#ccc;right:0;cursor:not-allowed;border:1px solid #ccc;transition: all .3s;border-radius: 0 3px 3px 0;top:0;}
.modal-box .modal-main .input-outer .btn-msg.active{color:#3e82f7;background-color:rgba(0,0,0,0);border-color:#3e82f7;cursor:pointer;}
.modal-box .modal-main .input-outer .btn-msg.active:hover{color:#3385ff;background-color:#f7faff;}
.modal-box .modal-main .btn-primary{margin-top:25px;width:100%;box-sizing:border-box;height:46px;line-height:46px;font-size:16px;border-radius:3px;color:#fff;background:#3e82f7;text-align:center;cursor:pointer}
.modal-box .modal-main .btn-primary:hover{background:#3b78e7;}
.modal-box .modal-main .qrcode{background-size: contain;background-position: center;background-repeat: no-repeat;margin:auto;width:200px;height:200px;}
.modal-box .modal-main .hint{color:#999;font-size:16px;text-align: center;width:100%;margin-top:10px;}
.modal-box .modal-main .btn-cont-outer{position:relative;height:46px;width:100%;text-align:center;margin-top:150px;}
.modal-box .modal-main .btn-cont-divider{border-top:1px solid #ddd;position:absolute;top:22px;left:0;width:100%}
.modal-box .modal-main .btn-cont-list{display:inline-block;z-index:10;position:relative;background:#fff;padding:0 9px}
.modal-box .modal-main .btn-cont-list span.iconfont{display:inline-block;font-size:24px;line-height:24px;width:24px;height:24px;vertical-align:top;padding:11px;cursor:pointer;color:#999;transition: color .3s;}
.modal-box .modal-main .btn-cont-list span.iconfont:hover{color:#3e82f7}
.modal-box .modal-main .btn-cont-list span.iconfont.active{color:#3b78e7}
.modal-box .close-btn{position:absolute;color:#ccc;top:15px;right:15px;font-size:20px;line-height:20px;padding:5px;cursor:pointer}
.modal-box .close-btn:hover{color:#999}
#bind-tel-msg .tips{font-size:12px;color:#888888;margin:10px 0;}
#clear-keyword{border-radius: 10px;padding: 1px 5px;cursor: pointer;margin-left: 10px;background-color: white;}
#clear-keyword:hover{color:#3b78e7}