.header { position: fixed; width: 100%; height: 1.6rem; top: 0; left: 0; right: 0; z-index: 99; } .header .header_logo { background: var(--themeColor); height: 0.88rem; display: flex; align-items: center; justify-content: space-between; padding: 0 0.3rem; } .header .header_logo i { font-size: 0.45rem; color: var(--whiteColor); } .header .header_logo .search { flex: 1; background: var(--whiteColor); height: 0.6rem; border-radius: 0.6rem; margin-left: 10px; margin-right: 10px; display: flex; align-items: center; } .one { width: 300px; } .header .header_logo .search span { font-size: var(--fontSize12); color: var(--textColor); } .header .header_logo .search i { color: var(--textColor) !important; font-size: 0.26rem !important; margin-right: 0.1rem; padding-top: 0.02rem; margin-left: 0.26rem; } .header_menu { height: 0.72rem; display: flex; align-items: center; background: #fe7fa2; } .header_menu a { color: #fff; text-decoration: none; width: 0.8rem; height: 0.72rem; text-align: center; line-height: 0.72rem; } .header_menu ul { display: flex; flex: 1; overflow-x: scroll; padding-left: 0.3rem; } .header_menu ul li { font-size: 0.26rem; margin-right: 0.26rem; color: #d3d2d2; flex-shrink: 0; } .header_menu ul .active { color: var(--whiteColor) !important; } .content { margin-top: 1.6rem; margin-bottom: 1rem; } .swiper { width: 100%; } .swiper-slide { height: calc(100vh - 1.6rem - 1rem); overflow-y: scroll; }