.footer-top-external { width: 100%; height: 276px; margin-top: 74px; background-color: #363434; } .footer-top-external .footer-top-container { width: 1280px; height: 276px; margin: 0 auto; overflow: hidden; } .footer-top-external .footer-top-container .footer-top { width: 1200px; height: 216px; margin: 0 auto; padding: 30px 0; color: #ffff; } .footer-top-external .footer-top-container .footer-top .top-left { float: left; width: 180px; } .footer-top-external .footer-top-container .footer-top .top-left :nth-child(1) { font-size: 16px; color: #ffffff; line-height: 40px; font-family: inherit; font-weight: 500; } .footer-top-external .footer-top-container .footer-top .top-left :nth-child(2) { width: 30px; height: 1px; margin-bottom: 10px; border-bottom: 1px solid #838383; } .footer-top-external .footer-top-container .footer-top .top-left a { display: block; width: 60px; color: #a3a3a3; margin-top: 3px; font-size: 14px; line-height: 32px; font-weight: 400; font-family: inherit; text-decoration: none; } .footer-top-external .footer-top-container .footer-top .top-left a:hover { color: #ffffff; } .footer-top-external .footer-top-container .footer-top .top-middle { float: left; width: 585px; } .footer-top-external .footer-top-container .footer-top .top-middle :nth-child(1) { font-size: 16px; color: #ffffff; line-height: 40px; font-family: inherit; font-weight: 500; } .footer-top-external .footer-top-container .footer-top .top-middle :nth-child(2) { width: 30px; height: 1px; margin-bottom: 10px; border-bottom: 1px solid #838383; } .footer-top-external .footer-top-container .footer-top .top-middle :nth-child(3) { color: #a3a3a3; font-size: 14px; line-height: 28px; font-weight: 700; font-family: inherit; } .footer-top-external .footer-top-container .footer-top .top-middle :nth-child(4) { padding-right: 80px; color: #a3a3a3; font-size: 14px; line-height: 28px; font-weight: 400; font-family: inherit; } .footer-top-external .footer-top-container .footer-top .top-middle a { display: block; width: 100px; height: 34px; line-height: 34px; text-align: center; margin-top: 20px; color: #a3a3a3; border: 1px solid #4f4f4f; text-decoration: none; } .footer-top-external .footer-top-container .footer-top .top-middle a:hover { color: #ffffff; } .footer-top-external .footer-top-container .footer-top .top-right { float: left; width: 435px; } .footer-top-external .footer-top-container .footer-top .top-right :nth-child(1) { font-size: 16px; color: #ffffff; line-height: 40px; font-family: inherit; font-weight: 500; } .footer-top-external .footer-top-container .footer-top .top-right :nth-child(2) { width: 30px; height: 1px; margin-bottom: 10px; border-bottom: 1px solid #838383; } .footer-top-external .footer-top-container .footer-top .top-right p { font-size: 14px; line-height: 28px; color: #838383; } .footer-background { background-color: #312f2f; font-family: AlibabaPuHuiTi_2_35_Thin; font-weight: 400; } .footer-background .footer-container { width: 1280px; margin: 0 auto; } .footer-background .footer-container .footer { height: 100px; width: 1200px; margin: 0 auto; line-height: 100px; color: #919191; padding: 0 290px; } .footer-background .footer-container .footer a { color: #919191; text-decoration: none; } .footer-background .footer-container .footer a:hover { color: #ffffff; } .footer-background .footer-container .footer .footer-left { float: left; } .footer-background .footer-container .footer .footer-middle { float: left; } .footer-background .footer-container .footer .footer-right { float: right; } .footer-background .footer-container .footer .footer-right .footer-right-a { text-decoration: none; color: #919191; } .footer-background .footer-container .footer .footer-right .footer-right-a:hover { color: #ffffff; } .footer-background .footer-container .footer .footer-right .footer-right-span { margin: 0 10px; color: #919191; } @media only screen and (max-width: 900px) { .footer-top-external { display: none; } .phone-class { width: 100%; margin: 0 !important; } .footer { height: 0px !important; line-height: 50px !important; padding: 0px!important; } .footer .footer-left, .footer .footer-middle { font-size: 12px!important; text-align: center; background-color: #3c3c3c !important; } .footer .footer-right { display: none!important; } } @media only screen and (max-width: 300px) { .footer { padding: 0px!important; } .footer .footer-left { text-align: center!important; } .footer .footer-left span { margin-left: 8%!important; } .footer .footer-left :nth-child(2) { float: right; margin-right: 30%!important; } }