page { width:100%; height: 100vh; background: #f7f6f6; } .association { width: 100%; height: 100%; } .association .header { width: 100%; height: 94rpx; background: #fff; } .header image { width: 32rpx; height: 32rpx; margin: auto 0; margin-left: 20rpx; } .header text { display:inline-block; font-size: 32rpx; height: 94rpx; line-height: 94rpx; font-weight: bolder; color: #FD1B10; margin-left: 10rpx; } .association .introduce { width: 100%; height: 240rpx; box-sizing: border-box; padding: 0 30rpx; margin-top: 20rpx; position: relative; } .introduce .bgimage { width: 92%; height: 100%; position: absolute; z-index: -1; } .introduce .content { width: 100%; height:100%; box-sizing: border-box; padding: 0 28rpx; display: flex; justify-content: space-between; align-items: center; } .introduce .content > view view { font-size: 26rpx; color: rgba(255,255,255, 0.8); line-height: 38rpx; } .introduce .content image { width: 118rpx; height: 118rpx; } .association .introduce + .tab { margin-top: 20rpx; } .association .tab { width: 100%; height: 130rpx; margin: 20rpx 0 30rpx; } .tab .content { width: 100%; height: 100%; padding: 0 28rpx; box-sizing: border-box; display: flex; justify-content: space-between; } .tab .content .hover-view { background: #f7f7f7; } .tab .content > view { width: 49%; height:100%; background: #ffffff; border-radius: 8rpx; overflow: hidden; display: flex; align-items: center; justify-content: flex-start; } .tab .content > view image { width: 108rpx; height: 108rpx; margin:0 16rpx 0 22rpx; } .tab .content > view view view { font-size: 34rpx; color: #333; line-height: 34rpx; height: 34rpx; font-weight: bolder; margin-bottom: 10rpx; } .tab .content > view view text { font-size: 26rpx; color: #999; } .tab .anination-tab { width: 100%; height: 6rpx; box-sizing: border-box; padding: 0 28rpx; position: relative; bottom: 6rpx; } .tab .anination-tab .content { position: relative; width: 100%; height: 100%; } .tab .anination-tab .content view { width: 46%; height: 100%; position: absolute; background: #fc9200; left:1%; top: 0; transition: left 0.6s; } .tab .anination-tab view.right { left: 52%; transition: left 0.6s; background: #7493FF; } .nomore-tip { width: 100%; height: 100rpx; background: #f7f7f7; display: flex; justify-content: center; align-items: center; color: #999; font-size: 26rpx; }