.page-footer { background:rgba(249,249,249,1); } .page-footer .icp { max-width: 1160px; margin: 0 auto; border-top: 1px solid rgba(208, 208, 208,0.5); padding-top: 12px; font-size: 12px; color: rgba(102, 102, 102, 1); line-height: 30px; text-align: center; } .page-footer .icp .copyright { padding-right: 8px; margin-right: 6px; border-right: 1px solid rgba(102, 102, 102, 0.45); } .page-footer .icp a { line-height: 30px; font-size: 12px; } .page-footer .icp a:hover { text-decoration: underline; } .page-footer .page-content { padding: 65px 0 112px 0; display: flex; justify-content: space-around; } .page-footer .left-part { display: flex; justify-content: space-between; flex-direction: column; padding-right: 50px; } .page-footer .left-part .logo { height: 35px; margin-bottom: 22px; } .page-footer .left-part .addr { font-size: 14px; color: rgba(102, 102, 102, 1); line-height: 20px; margin-bottom: 16px; } .page-footer .left-part .links a:first-child { margin-right: 10px; padding-right: 10px; border-right: 1px solid rgba(102, 102, 102, 0.45); } .page-footer .left-part .download { display: block; } .page-footer .left-part .download:first-child { margin-bottom: 16px; } .page-footer a { font-size: 14px; color: rgba(102, 102, 102, 1)!important; line-height: 20px; } .page-footer a:hover { color: #0e57a2!important; } .page-footer .right-part { display: flex; } .page-footer .right-part .item { margin-right: 150px; } .page-footer .right-part .nomargin { margin-right: 0px; } .page-footer .right-part .none { display: none; } .page-footer .right-part .item:last-child { margin-right: 0; display: flex; flex-direction: column; align-content: stretch; } .page-footer .right-part .item .title { font-size: 18px; font-weight: 600; color: rgba(51, 51, 51, 1); line-height: 28px; margin-bottom: 28px; } .page-footer .right-part .item .content { font-size: 14px; color: rgba(102, 102, 102, 1); line-height: 20px; } .page-footer .right-part .item .content .label { font-weight: 500; } .page-footer .right-part .item .detail { margin-bottom: 16px; } .page-footer .right-part .item .detail:last-child { margin-bottom: 0; } .page-footer .right-part .contact-us .label { width: auto; display: inline-block; } .page-footer .right-part .contact-us .detail:first-child { color: #0e57a2; } .page-footer .right-part .join-us-container { display: flex; flex-direction: column; justify-content: space-between; height: 100%; } .page-footer .right-part .social-contact { display: flex; justify-content: space-between; } .page-footer .right-part .social-contact div { width: 20px; height: 16px; background-repeat: no-repeat; background-image: ; background-size: 377%; cursor: pointer; } .page-footer .right-part .social-contact div:hover { background-position-y: -16px; } .page-footer .right-part .social-contact .wechat { background-position: -20px 0; position: relative; } .page-footer .right-part .social-contact .wechat:hover:before { content: ""; position: absolute; width: 90px; height: 90px; top: -100px; background-image: ; background-position: center; background-size: contain; background-repeat: no-repeat; left: -40px; } .page-footer .right-part .social-contact .wechat:hover:after { content: ""; position: absolute; top: -10px; width: 0; height: 0; border-style: solid; border-width: 7px 5px 0 5px; border-color: rgba(14, 87, 162, 0.08) transparent transparent transparent; } .page-footer .right-part .links-content .detail { position: relative; } .page-footer .right-part .links-content .detail .label { position: relative; display: inline-block; } @media screen and (min-width:768px){ .page-footer .right-part .links-content .detail .label:hover .popup { display: block; } } .page-footer .right-part .links-content .detail .popup { position: absolute; padding: 4px 12px; background-color: rgba(114, 132, 150, 0.08); color: #0e57a2; font-size: 14px; line-height: 20px; left: 70px; margin-left: 8px; top: -4px; white-space: wrap; min-width: 200px; } .page-footer .right-part .links-content .detail .popup::before { content: ""; position: absolute; left: -5px; top: 10px; width: 0; height: 0; border-style: solid; border-width: 4px 5px 4px 0; border-color: transparent rgba(14, 87, 162, 0.08) transparent transparent; } .page-footer .icon { width: 13px; height: 13px; display: inline-block; margin-left: 8px; background-repeat: no-repeat; background-image: ; background-size: 470%; position: relative; top: 1px; } .page-footer .icon.icon-download { background-position: -33px 0px; } .page-footer .left-part .download:hover .icon.icon-download { background-position-y: -13px; } .page-footer .icon.icon-finger { background-position: -46px 0px; width: 15px; background-size: 405%; } .page-footer .right-part .detail a:hover .icon.icon-finger { background-position-y: -13px; } .mobile-left-part { display: none; } .mobile-social-contact { display: none; } /* 移动端 */ @media screen and (max-width:767px){ .page-footer { width: 100vw; background: #f9f9f9; } .page-footer .page-content { display: flex; flex-direction: column; margin: 0; padding: .45rem 0 0 .3rem; } .page-footer .page-content .mobile-left-part .logo { width: 1.2rem; } .page-footer .page-content .left-part { display: none; } .page-footer .page-content .mobile-left-part { display: block; } .page-footer .right-part .item .detail { margin-bottom: .08rem; line-height: .2rem; } .page-footer .right-part .contact-us .label { font-size: .12rem; font-weight: 400; width: initial; } .page-footer .right-part .item .content .detail .value { font-size: .12rem; font-weight: 400; } .page-footer a { font-size: .12rem; line-height: .17rem; color: #666; } .page-footer .mobile-copyright-container { display: flex; flex-direction: column; justify-content: center; align-items: center; } .page-footer .mobile-copyright-container a, .page-footer .mobile-copyright-container span{ font-size: .1rem; font-family:pingfangsc-regular,pingfang sc; font-weight:400; color:rgba(102,102,102,1); line-height: .16rem; } .mobile-copyright-container .mobile-bottom { width: initial!important; margin: .06rem auto 0; } .page-footer .links a { text-decoration: underline; } .page-footer .page-content .right-part { display: flex; flex-wrap: wrap; justify-content: space-between; padding-right: 0.6rem; } .page-footer .page-content .right-part .title{ padding: .32rem 0 .12rem; line-height: .2rem; font-size: .14rem; color: #333; font-family:pingfangsc-medium,pingfang sc; font-weight: bold; margin: 0; } .page-footer .icp { box-sizing: border-box; width: calc(100vw - 36px); margin: .24rem 18px 0; text-align: left; padding: 0 12px; height: initial; } .page-footer .icp .addr { line-height: .17rem; margin-bottom: .1rem; } .social-contact { display: none!important; } .mobile-social-contact { display: block; padding-top: .19rem; } .mobile-social-contact i { display: inline-block; width: .26rem; height: .26rem; text-align: center; line-height: .26rem; border-radius: 50%; font-size: .18rem; margin-right: .24rem; border: 1px solid #999; } .mobile-social-logo { margin-bottom: .13rem; } .links a:first-child { margin-right: .1rem; padding-right: .1rem; border-right: 1px solid rgba(102, 102, 102, 0.45); } .mobile-copyright-container { padding: .3rem 0 .16rem; } .mobile-copyright { display: flex; height: .11rem; font-size: .08rem; font-family:pingfangsc-regular,pingfang sc; font-weight:400; color: rgba(102,102,102,1); line-height: .11rem; white-space: nowrap; margin: 0 auto; text-align: center; } .page-footer .right-part .item { margin: 0; min-width: 1rem; } .mobile-wechat { background-position: -20px 0; position: relative; } .mobile-wechat:hover:before { content: ""; position: absolute; width: 90px; height: 90px; top: -100px; background-image: ; background-position: center; background-size: contain; background-repeat: no-repeat; left: -40px; } .mobile-wechat:hover:after { content: ""; position: absolute; top: -10px; left: 0; width: 0; height: 0; border-style: solid; border-width: 7px 5px 0 5px; border-color: rgba(14, 87, 162, 0.08) transparent transparent transparent; } .page-footer .right-part .item.pc-hide { margin-top: .32rem; } .page-footer .download i{ font-size: .1rem; margin-left: .08rem; } }