@media screen and (min-width: 1024px) { .three-nav { width: 100%; min-width: 1200px; background-image: url(../img/group-three-bg.jpg); background-size: 100% 100%; } .three-nav .three-box { width: 1200px; margin: 0 auto; height: 184px; padding: 1px 30px; overflow: hidden; } .three-nav .three-box div { float: left; } .three-nav .three-box div .word1 { font-size: 33px; color: #fff; margin-top: 60px; margin-bottom: 14px; } .three-nav .three-box div .word2 { font-size: 15px; color: #fff; } .three-nav .three-box img { height: 184px; float: right; } .four-nav { width: 100%; min-width: 1200px; } .four-nav .four-box { width: 1200px; margin: 0 auto; height: 73px; } .four-nav .four-box .left-four { float: left; } .four-nav .four-box .left-four img { float: left; margin-top: 29px; margin-right: 15px; } .four-nav .four-box .left-four p { font-size: 16px; color: #8a8a8a; float: left; line-height: 72px; } .four-nav .four-box .left-four span { font-size: 16px; color: #8a8a8a; float: left; margin: 0 6px; line-height: 72px; } .four-nav .four-box .right-four { float: right; } .four-nav .four-box .right-four a { line-height: 71px; font-size: 16px; color: #444; display: block; width: 94px; float: left; border-bottom: 2px solid transparent; text-align: center; } .four-nav .four-box .right-four a:hover { color: #0D306C; border-color: #0D306C; } .four-nav .four-box .right-four .act { color: #0D306C; border-bottom: 2px solid #0D306C; } .five-nav { width: 100%; min-width: 1200px; margin-bottom: 24px; } .five-nav .five-box { width: 1200px; margin: 0 auto; padding: 24px; border: 1px solid #dedede; } .five-nav .five-box .five-one-box { margin-bottom: 20px; } .five-nav .five-box .five-one-box .img-box { float: left; width: 650px; height: 475px; } .five-nav .five-box .five-one-box .img-box .swiper-pagination { bottom: 15px !important; } .five-nav .five-box .five-one-box .img-box .swiper-pagination-bullet { width: 12px; height: 12px; } .five-nav .five-box .five-one-box .five-one-right { background-color: #f5f5f5; width: 500px; height: 475px; padding: 0 34px; padding-top: 70px; float: right; } .five-nav .five-box .five-one-box .five-one-right .word1 { font-size: 22px; color: #00A19C; margin-bottom: 40px; } .five-nav .five-box .five-one-box .five-one-right .word2 { font-size: 15px; color: #525252; text-indent: 30px; line-height: 32px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6; overflow: hidden; margin-bottom: 30px; } .five-nav .five-box .five-one-box .five-one-right a { font-size: 15px; color: #00A19C; padding-right: 20px; background-image: url(../img/lv-sanjiao.jpg); background-position: center right; background-repeat: no-repeat; } .five-nav .five-box .five-two-box .detail { display: block; width: 275px; height: 250px; margin-right: 10px; float: left; } .five-nav .five-box .five-two-box .detail div { width: 275px; height: 210px; margin-bottom: 5px; overflow: hidden; } .five-nav .five-box .five-two-box .detail p { font-size: 16px; color: #525252; text-align: center; line-height: 35px; height: 35px; background-color: #f0f0f0; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; padding: 0 10px; } .five-nav .five-box .five-two-box .detail:nth-last-child(1) { margin-right: 0; } } @media screen and (max-width: 1023px) { .three-nav { width: 100%; background-image: url(../img/group-three-bg.jpg); background-size: 100% 100%; } .three-nav .three-box { height: 1.9rem; padding: 1px .2rem; overflow: hidden; } .three-nav .three-box div { float: left; } .three-nav .three-box div .word1 { font-size: .38rem; color: #fff; margin-top: .5rem; margin-bottom: .1rem; } .three-nav .three-box div .word2 { font-size: .24rem; color: #fff; } .three-nav .three-box img { height: 1.9rem; float: right; } .four-nav { width: 100%; margin-bottom: .24rem; } .four-nav .four-box { width: 100%; } .four-nav .four-box .left-four { height: .56rem; background-color: #eee; } .four-nav .four-box .left-four img { float: left; height: .24rem; margin-top: .16rem; margin-left: .1rem; margin-right: .1rem; } .four-nav .four-box .left-four p { font-size: .24rem; color: #8a8a8a; float: left; line-height: .56rem; } .four-nav .four-box .left-four span { font-size: .24rem; color: #8a8a8a; float: left; margin: 0 .1rem; line-height: .56rem; } .four-nav .four-box .right-four { height: .69rem; } .four-nav .four-box .right-four a { line-height: .67rem; font-size: .24rem; color: #444; display: block; width: 20%; float: left; border-bottom: 2px solid #dedede; text-align: center; } .four-nav .four-box .right-four a:hover { color: #0D306C; border-color: #0D306C; } .four-nav .four-box .right-four .act { color: #0D306C; border-bottom: 2px solid #0D306C; } .five-nav { margin-bottom: .2rem; } .five-nav .five-box { margin: 0 auto; padding: 0 .16rem; } .five-nav .five-box .five-one-box { margin-bottom: .2rem; } .five-nav .five-box .five-one-box img { width: 100%; } .five-nav .five-box .five-one-box .five-one-right { background-color: #f5f5f5; width: 100%; padding: .2rem; } .five-nav .five-box .five-one-box .five-one-right .word1 { font-size: .32rem; color: #00A19C; margin-bottom: .2rem; } .five-nav .five-box .five-one-box .five-one-right .word2 { font-size: .24rem; color: #525252; text-indent: .32rem; line-height: .5rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6; overflow: hidden; } .five-nav .five-box .five-one-box .five-one-right a { font-size: .26rem; color: #00A19C; padding-right: .3rem; background-image: url(../img/lv-sanjiao.jpg); background-position: center right; background-repeat: no-repeat; } .five-nav .five-box .five-two-box .detail { display: block; width: 49%; float: left; margin-bottom: .2rem; } .five-nav .five-box .five-two-box .detail div { height: 2.7rem; margin-bottom: .1rem; overflow: hidden; } .five-nav .five-box .five-two-box .detail div img { width: 100%; min-height: 100%; } .five-nav .five-box .five-two-box .detail p { font-size: .26rem; color: #525252; text-align: center; line-height: .5rem; height: .5rem; background-color: #f0f0f0; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; padding: 0 .1rem; } .five-nav .five-box .five-two-box .detail:nth-child(even) { float: right; } }