/* footer */ #footer { width: 100%; height: 3.35rem; background: #222a3e; bottom: 0; left: 0; z-index: 6; color: #FFFFFF; overflow: visible; } .footer-screen-container { background: #222a3e; } .footer-screen-container .footer-nav { display: flex; } .footer-screen-container .footer-nav .nav-left { display: flex; flex: 1; min-width: 0; justify-content: space-between; padding-top: .88rem; padding-right: .77rem; } .footer-screen-container .footer-nav .nav-left .info { display: flex; flex-direction: column; font-size: .16rem; color: rgba(255, 255, 255, 0.4); } .footer-screen-container .footer-nav .nav-left .info a { margin-bottom: .2rem; } .footer-screen-container .footer-nav .nav-left .info span { font-size: .2rem; color: var(--color); font-family: 'DINProMedium'; } .footer-screen-container .footer-nav .nav-left nav ul { display: flex; align-items: center; } .footer-screen-container .footer-nav .nav-left nav ul li { font-size: .16rem; color: rgba(255,255,255,.4); } .footer-screen-container .footer-nav .nav-left nav ul li.spacer { margin: 0 .46rem; } .footer-screen-container .footer-nav .information { display: flex; padding-top: .88rem; padding-left: .34rem; padding-bottom: .5rem; border-left: 1px rgba(255, 255, 255, 0.4) solid; } .footer-screen-container .footer-nav .information .item { display: flex; align-items: center; flex-direction: column; margin-left: .46rem; } .footer-screen-container .footer-nav .information .item img { width: 1.01rem; height: 1.01rem; } .footer-screen-container .footer-nav .information .item .label { margin-top: .15rem; font-size: .16rem; color: rgba(255, 255, 255, 0.4); } .footer-screen-container .copy-right { padding: .1rem 0; border-top: 1px rgba(255, 255, 255, 0.4) solid; font-size: .14rem; color: rgba(255, 255, 255, 0.3); } .footer-screen-container .copy-right .public { display: flex; align-items: center; justify-content: space-between; } .footer-screen-container .copy-right .right .sitemap {margin-right: .2rem;} .footer-screen-container .copy-right .public .right select { background: #222a3e; color: rgba(255, 255, 255, 0.3); border: none; } .footer-screen-container a:hover { color: var(--color); } @media screen and (max-width: 1366px) { #footer { height: 26vh; } .footer-screen-container .footer-nav .nav-left nav ul li.spacer { margin: 0 .2rem; } } @media screen and (max-width: 1024px) { #footer { height: 19vh; } .footer-screen-container .footer-nav .nav-left { padding-right: 0.2rem; } .footer-screen-container .footer-nav .nav-left .info { font-size: 14px; } .footer-screen-container .footer-nav .nav-left .info a { margin-bottom: 10px; } .footer-screen-container .footer-nav .nav-left nav ul li.spacer { margin: 0 .08rem; } .footer-screen-container .footer-nav .nav-left nav ul li { font-size: 14px; } .footer-screen-container .footer-nav .information { padding-left: 0; } } @media screen and (max-width: 860px) { .public { width: 90%; } #footer { height: 16.5vh; } .footer-screen-container .footer-nav .nav-left nav ul li { font-size: 12px; } } @media screen and (max-width: 768px) { #footer { height: auto; } .footer-screen-container .footer-nav { flex-direction: column; } .footer-screen-container .footer-nav .nav-left { flex-direction: column-reverse; } .footer-screen-container .footer-nav .nav-left .info { padding: .4rem .4rem; margin-top: .4rem; border: 1px rgba(255, 255, 255, 0.4) solid; border-radius: .3rem; } .footer-screen-container .footer-nav .nav-left .info a:last-child { margin-bottom: 0; } .footer-screen-container .footer-nav .nav-left nav ul { justify-content: space-between; } .footer-screen-container .footer-nav .nav-left nav ul li.spacer { display: none; } .footer-screen-container .footer-nav .nav-left .info span { font-size: inherit; } .footer-screen-container .footer-nav .information { width: 100%; border: none; margin-left: -.8rem; } .footer-screen-container .footer-nav .information .item { width: calc((100% - .8rem) / 2); margin-left: .8rem; } .footer-screen-container .footer-nav .information .item img { width: 3rem; height: 3rem; } .footer-screen-container .copy-right { padding: .2rem 0 1.38rem; } .footer-screen-container .copy-right .public { flex-direction: column; } .footer-screen-container .copy-right .left { font-size: .28rem; text-align: center; } .footer-screen-container .copy-right .left a { display: block; } .footer-screen-container .copy-right .right { margin-top: .1rem; font-size: .28rem; } .footer-screen-container .footer-nav .information .item .label { margin-top: 0.3rem; font-size: .4rem; } }