.top-banner { position: relative; width: 100%; min-width: 1200px; } .top-banner .swiper-container .swiper-slide img { width: 100%; } .top-banner.pc { display: block; } .top-banner.mobile { display: none; } .top-banner .brand-icon { position: absolute; top: 40%; left: calc(50% - 175px); width: 350px; z-index: 11; } .top-banner .mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); z-index: 10; } .hotel-part-one .my-container { display: flex; align-items: center; justify-content: space-between; } .hotel-part-one .my-container .left { padding: 0 40px; } .hotel-part-one .my-container .left img { width: 266px; } .hotel-part-one .my-container .right { padding-left: 50px; border-left: 1px solid rgba(244, 215, 149, 0.4); } .hotel-part-one .my-container .right h2 { margin-bottom: 25px; font-size: 24px; line-height: 32px; color: #B3906A; } .hotel-part-one .my-container .right p { font-size: 18px; line-height: 32px; color: #B3906A; } .hotel-part-two { margin-top: 100px; } .hotel-part-two .my-container .destination-swiper-container { padding-bottom: 70px; } .hotel-part-two .my-container .destination-swiper-container .destination-list { width: 394px; height: 420px; margin-top: 30px; border: 1px solid rgba(255, 255, 255, 0.2); } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-pic { width: 100%; height: 222px; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main { padding: 20px 30px; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-tit { font-size: 22px; font-weight: bold; color: rgba(255, 255, 255, 0.3); line-height: 1; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-desc { margin-top: 10px; font-size: 14px; font-weight: 400; color: rgba(255, 255, 255, 0.3); line-height: 20px; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-buttom { display: flex; align-items: center; justify-content: space-between; margin-top: 25px; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-more { display: flex; justify-content: center; align-items: center; width: 140px; height: 46px; font-size: 16px; font-weight: bold; color: rgba(255, 255, 255, 0.3); border: 1px solid rgba(255, 255, 255, 0.3); } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-address { padding-left: 20px; font-size: 14px; font-weight: 300; color: #999999; line-height: 48px; display: flex; align-items: center; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-address .position-text { margin-left: 5px; font-size: 14px; line-height: 48px; padding-left: 20px; background-image: url(/static/cn/images/hotel/position_icon.png); background-repeat: no-repeat; background-position: left center; background-size: 14px auto; color: rgba(255, 255, 255, 0.3); } .hotel-part-two .my-container .destination-swiper-container .destination-list:hover { background-color: #152B49; box-shadow: 0px 10px 25px 7px rgba(27, 23, 19, 0.2); border: 1px solid rgba(255, 255, 255, 0); } .hotel-part-two .my-container .destination-swiper-container .destination-list:hover .list-main .list-tit { color: #B3906A; } .hotel-part-two .my-container .destination-swiper-container .destination-list:hover .list-main .list-desc { color: #B3906A; } .hotel-part-two .my-container .destination-swiper-container .destination-list:hover .list-main .list-buttom-address .position-text { margin-left: 5px; font-size: 14px; line-height: 48px; color: #B3906A; background-image: url(/static/cn/images/hotel/position_icon_active.png); } .hotel-part-two .my-container .destination-swiper-container .destination-list:hover .list-main .list-buttom-more { display: flex; justify-content: center; align-items: center; width: 140px; height: 46px; font-size: 16px; font-weight: bold; color: #fff; border: 1px solid #B3906A; background-image: url(/static/cn/images/hotel/part2_bgcolor.png); background-repeat: no-repeat; background-position: center; background-size: 110% 110%; } .hotel-part-two .my-container .destination-swiper-container .swiper-pagination-bullet { width: 15px; height: 15px; border: 2px solid #D2D2D2; background-color: transparent; opacity: 0.2; } .hotel-part-two .my-container .destination-swiper-container .swiper-pagination-bullet-active { background: #B98C56; border: none; opacity: 1; } .hotel-part-three { margin-top: 50px; } .hotel-part-three .city-Attractions { display: flex; flex-wrap: wrap; align-items: center; } .hotel-part-three .city-Attractions .Attractions-list { margin-top: 30px; margin-right: 97px; font-size: 16px; font-weight: normal; color: rgba(255, 255, 255, 0.3); line-height: 20px; cursor: pointer; } .hotel-part-three .city-Attractions .Attractions-list:nth-child(10n) { margin-right: 0; } .hotel-part-three .city-Attractions .active { color: #CBA56B; } .hotel-part-three .destination-swiper-container { padding-bottom: 70px; } .hotel-part-three .destination-swiper-container .destination-list { display: block; width: 394px; height: 394px; margin-top: 30px; } .hotel-part-three .destination-swiper-container .destination-list .img-pic-box { width: 100%; height: 222px; overflow: hidden; } .hotel-part-three .destination-swiper-container .destination-list .list-pic { width: 100%; height: 100%; transform: scale(1); transition: transform 0.2s; } .hotel-part-three .destination-swiper-container .destination-list .list-main { padding: 20px 30px; } .hotel-part-three .destination-swiper-container .destination-list .list-main .list-tit { text-align: center; font-size: 22px; font-weight: bold; color: rgba(255, 255, 255, 0.3); line-height: 1; } .hotel-part-three .destination-swiper-container .destination-list .list-main .list-desc { margin-top: 10px; text-align: center; font-size: 14px; font-weight: 400; color: rgba(255, 255, 255, 0.3); line-height: 20px; } .hotel-part-three .destination-swiper-container .destination-list .list-main .list-buttom { display: flex; align-items: center; justify-content: center; margin-top: 25px; } .hotel-part-three .destination-swiper-container .destination-list .list-main .list-buttom .position-text { margin-left: 5px; padding-left: 20px; font-size: 14px; line-height: 48px; color: rgba(255, 255, 255, 0.3); background-image: url(/static/cn/images/hotel/position_icon.png); background-repeat: no-repeat; background-position: left center; background-size: 14px auto; } .hotel-part-three .destination-swiper-container .destination-list:hover { display: block; margin-top: 30px; background-color: #152B49; box-shadow: 0px 10px 25px 7px rgba(27, 23, 19, 0.2); } .hotel-part-three .destination-swiper-container .destination-list:hover .list-pic { transform: scale(1.1); } .hotel-part-three .destination-swiper-container .destination-list:hover .list-main .list-tit { color: #B3906A; } .hotel-part-three .destination-swiper-container .destination-list:hover .list-main .list-desc { color: #B3906A; } .hotel-part-three .destination-swiper-container .destination-list:hover .list-main .list-buttom .position-text { color: #B3906A; background-image: url(/static/cn/images/hotel/position_icon_active.png); background-repeat: no-repeat; background-position: left center; background-size: 14px auto; } .hotel-part-three .destination-swiper-container .swiper-pagination-bullet { width: 15px; height: 15px; border: 2px solid #D2D2D2; background-color: transparent; opacity: 0.2; } .hotel-part-three .destination-swiper-container .swiper-pagination-bullet-active { background: #B98C56; border: none; opacity: 1; } .hotel-part-four { margin-top: 50px; } .hotel-part-four .characteristic-list { display: flex; margin-top: 30px; } .hotel-part-four .characteristic-list li { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 0 15px; width: 252px; height: 236px; background-color: rgba(255, 255, 255, 0.05); } .hotel-part-four .characteristic-list li + li { margin-left: 64px; } .hotel-part-four .characteristic-list li .top-icon { width: 83px; height: 83px; } .hotel-part-four .characteristic-list li h2 { margin-top: 18px; font-weight: bold; font-size: 20px; line-height: 22px; color: #B3906A; } .hotel-part-four .characteristic-list li p { margin-top: 15px; text-align: center; font-size: 14px; line-height: 24px; color: #B3906A; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; } .hotel-part-four .characteristic-list li p + p { margin-top: 0; } .footer { margin-top: 100px; padding-top: 100px; width: 100%; background-color: #05162C; } .footer .content-box { display: flex; justify-content: space-between; } .footer .content-box .left { width: 50%; } .footer .content-box .left .title { font-size: 28px; line-height: 30px; font-weight: bold; color: #B3906A; } .footer .content-box .left .info-group { margin-top: 40px; } .footer .content-box .left .info-group .info-row { width: 100%; display: flex; } .footer .content-box .left .info-group .info-row + .info-row { margin-top: 10px; } .footer .content-box .left .info-group .info-row .info { width: 50%; display: flex; align-items: center; } .footer .content-box .left .info-group .info-row .info h4 { font-size: 16px; line-height: 24px; color: #B3906A; } .footer .content-box .left .info-group .info-row .info h5 { font-size: 16px; line-height: 24px; color: #B3906A; } .footer .content-box .left .info-group .info-row .info a { font-size: 16px; line-height: 24px; color: #B3906A; } .footer .content-box .left .info-group .info-row .info a:hover { text-decoration: underline; } .footer .content-box .left .info-group .info-row .info .gf-icon { display: block; margin-left: 20px; width: 25px; height: 22px; background-repeat: no-repeat; background-position: center center; background-size: 24px auto; cursor: pointer; } .footer .content-box .left .info-group .info-row .info .gf-icon.icon-wx { position: relative; background-image: url(/static/cn/images/hotel/footer_wx_icon.png); } .footer .content-box .left .info-group .info-row .info .gf-icon.icon-wx img { position: absolute; top: 20px; left: -65px; display: none; width: 150px; } .footer .content-box .left .info-group .info-row .info .gf-icon.icon-wx:hover img { display: block; } .footer .content-box .left .info-group .info-row .info .gf-icon.icon-wb { background-image: url(/static/cn/images/hotel/footer_wb_icon.png); } .footer .content-box .left .info-group .info-row .info .gf-icon:hover.icon-wx { background-image: url(/static/cn/images/hotel/footer_wx_icon_white.png); } .footer .content-box .left .info-group .info-row .info .gf-icon:hover.icon-wb { background-image: url(/static/cn/images/hotel/footer_wb_icon_white.png); } .footer .content-box .left .info-group .info-row .info.brand .pc-link { position: relative; display: block; } .footer .content-box .left .info-group .info-row .info.brand .pc-link .df-qr { position: absolute; top: 10px; left: -45px; display: none; width: 150px; } .footer .content-box .left .info-group .info-row .info.brand .pc-link:hover .df-qr { display: block; } .footer .content-box .left .info-group .info-row .info.brand .mobile-link { display: none; } .footer .content-box .left .logo-list { display: flex; flex-wrap: wrap; margin-top: 80px; } .footer .content-box .left .logo-list li { display: flex; align-items: center; justify-content: center; margin-right: 25px; margin-bottom: 20px; width: 80px; height: 40px; } .footer .content-box .left .logo-list li > a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; } .footer .content-box .left .logo-list li img { width: 100%; height: 100%; } .footer .content-box .right { width: 50%; } .footer p { margin-top: 75px; text-align: center; font-size: 14px; line-height: 26px; color: #999; opacity: 0.5; } .part-title { width: 100%; display: flex; align-items: flex-end; padding: 20px auto; } .part-title h2 { font-weight: bold; line-height: 42px; font-size: 38px; color: #B3906A; } .part-title h4 { margin-left: 19px; line-height: 32px; font-size: 26px; color: #B3906A; font-weight: 300; } .part-title .line { position: relative; top: -15px; display: block; margin-left: 20px; flex: 1; height: 1px; background-color: rgba(255, 255, 255, 0.2); } @media only screen and (max-width: 600px) { .top-banner { width: 100%; min-width: 100%; } .top-banner.pc { display: none; } .top-banner.mobile { display: block; } .top-banner .brand-icon { position: absolute; top: 25%; left: calc(50% - 2.5rem); width: 5rem; z-index: 11; } .part-title { width: 100%; display: flex; align-items: flex-end; padding: 20px auto; } .part-title h2 { font-weight: bold; line-height: 0.42rem; font-size: 0.38rem; color: #B3906A; } .part-title h4 { margin-left: 0.19rem; line-height: 0.32rem; font-size: 0.26rem; color: #B3906A; font-weight: 300; } .part-title .line { position: relative; top: -0.1rem; display: block; margin-left: 0.2rem; flex: 1; height: 1px; background-color: rgba(255, 255, 255, 0.2); } .hotel-part-one { width: 100%; } .hotel-part-one .my-container { display: flex; align-items: center; justify-content: center; flex-direction: column; } .hotel-part-one .my-container .left { padding: 0; } .hotel-part-one .my-container .left img { width: 2.66rem; } .hotel-part-one .my-container .right { padding-left: 0px; border-left: 0px solid rgba(244, 215, 149, 0.4); } .hotel-part-one .my-container .right h2 { margin-bottom: 0.33rem; text-align: center; font-size: 0.32rem; line-height: 0.5rem; color: #B3906A; } .hotel-part-one .my-container .right p { text-align: center; font-size: 0.24rem; line-height: 0.4rem; color: #B3906A; opacity: 0.6; } .hotel-part-four { margin-top: 0.5rem; } .hotel-part-four .characteristic-list { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 0.42rem; width: 100%; } .hotel-part-four .characteristic-list li { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; margin-bottom: 0.24rem; width: 48.5%; height: 3.56rem; padding: 0 0.32rem; padding-top: 0.24rem; background-color: rgba(255, 255, 255, 0.05); } .hotel-part-four .characteristic-list li + li { margin-left: 0; } .hotel-part-four .characteristic-list li .top-icon { width: 1.3rem; height: 1.3rem; } .hotel-part-four .characteristic-list li h2 { margin-top: 0.26rem; font-weight: bold; font-size: 0.28rem; line-height: 0.3rem; color: #B3906A; } .hotel-part-four .characteristic-list li p { margin-top: 0.21rem; text-align: center; font-size: 0.24rem; line-height: 0.34rem; color: #B3906A; opacity: 0.5; } .hotel-part-two { margin-top: 0.82rem; } .hotel-part-two .my-container { padding: 0; } .hotel-part-two .my-container .part-title { padding: 0 0.3rem; } .hotel-part-two .my-container .destination-swiper-container { padding-bottom: 0.7rem; padding-left: 0.3rem; } .hotel-part-two .my-container .destination-swiper-container .destination-list { width: 4.92rem; height: 5.4rem; margin-top: 0.38rem; border: 1px solid rgba(255, 255, 255, 0.2); } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-pic { width: 100%; height: unset; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main { padding: 0.29rem 0.39rem; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-tit { font-size: 0.28rem; font-weight: bold; color: rgba(255, 255, 255, 0.3); line-height: 0.3rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-desc { margin-top: 0.1rem; font-size: 0.22rem; font-weight: 400; color: rgba(255, 255, 255, 0.3); line-height: 0.34rem; height: 0.7rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-buttom { display: flex; align-items: center; justify-content: space-between; margin-top: 0.25rem; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-more { display: flex; justify-content: center; align-items: center; width: 1.6rem; height: 0.55rem; font-size: 0.2rem; font-weight: bold; color: rgba(255, 255, 255, 0.3); border: 1px solid rgba(255, 255, 255, 0.3); } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-address { padding-left: 20px; font-size: 14px; font-weight: 300; color: #999999; line-height: 48px; display: none; align-items: center; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-address .position-icon { display: block; width: 14px; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-address .position-icon img { width: 100%; } .hotel-part-two .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-address .position-text { margin-left: 5px; font-size: 14px; line-height: 48px; color: rgba(255, 255, 255, 0.3); } .hotel-part-two .my-container .destination-swiper-container .destination-list:hover { background-color: #152B49; box-shadow: 0px 10px 25px 7px rgba(27, 23, 19, 0.2); } .hotel-part-two .my-container .destination-swiper-container .destination-list:hover .list-main .list-tit { color: #B3906A; } .hotel-part-two .my-container .destination-swiper-container .destination-list:hover .list-main .list-desc { color: #B3906A; } .hotel-part-two .my-container .destination-swiper-container .destination-list:hover .list-main .list-buttom-address .position-icon { display: block; width: 14px; } .hotel-part-two .my-container .destination-swiper-container .destination-list:hover .list-main .list-buttom-address .position-icon img { width: 100%; } .hotel-part-two .my-container .destination-swiper-container .destination-list:hover .list-main .list-buttom-address .position-text { margin-left: 5px; font-size: 14px; line-height: 48px; color: #B3906A; } .hotel-part-two .my-container .destination-swiper-container .destination-list:hover .list-main .list-buttom-more { display: flex; justify-content: center; align-items: center; width: 1.6rem; height: 0.55rem; font-size: 0.2rem; font-weight: bold; color: #fff; border: 1px solid rgba(179, 144, 106, 0); background-image: url(/static/cn/images/hotel/part2_bgcolor.png); background-repeat: no-repeat; background-position: center; background-size: 110% 110%; } .hotel-part-two .my-container .destination-swiper-container .swiper-pagination { bottom: -5px; } .hotel-part-two .my-container .destination-swiper-container .swiper-pagination-bullet { width: 0.18rem; height: 0.18rem; border: 1px solid #D2D2D2; background-color: transparent; opacity: 0.2; } .hotel-part-two .my-container .destination-swiper-container .swiper-pagination-bullet-active { background: #B98C56; border: none; opacity: 1; } .hotel-part-three { margin-top: 0.6rem; } .hotel-part-three .my-container { padding: 0; } .hotel-part-three .part-title { padding: 0 0.3rem; } .hotel-part-three .city-Attractions-box { width: 100%; padding: 0.5rem 0; padding-left: 0.3rem; overflow: scroll; } .hotel-part-three .city-Attractions { display: flex; align-items: center; } .hotel-part-three .city-Attractions .Attractions-list { margin-top: 0; margin-right: 0.83rem; font-size: 0.28rem; font-weight: normal; color: rgba(255, 255, 255, 0.3); line-height: 0.36rem; cursor: pointer; } .hotel-part-three .city-Attractions .Attractions-list:nth-child(10n) { margin-right: 0.83rem; } .hotel-part-three .city-Attractions .active { color: #CBA56B; } .hotel-part-three .destination-swiper-container { padding-bottom: 1rem; padding-left: 0.3rem; } .hotel-part-three .destination-swiper-container .destination-list { display: block; width: 4.92rem; height: 4.6rem; margin-top: 0; } .hotel-part-three .destination-swiper-container .destination-list .img-pic-box { width: 100%; height: auto; overflow: unset; } .hotel-part-three .destination-swiper-container .destination-list .list-pic { width: 100%; height: unset; transform: unset; transition: unset; } .hotel-part-three .destination-swiper-container .destination-list .list-main { padding-top: 0.19rem; padding-bottom: 0.34rem; } .hotel-part-three .destination-swiper-container .destination-list .list-main .list-tit { text-align: center; font-size: 0.32rem; font-weight: bold; color: rgba(255, 255, 255, 0.3); line-height: 0.34rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .hotel-part-three .destination-swiper-container .destination-list .list-main .list-desc { margin-top: 0.1rem; text-align: center; font-size: 0.22rem; font-weight: 400; color: rgba(255, 255, 255, 0.3); line-height: 0.24rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; } .hotel-part-three .destination-swiper-container .destination-list .list-main .list-buttom { display: flex; align-items: center; justify-content: center; margin-top: 0.3rem; } .hotel-part-three .destination-swiper-container .destination-list .list-main .list-buttom .position-text { padding-left: 0.3rem; font-size: 0.24rem; line-height: 0.3rem; color: rgba(255, 255, 255, 0.3); background-image: url(/static/cn/images/hotel/position_icon.png); background-repeat: no-repeat; background-position: left center; background-size: 0.22rem auto; } .hotel-part-three .destination-swiper-container .destination-list:hover { display: block; margin-top: 0; background-color: #152B49; box-shadow: 0px 10px 25px 7px rgba(27, 23, 19, 0.2); } .hotel-part-three .destination-swiper-container .destination-list:hover .list-pic { transform: scale(1); } .hotel-part-three .destination-swiper-container .destination-list:hover .list-main .list-tit { color: #B3906A; } .hotel-part-three .destination-swiper-container .destination-list:hover .list-main .list-desc { color: #B3906A; } .hotel-part-three .destination-swiper-container .destination-list:hover .list-main .list-buttom .position-text { color: #B3906A; background-image: url(/static/cn/images/hotel/position_icon_active.png); background-repeat: no-repeat; background-position: left center; background-size: 0.22rem auto; } .hotel-part-three .destination-swiper-container .swiper-pagination-bullet { width: 0.18rem; height: 0.18rem; border: 1px solid #D2D2D2; background-color: transparent; opacity: 0.2; } .hotel-part-three .destination-swiper-container .swiper-pagination-bullet-active { background: #B98C56; border: none; opacity: 1; } .footer { margin-top: 0.55rem; padding-top: 0.67rem; padding-bottom: 0.62rem; width: 100%; height: auto; background-color: #05162C; } .footer .content-box { display: flex; justify-content: space-between; flex-direction: column; } .footer .content-box .left { width: 100%; } .footer .content-box .left .title { padding: 0 0.12rem; font-size: 0.36rem; line-height: 0.4rem; font-weight: bold; color: #B3906A; } .footer .content-box .left .info-group { margin-top: 0.4rem; padding: 0 0.12rem; } .footer .content-box .left .info-group .info-row { width: 100%; display: flex; flex-direction: column; } .footer .content-box .left .info-group .info-row + .info-row { margin-top: 0; } .footer .content-box .left .info-group .info-row .info { width: 100%; display: flex; align-items: center; margin: 0.1rem 0; } .footer .content-box .left .info-group .info-row .info h4 { font-size: 0.24rem; line-height: 0.36rem; color: #B3906A; } .footer .content-box .left .info-group .info-row .info h5 { font-size: 0.24rem; line-height: 0.36rem; color: #B3906A; } .footer .content-box .left .info-group .info-row .info a { font-size: 0.24rem; line-height: 0.36rem; color: #B3906A; } .footer .content-box .left .info-group .info-row .info a:hover { text-decoration: underline; } .footer .content-box .left .info-group .info-row .info .gf-icon { display: block; margin-left: 0.2rem; width: 0.32rem; height: 0.32rem; background-repeat: no-repeat; background-position: center center; background-size: 0.31rem auto; cursor: pointer; } .footer .content-box .left .info-group .info-row .info .gf-icon.icon-wx img { width: 2.3rem; top: 0.2rem; left: -1rem; } .footer .content-box .left .info-group .info-row .info.brand .pc-link { position: relative; display: none; } .footer .content-box .left .info-group .info-row .info.brand .pc-link .df-qr { position: absolute; top: 10px; left: -45px; display: none; width: 150px; } .footer .content-box .left .info-group .info-row .info.brand .pc-link:hover .df-qr { display: block; } .footer .content-box .left .info-group .info-row .info.brand .mobile-link { display: block; } .footer .content-box .left .logo-list { display: flex; flex-wrap: wrap; margin-top: 0.5rem; max-height: 2.69rem; overflow: hidden; } .footer .content-box .left .logo-list li { display: flex; align-items: center; justify-content: center; margin-right: 0.26rem; margin-bottom: 0.3rem; width: 20%; } .footer .content-box .left .logo-list li > a { height: auto; } .footer .content-box .left .logo-list li img { width: 100%; } .footer .content-box .right { width: 100%; margin-top: 0.5rem; } .footer .content-box .right img { width: 100%; } .footer p { margin-top: 0.66rem; text-align: center; font-size: 0.2rem; line-height: 0.26rem; color: #999; opacity: 0.5; } }