page { background: #f7f7f7; height: auto; } /* 列表 */ /* .dept-list { display: grid; grid-template-columns: 1fr; place-items: center; gap: 24rpx 0; width: 690rpx; padding: 20rpx 0; margin: 0rpx auto; position: relative; z-index: 999; } */ /* 轮播图start */ .altitle { position: absolute; width: 100%; height: 66rpx; background-color: black; margin-top: 237rpx; border-bottom-right-radius: 16rpx; border-bottom-left-radius: 16rpx; opacity: 0.5; font-size: 22rpx; font-weight: 500; color: rgba(255, 255, 255, 1); } .altitle-name { margin: 10rpx 20rpx; } .container { width: 100vw; } .page-body { padding-top: 30rpx; background: #fff; height: 350rpx; } .page-section { width: 100%; margin-bottom: 60rpx; } .page-section_center { display: flex; flex-direction: column; align-items: center; } .page-section:last-child { margin-bottom: 0; } .page-section-gap { box-sizing: border-box; padding: 0 30rpx; } .page-section-spacing { box-sizing: border-box; /* padding: 0 20rpx; */ height: 350rpx; background-color: #fff; } .page-section-title { font-size: 28rpx; color: #999; margin-bottom: 10rpx; padding-left: 30rpx; padding-right: 30rpx; } .page-section-gap .page-section-title { padding-left: 0; padding-right: 0; } .swiper-item { display: block; height: 350rpx; } .banner { overflow: hidden; height: 350rpx; display: flex; width: 100%; margin: 0 auto; background-color: #FFF; padding: 44rpx 0; } .banner-item { overflow: hidden; height: 350rpx; display: flex; width: 100%; border-radius: 16rpx; margin-bottom: 8rpx; } .dots { display: flex; justify-content: center; margin-top: -16rpx; z-index: 999; position: relative; } .dots .dot { width: 8rpx; height: 8rpx; border-radius: 8rpx; margin-left: 10rpx; background: #d2d5da; transition: all 0.3s; } .dots .dot.active { width: 24rpx; background: #fff; } .page-section-title { margin-top: 60rpx; position: relative; } swiper { width: 710rpx; height: 350rpx; margin: 0 auto; box-shadow: 0px 4px 29px 0px rgba(63, 63, 63, 0.1); border-radius: 16rpx; overflow: hidden; -webkit-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); } .video-title { width: 100%; height: 50rpx; line-height: 50rpx; padding-left: 40rpx; color: white; background: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0)); background: -webkit-linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0)); position: absolute; top: 0; } /* 轮播图end */ /* type-1 start */ .type-1 .list-li:first-child { margin-top: 27rpx; } .type-1 .list-li { width: 100%; background: #fff; padding: 38rpx 30rpx; margin-top: 16rpx; box-sizing: border-box; } .type-1 .list-li .item-name { width: 100%; font-size: 34rpx; font-weight: 500; color: rgba(51, 51, 51, 1); line-height: 52rpx; } .type-1 .list-li .item-info { width: calc(100% - 60rpx); height: 28rpx; margin-top: 30rpx; display: flex; align-items: center; } .type-1 .list-li .item-info image { width: 28rpx; height: 28rpx; } .type-1 .list-li .item-info .street { margin-left: 11rpx; font-size: 24rpx; font-weight: 500; color: rgba(153, 153, 153, 1); } .type-1 .list-li .item-info .time { margin-left: 22rpx; font-size: 24rpx; font-weight: 500; color: rgba(153, 153, 153, 1); } /* type-1 end */ /* type-2 start */ .type-2 { width: 690rpx; margin: 40rpx auto; } .type-2 .list-item { width: 100%; height: 160rpx; background: #fff; display: flex; justify-content: space-between; align-items: center; border-radius: 14rpx; margin-top: 12rpx; } .type-2 .list-item .list-name { font-size:32rpx; font-family:PingFang SC; font-weight:bold; color:rgba(51,51,51,1); margin-left: 42rpx; display: flex; align-items: center; } .type-2 .list-item .list-arrow { width: 16rpx; height: 26rpx; margin-right: 42rpx; } .type-2 .list-item .list-name .list-icon { width: 106rpx; height: 106rpx; margin-right: 14rpx; } /* type-2 end */ /* type-3 start */ .type-3 .list-item { width: 100%; padding: 40rpx 28rpx; margin-top: 16rpx; background: #fff; box-sizing: border-box; } .type-3 .list-item .name { /* width: calc(100% - 56rpx); */ font-size: 34rpx; font-weight: 500; color: rgba(51, 51, 51, 1); line-height: 50rpx; } .type-3 .list-item .info { /* margin-top: 15rpx; width: calc(100% - 56rpx); font-size: 28rpx; font-weight: 500; color: rgba(153, 153, 153, 1); line-height: 44rpx; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; */ margin-top: 15rpx; /* width: calc(100% - 56rpx); */ /* height: 75rpx; */ font-size: 28rpx; font-family: PingFang SC; font-weight: 500; color: rgba(153, 153, 153, 1); } .type-3 .list-item .info rich-text { /* width:100%; */ line-height: 44rpx; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; white-space: normal !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .type-3 .list-item .info text { line-height: 46rpx; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 30rpx; } /* type-3 end */ /* type-5 start */ .type-5 .list-all { width: 100%; background-color: #fff; } .type-5 .list-all .list-item { border-bottom: 1rpx solid #eaeaea; margin-top: 16rpx; padding: 40rpx 18rpx 30rpx 16rpx; display: flex; } .type-5 .list-all .list-item:first-child { border-top: 1rpx solid #eaeaea; } .type-5 .list-all .list-item:last-child { border-bottom: none; } .type-5 .list-all .list-item .item-info { width: calc(100% - 220rpx); height: 146rpx; position: relative; } .type-5 .list-all .list-item .item-info .item-info-name { width: calc(100% - 47rpx); font-size: 32rpx; font-weight: 500; color: rgba(63, 63, 63, 1); line-height: 50rpx; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 0 auto; } .type-5 .list-all .list-item .item-info .item-info-time { width: calc(100% - 47rpx); height: 22rpx; position: absolute; bottom: 5rpx; display: flex; flex-direction: row; justify-content: space-between; left: 22rpx; } .type-5 .list-all .list-item .item-info .item-info-time text { font-size: 22rpx; font-weight: 500; color: rgba(170, 170, 170, 1); line-height: 22rpx; } .type-5 .list-all .list-item image { width: 220rpx; height: 146rpx; border-radius: 10rpx; } .type-5 .list-all .list-item .label { position: absolute; z-index: 999; width: 34rpx; height: 34rpx; right: 45rpx; } .type-5 .list-all .list-item .label image { position: absolute; width: 100%; height: 100%; } /* type-5 end */ /* type-6 start */ .type-6 .box { background: #fff; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; border-top: 1rpx solid #F4F4F4; padding: 50rpx 30rpx; } .type-6 .box .item:first-child { margin-top: 0rpx; } .type-6 .box .item:nth-child(2) { margin-top: 0rpx; } .type-6 .box .item { margin-top: 40rpx; width: calc(50% - 10rpx); height: 257rpx; } .type-6 .box .item image { width: 100%; height: 206rpx; border-radius: 10rpx; } .type-6 .box .item .name { width: 100%; height: 51rpx; line-height: 60.5rpx; font-size: 32rpx; font-weight: bold; color: rgba(36, 36, 36, 1); overflow: hidden; text-overflow:ellipsis; white-space: nowrap; } /* type-6 end */ /* type-7 start */ .type-7 .video-list { display: flex; justify-content: center; align-items: center; flex-direction: column; background-color: #fff; } .type-7 .video-list .video-item { height: 310rpx; width: 690rpx; border-radius: 16rpx; margin: 30rpx; position: relative; } .type-7 .video-list .video-line { width: 702rpx; height: 1px; background: rgba(234, 234, 234, 0.95); } .type-7 .video-list .video-item video{ height: 100%; width: 100%; border-radius: 16rpx; } .type-7 .video-title { width: 650rpx; border-radius: 16rpx; } .type-7 .video-list .video-line:last-child { display: none; } .type-9 .list-item { margin-top: 16rpx; background: #fff; width: 100%; padding: 0 30rpx 4rpx; box-sizing: border-box; } .type-9 .list-item .top-box { width: 100%; height: 106rpx; display: flex; align-items: center; } .type-9 .list-item .top { width: 100%; font-size: 34rpx; color: rgba(51, 51, 51, 1); overflow: hidden; text-overflow: ellipsis; word-wrap:break-word; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .type-9 .list-item .line { height: 1px; background-color: #f7f7f7; width: 100%; } .type-9 .list-item .bottom { width: 100%; display: flex; align-items: center; justify-content: space-between; } .type-9 .list-item .bottom .name { height: 106rpx; line-height: 106rpx; font-size: 34rpx; font-weight: 500; color: rgba(51, 51, 51, 1); } .type-9 .list-item .bottom image { width: 156rpx; height: 56rpx; }