.i-page{
	width: 100%;
	height: calc(100vh-120rpx);
	// min-height: 1624rpx;
	background: #F7FAFF;
	.i-header{
		position: sticky;
		top:0;
		z-index:9988;
		padding-top:98rpx;
		width: 100%;
		height: 88rpx;
		background: #FFFFFF;
		font-family: PingFangSC, PingFang SC;
		font-weight: 500;
		font-size: 36rpx;
		color: #333333;
		line-height: 88rpx;
		text-align: center;
		font-style: normal;
	}
	.i-boxs{
		.i-banner{
			margin: 20rpx 22rpx 32rpx;
			width: 706rpx;
			height: 359rpx;
			.swiper-item-i{
				
				width: 706rpx;
				height: 359rpx;
					
				.banner-item{
					width: 706rpx;
					height: 359rpx;
					background-size: 690rpx 359rpx;
				}
			}
		}
		.i-list{
			margin: 0 50rpx;
			display: flex;
			flex-wrap: wrap;
			.mian-item{
				margin-right: 67rpx;
				.item-img{
					margin: 0 16rpx;
					width: 80rpx;
					height: 80rpx;
					background-size: 100%;
				}
				.item-text{
					height: 40rpx;
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 28rpx;
					color: #333333;
					line-height: 40rpx;
					text-align: center;
					font-style: normal;
				}
			}
			.mian-item:nth-of-type(4n){
				margin-right:0;
				
			}
		}
		.i-malll{
			// height: 600rpx;
			.hot-tab{
				margin:50rpx 36rpx 16rpx;
				height: 86rpx;
				display: flex;
				align-items: center;
				font-size: 28rpx;
				line-height: 40rpx;
				.hot-header-text{
					width: 160rpx;
					display: flex;
					font-family: PingFangSC-Regular, PingFang SC;
					color: #999999;
					text-align: center;
					.hot-ative{
						position: relative;
						z-index: 1;
						font-family: PingFangSC-Medium, PingFang SC;
						font-weight: 500;
						font-size: 30rpx;
						color: #333333;	
					}
					.hot-ative::after{
						content: '';
						position: absolute;
						top:30%;
						left: 0;
						width: 100%;
						height: 6px; /* 背景色的高度 */
						background-color: #CDE0FE; /* 背景色 */
						z-index: -1
					}
					.hot-icon-show{
						margin-top:10rpx;
						margin-left: 10rpx;
						width: 20rpx;
						height: 20rpx;
						background: url('../../static/img/hot-active-show.png') 0  0 no-repeat;
						background-size: 100%;
					}
					.hot-icon-show-down{
						margin-top:10rpx;
						margin-left: 10rpx;
						width: 20rpx;
						height: 20rpx;
						background: url('../../static/img/hot-active-show-down.png') 0  0 no-repeat;
						background-size: 100%;
					}
				} 
				.hot-icon{
					margin-top:36rpx;
					margin-left: 10rpx;
					width: 20rpx;
					height: 20rpx;
					background: url('../../static/img/hot-active.png') 0  0 no-repeat;
					background-size: 100%;
				}
				.hot-show{
					// flex:1;
					width: 160rpx;
					display: flex;
					color:#999999;
					line-height:90rpx;
					text-align: center;
				}
			}
			.hot-fixed-show{
				position: fixed;
				top:0;
				left: 0; 
				width: 100%; 
				z-index: 999;
				height: 86rpx;
				background:#FFFFFF;
				font-size: 28rpx;
				line-height: 40rpx;
				margin-bottom: 220rpx;
				.hot-text{
					
					padding-top:108rpx;
					width: 100%;
					height:98rpx;
					background: #FFFFFF;
					font-family: PingFangSC, PingFang SC;
					font-weight: 500;
					font-size: 36rpx;
					color: #333333;
					line-height: 50rpx;
					text-align: center;
					font-style: normal;
				}
				.hot-tab-fixed{
					height: 86rpx;
					display: flex;
					align-items: center;
					background:#FFFFFF;
					font-size: 28rpx;
					line-height: 40rpx;
					.hot-text{
						width: 100%;
						height:98rpx;
						background: #FFFFFF;
						font-family: PingFangSC, PingFang SC;
						font-weight: 500;
						font-size: 36rpx;
						color: #333333;
						line-height: 50rpx;
						text-align: center;
						font-style: normal;
					}
					.hot-header-text{
						margin-left:30rpx;
						width: 160rpx;
						display: flex;
						font-family: PingFangSC-Regular, PingFang SC;
						color: #999999;
						text-align: center;
						.hot-ative{
							position: relative;
							z-index: 1;
							font-family: PingFangSC-Medium, PingFang SC;
							font-weight: 500;
							font-size: 30rpx;
							color: #333333;	
						}
						.hot-ative::after{
							content: '';
							position: absolute;
							top:30%;
							left: 0;
							width: 100%;
							height: 6px; /* 背景色的高度 */
							background-color: #CDE0FE; /* 背景色 */
							z-index: -1
						}
						.hot-icon-show{
							margin-top:10rpx;
							margin-left: 10rpx;
							width: 20rpx;
							height: 20rpx;
							background: url('https://ddh.yyhock.com/ddhMall/hot-active-show.png') 0  0 no-repeat;
							background-size: 100%;
						}
						.hot-icon-show-down{
							margin-top:10rpx;
							margin-left: 10rpx;
							width: 20rpx;
							height: 20rpx;
							background: url('https://ddh.yyhock.com/ddhMall/hot-active-show-down.png') 0  0 no-repeat;
							background-size: 100%;
						}
					} 
					.hot-icon{
						margin-top:36rpx;
						margin-left: 10rpx;
						width: 20rpx;
						height: 20rpx;
						background: url('https://ddh.yyhock.com/ddhMall/hot-active.png') 0  0 no-repeat;
						background-size: 100%;
					}
					.hot-show{
						margin-left:36rpx;
						width: 160rpx;
						display: flex;
						color:#999999;
						line-height:90rpx;
						text-align: center;
					}
				}
			}
			.box-at-home{
					// height: 1200rpx;
					background:#F7FAFF ;
				.main-box{
						display:flex;
						flex-wrap: wrap;
						align-items: center;
						margin:0 30rpx;
						.box-item{
							margin-bottom:24rpx;
							width: 333rpx;
							height: 426rpx;
							background: #FFFFFF;
							box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(232,232,232,0.49);
							border-radius: 10rpx;
							.item-top{
								display: flex;
								width: 333rpx;
								height: 272rpx;
								position: relative;
								.top-img{
									
									width: 333rpx;
									height: 272rpx;
									background-size: 333rpx 272rpx;
									border-radius: 10rpx;
									
								}
								.top-icon{
									position: absolute;
									// position: sticky;
									top:0;
									// right:0;
									margin-left: 215rpx;
									// z-index:99;
									display: inline-block;
									width:118rpx;
									height: 110rpx;
									background: url('https://ddh.yyhock.com/ddhMall/goods-sale.png') 0 0 no-repeat;
									background-size:118rpx 110rpx ;
								}
							}
							.item-footer{
								padding: 9rpx 16rpx 21rpx 0rpx;
								.footer-des{
									width: 260rpx;
									font-family: PingFangSC, PingFang SC;
									font-weight: 400;
									font-size: 26rpx;
									color: #333333;
									line-height: 37rpx;
									text-align: left;
									font-style: normal;
									white-space: nowrap; /* 确保文本在一行内显示 */
									overflow: hidden; /* 隐藏超出容器的内容 */
									text-overflow: ellipsis; /* 使用省略号表示被截断的文本 */
									word-break: break-all; /* 允许在单词内换行 */
								}
								.footer-box{
									display: flex;
									margin:9rpx 0 16rpx;
									.box-num{
										display: flex;
										
										font-family: PingFangSC, PingFang SC;
										font-weight: 400;
										font-size: 28rpx;
										color: #FC4D3E;
										line-height: 28rpx;
										text-align: left;
										font-style: normal;
										.num-icon{
											margin-top:4rpx;
											font-size: 20rpx;
										}
									}
								}
								.footer-line{
									display: flex;
									align-items: center;
									justify-content: space-between;
					
									.box-btn{
										width: 76rpx;
										height: 38rpx;
										border-radius: 5rpx;
										border: 1rpx solid #2263E6;
										font-family: PingFangSC, PingFang SC;
										font-weight: 400;
										font-size: 20rpx;
										color: #2263E6;
										line-height: 38rpx;
										text-align: center;
										font-style: normal;
									}
									.box-last{							
										font-family: PingFangSC, PingFang SC;
										font-weight: 400;
										font-size: 20rpx;
										color: #999999;
										line-height: 38rpx;
										text-align: right;
										font-style: normal;
									}
								}
								
							}
						}
						:nth-child(2n){
							margin-left: 24rpx;
						}
				}
					
			}
		}
	}
	
}