.pink-content {
    height: 800px;
    width: 100%;
    background-color: pink;
}

.white-content {
    height: 800px;
    width: 100%;
    background-color: #fff;
}

.index-header {
    position: fixed;
    z-index: 100;
    top: 0;
    left: 0;
    width: 100%;
    padding: 22px 2%;
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    background-color: transparent;
    transition: all .1s ease-out;
    opacity: .92;
}

.index-header .index-header-left-wrap {
    margin: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.index-header ul {
    display: flex;
    align-items: center;
    margin-left: 100px;
}

.index-header ul li {
    position: relative;
    font-size: 16px;
    cursor: pointer;
}

.index-header ul li:not(:last-child) {
    margin-right: 50px;
}

.index-header ul li a {
    color: #fff;
    opacity: .8;
}

.index-header ul li:hover a{
    opacity: 1;
}

.index-header ul.index-header-center li {
    position: relative;
}

.index-header ul.index-header-center li a {
    transition: all .1s ease-out;
    position: relative;
}
.index-header ul.index-header-center li:hover  a:after{
    content: '';
    position: absolute;
    display: block;
    width: 100%;
    height: 20px;
}

.index-header ul.index-header-center .solution-more-link dd a:hover, .login-more-link a:hover,
.index-header ul.index-header-right .index-header-arraw a:hover {
    color: #025beb;
}

.index-header ul.index-header-center li.active a{
    opacity: 1;
}

.index-header ul.index-header-center li.active::after, .index-header ul.index-header-center li:hover::after {
    position: absolute;
    left: 0;
    bottom: -10px;
    content: '';
    height: 3px;
    width: 100%;
    background-color: #fff;
}

.index-header ul.index-header-right li {
    display: flex;
    align-items: center;
}

.index-header ul.index-header-right li:not(:last-child){
    margin-right: 30px;
}

.index-header ul.index-header-right li:first-child {
    cursor: text;
}

.index-header ul.index-header-center li:last-child {
    display: none;
}

.index-header ul.index-header-right li.index-header-arraw span {
    background: url(../images/header/slideIn-arraw.png) no-repeat 100% -2px;
    /* background-size: cover; */
    padding-right: 20px;
    transition: all .3s ease-out;
    position: relative;
}

/* .index-header ul.index-header-center .more-link:hover .solution-more-link {
  height: 230px;
  border: 1px solid #e2e2e2;
} */
/*float-wrapper css*/
.float-wrapper{position: fixed; z-index: 99; left: 0;top: 0; width: 100%; height: 68px; background-color:transparent; -o-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; }
.float-nav img{ float: left;height: 34px; margin: 17px 100px 0 24px; transition: all 0.3s ease-out 0s; }
.float-nav ul.nav{ float: left;padding-top: 20px}
.float-nav span{padding-left: 23px; background-image: url("../images/head_tell.png"); background-repeat: no-repeat; background-position: left center; background-size: 17px; color: #ffffff; font-size: 16px; display: inline-block; margin-top: 20px; float: right; margin-right:30px;}
.float-nav ul.nav li{ position: relative; margin-right: 48px; float: left;-o-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s;}
.float-nav ul.nav li:last-child{ margin-right: 0;}
.float-nav ul.nav li a.main-a{ background-color: transparent; display: block;padding-bottom: 10px ;border-bottom: 4px solid transparent; color: #ffffff; font-size: 16px;-webkit-font-smoothing: antialiased;transition: all 0.1s ease-out 0s;}
.float-nav ul.nav li a.main-a:after{content: '';position: absolute;bottom: -10px;display: block;height: 10px;width: 100%;background-color: transparent}
.float-nav ul.nav li a.main-a.active{ background-color: transparent; display: block; border-bottom: 4px solid #ffffff!important;  font-size: 16px;-webkit-font-smoothing: antialiased;transition: all 0.1s ease-out 0s;}
.float-nav ul.nav li a.main-a.jjfa-active{ background-color: transparent;  display: block; line-height: 64px; font-size: 18px;-webkit-font-smoothing: antialiased;transition: all 0.1s ease-out 0s;}
.float-nav ul.nav li a.main-a:hover{border-bottom: 4px solid #ffffff}

.float-nav ul.login-register{ float: right;padding-top: 20px}
.float-nav ul.login-register li{float: left; margin-right: 30px; position: relative;}
/*.float-nav ul.login-register li:last-child{ margin-right: 50px;}*/
.float-nav ul.login-register li a.join-a{background: url("../images/header/slideIn-arraw.png") no-repeat 100% center;padding-right: 18px;  display: inline-block;  border-radius: 4px; color: #fff; font-size: 16px;}
.float-nav ul.login-register li:hover a.join-a{background: url("../images/header/slideOut-arraw.png") 100% center no-repeat}
.float-nav ul.login-register li a:after{position: absolute;content: '';display: block;height: 20px;width: 100%}
.float-nav ul.login-register li:hover .reg_log_drop{display: block}
.float-nav ul.login-register li .reg_log_drop{ display: none; position: absolute; z-index: 4; left: -95%; top: 38px; text-align: center; background-color: #fff;border-top: 1px solid #d0d0d0;border-left: 1px solid #d0d0d0;border-right: 1px solid #d0d0d0;}
.float-nav ul.login-register li .reg_log_drop .same{ text-align: center; width: 90px; height: 43px; line-height: 42px; border-bottom: 1px solid #d0d0d0;}
.float-nav ul.login-register li .reg_log_drop .same a{display: block; color: #333!important; font-size: 14px;}
.float-nav ul.login-register li .reg_log_drop .same a:hover{display: block; color: #025BEB!important; font-size: 14px;}
.float-nav a.app-download{padding-left: 17px; color: #fff; font-size: 16px; display: inline-block; margin-top: 20px; float: right; margin-right: 30px; background-image: url("../images/head_app.png"); background-repeat: no-repeat; background-position: left center; background-size: 12px;}
.float-nav ul.nav li .more-link{overflow:hidden;position: absolute;width:648px;height: 0; z-index: 3; left: 0; top: 42px; background-color: #fff;border-radius: 10px;transition: all 0.1s ease-out;}
.float-nav .more-link{padding: 0 40px;}
.float-nav .more-li .link-block{width: 43%;color: #333333;font-size: 14px;background-color: #ffffff}
.float-nav .more-li .link-block:first-child{float: left;}
.float-nav .more-li .link-block:last-child{float: right;}
.float-nav .more-li .link-block .link-block-title{position: relative;font-weight:bold;padding-left: 30px;font-size: 16px; height: 66px;line-height: 21px;border-bottom: 1px dotted #C3C8CE;padding-top: 27px;margin-bottom: 16px}
.float-nav .more-li .link-block:first-child .link-block-title i{background: url("../images/caidanicon.png") no-repeat }
.float-nav .more-li .link-block:last-child .link-block-title i{background: url("../images/caidanicon.png") no-repeat  -20px 0}
.float-nav .more-li .link-block a{display: block;height: 36px;}
.float-nav .more-li .link-block a:hover{color:#025BEB }
.link-block .link-block-title i{position: absolute;left: 0;width: 20px;height: 20px;display: inline-block;vertical-align: middle;margin-right: 10px;}
.float-nav ul.nav li:hover>div{height: 263px;}
/*media query*/
@media screen and (max-width: 1440px){
    .float-nav ul.nav li{ margin-right: 38px;}
    .float-nav ul.nav li a.main-a.jjfa-active{ font-size: 16px;}
    .float-nav ul.login-register li{margin-right: 20px;}
    .float-nav span{margin-right: 15px; font-size: 16px;}
    .float-nav a.app-download{font-size: 16px;background-size: 10px auto;margin-right:15px; padding-left: 15px;}
}
@media screen and (max-width: 1252px){
    .float-nav>span{display: none}
}
@media screen and (max-width: 1200px){
    .link-wrap-top ul{width: 100%}
    .float-nav ul.nav li{ margin-right: 28px;}
    .float-nav ul.login-register li{margin-right: 20px;}
    .float-nav span{margin-right: 15px; font-size: 16px;}
    .float-nav ul.nav li a.main-a,.float-nav ul.nav li a.main-a.active{font-size: 16px}
}

@media screen and (max-width: 1115px){
    .float-nav img{ height: 30px; margin-top: 20px; margin-left: 18px; margin-right: 20px}
    .float-nav ul.nav li{ margin-right: 23px;}
    .float-nav ul.login-register li{margin-right: 20px;}
    .float-nav span{margin-right: 15px; font-size: 16px;}
}

@media screen and (max-width: 980px){
    .float-nav span.telephone{display: none;}
}
@media screen and (max-width: 950px){
    .float-nav ul.login-register, .float-nav .app-download,.float-nav .telephone{display: none!important;}
    .float-nav ul.nav li a.main-a {font-size: 14px;}
    .float-nav ul.nav{float: right;margin-right: 10px}
    .float-nav ul.nav li .more-link{right: 0;left: auto}
    .float-nav img {width: 97px;height: auto}
    .float-nav ul.nav li{margin-right: 10px}
    .float-nav ul.nav li a.main-a.active{ font-size: 14px;}
}
@media screen and (max-width: 800px){
    .footer-wrap .footer .footer-right{padding-left: 0;}
    .footer-wrap .footer .footer-left{width: 100%;float: none;}
    .footer-wrap .footer .footer-right{float: none;margin: 0 auto}
    .footer-wrap .footer .footer-left{margin-bottom: 30px}
    .float-nav ul.nav li{ position: inherit;}
    .float-nav ul.nav li .more-link{width: 80%;right: 10%;left: inherit}
    .float-nav .more-li .link-block a{    overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
}
@media screen and (max-width: 600px){
    .float-nav ul.nav li a.main-a {font-size: 12px;}
    .float-nav ul.nav li a.main-a.active{ font-size: 12px;}
}
