.container{background-color: #F7F6F3;}
.common-layer{background:rgba(0,0,0,0.44);position: fixed;top: 0;left: 0;bottom:0;right:0;box-sizing: border-box;width: 100%;z-index: 100;display: none;}

/* 头部 */
#navigation{height: 80px;width: 100%;}
#header{width: 100%;min-width: 1024px;}
.headerNav{position: fixed;height: 80px;position: fixed;left: 0;top: 0;width: 100%;border-bottom: 1px solid #E5E5E5;z-index: 99;box-sizing: border-box;background-color: #fff;}
.sticky-bar{position: absolute;left: 0;bottom: 0;height: 80px;width: 100%;}
.header-container{position: absolute;top: 24px;left: 108px;display: flex;align-items: center;}
.header-container .h-logo{width:79px;height: 32px;line-height: 32px;background: url(/images/common/h_logo.png) no-repeat;background-size: cover;}
.header-container>i{width: 1px;background-color: #646464;height:13px;margin:0 19px;}
.header-container>span{color: #646464;font-size: 16px;}
.nav-middle{position: absolute; left: 50%; transform: translate(-50%, -50%);top: 50%;min-width: 296px;max-width: calc(100vw - 400px - 236px);}
.nav-middle ul{display: flex;align-items: center;}
.nav-middle ul li {margin: 0 10px; cursor: pointer;}
.nav-middle ul li:hover{border-bottom: 4px solid #ffc500;}
.nav-middle ul li a{font-size: 16px;font-weight: 800;}
.nav-middle ul li:nth-child(3)~li{border-bottom: 4px solid #ffc500;}
.h-account{position: absolute;right: 109px;top: 0;height: 100%;display: flex;align-items: center;}
.h-account>a{color: #1B1B1B;font-size: 16px;cursor: pointer;}
.h-account>i{width: 1px;background-color: #646464;height:13px;margin:0 19px;}
.h-account>a:hover{color: #646464;}
.message-icon{background: url(/images/common/msg.png) no-repeat;width: 20px;height: 21px;background-size: cover;position: relative;}
.message-icon>i{padding: 0 5px;height: 16px;color: #fff;font-size: 12px;position: absolute;left: 13px;top: -4px;background-color: #FF214F;font-style: normal;line-height: 16px;border-radius: 10px;}
.account-infor{display: inline-flex;margin-left: 32px;position: relative;height: 100%;align-items: center;}
.account-infor>a{display: inline-flex;align-items: center;height: 100%;}
.account-infor>a>i{background-repeat: no-repeat;width: 32px;height: 32px;background-size: cover;margin-right: 12px;border-radius: 50%;}
.account-infor>a>p{max-width: 112px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;color: #2b2b2b;font-size: 16px;}
.account-infor .account-downlist{position: absolute;background-color: #fff;box-shadow:0px 6px 10px 0px rgba(0,1,1,0.05);top: 90px;display: none;left: 0;border-radius: 5px;}
.account-downlist>p{position: absolute;top: -20px;left: 0;width: 100%;height: 20px;}
.account-downlist>p>em{position: absolute;border: 10px solid;border-color: transparent transparent #fff;top: 0;left: 45%;}
.account-downlist>a{width: 120px;height: 43px;line-height: 43px;display: block;cursor: pointer;color: #646464;font-size: 14px;padding-left: 20px;box-sizing: border-box;}
.account-downlist a:first-of-type{border-radius: 5px 5px 0 0;}
.account-downlist a:last-child{border-radius: 0 0 5px 5px;}
.account-downlist>a>i{margin-right: 10px;color: #646464;}
.account-downlist>a:hover{color: #1B1B1B;background-color: #EDEDED;}
.account-downlist>a:hover i{color: #1B1B1B;}

@media screen and (max-width: 1440px) {
    .nav-middle {
        left: 400px;
        transform: translateY(-50%);
    }
}
/* 底部导航 */
#footer{padding: 59px 50px 54px;background-color: #FBFBFB;overflow: hidden;}
.footer-container{display: flex;max-width: 1500px;justify-content: center;margin: 0 auto;min-width: 1024px;}
.remark-related{padding-right: 80px;width: 600px;flex: none;}
.remark-related .remark-logo{background: url(/images/common/logo.png) no-repeat;background-size: cover;width: 115px;height: 46px;}
.remark-related .remark-title{margin-top: 17px;color: #2B2B2B;font-size: 20px;}
.remark-related .remark-txt{color: #646464;font-size: 14px;line-height: 22px;margin-top: 12px;}
.remark-related .remark-service{margin-top: 23px;}
.remark-related .remark-service>a{font-size: 16px;color: #1B1B1B;margin-right: 39px;}
.remark-related .remark-service>a:hover{color: #646464;}
.remark-related .remark-record{margin-top: 25px;font-size: 12px;color: #646464;line-height: 22px;white-space: nowrap;}
.remark-related .remark-record img{vertical-align: middle;width: 14px;margin-right: 3px;}
.remark-related .remark-record>a{color: #646464;}
.remark-guide{padding: 0 40px;border-left: 1px solid #EDEDED;border-right: 1px solid #EDEDED;width: 95px;flex: none;}
.remark-guide>h3{color: #1B1B1B;font-size: 20px;line-height: 24px;padding-left: 10px;border-left: 2px solid #FFCB00;}
.remark-guide>div{display: flex;flex-direction: column;position: relative;padding-left: 12px;margin-top: 35px;}
.remark-guide>div+div{margin-left: 180px;}
.remark-guide>div>a{color: #1B1B1B;font-size: 16px;margin-bottom: 18px;cursor: pointer;line-height: 24px;}
.remark-guide>div>a:hover{color: #646464;}
.remark-guide .info span{font-size: 16px;letter-spacing: 0.3px;color: #1B1B1B;font-weight: 400;line-height: 24px;}
.remark-guide .info p{font-size: 14px;letter-spacing: 0.3px;color: #646464;font-weight: 400;line-height: 22px;}
.remark-guide .info+.info{margin-top: 18px;}
.contact-us{width: 156px;}
.remark-code{padding-left: 50px;}
.remark-code>h3{color: #1B1B1B;font-size: 20px;line-height: 24px;padding-left: 10px;border-left: 2px solid #FFCB00;}
.remark-code>div{display: flex;text-align: center;margin-top: 40px;padding-left: 12px;}
.remark-code>div>div{margin-right: 19px;}
.remark-code>div img{border: 1px solid #1b1b1b;border-radius: 10px;padding: 9px;max-width: 120px;}
.remark-code>div p{font-size: 14px;color: #1B1B1B;margin-top: 7px;}

/* 公共弹层 */
.error-infor-common{background-color: #FFE6E8;width: 500px;line-height: 60px;color: #2B2B2B;font-size: 14px;box-sizing:border-box;position: fixed;top: 80px;left: 50%;transform: translateX(-50%);border-radius: 10px;text-align: center;display: none;z-index: 200;}

@media screen and (max-width:1500px) {
    .remark-related{width: 420px;padding-right: 30px;}
    .remark-related .remark-service>a{font-size: 16px;margin-right: 32px;}
    .remark-guide{padding: 0 30px;}
    .remark-code{padding-left: 30px;}
}

@media screen and (max-width:1200px) {
    #footer{padding: 25px 20px 50px;}
    .remark-related{width: 340px;padding-right: 30px;}
    .remark-related .remark-service>a{font-size: 14px;margin-right: 25px;}
    .remark-guide{padding: 0 30px;}
    .remark-record{width: 321px;}
    .remark-code{padding-left: 30px;}
}