/*  首页第一屏推荐内容样式 */
.index-top {
    margin: 30px 0;
}

/*左边是热点图片和内容，右边是最新公司动态*/
.index-top .content {
    display: flex; 
    gap: 20px; 
    height: 400px; 
   
}
.index-top .top-left{
    flex:1;  
    width:100%;
    overflow:hidden;
   
}
.index-top .top-right{width: 320px;overflow:hidden;}

/*左边热点内容，图片和文章左右排列*/

.index-top .hot-info {   
    display: flex;
    gap: 20px; 
   
}
.index-top .info-left{width:450px;box-sizing: border-box;}
.index-top .info-right{flex:1;width:100%;overflow:hidden;box-sizing: border-box;}


/* #region 第一屏热点图片 */
.index-top .hot-photos {    
    display: flex;
    flex-direction: column;
    gap: 20px; 
}
/*.index-top .flash {
    height: 300px;*/ /* 固定高度 临时占位，后续再处理 */
    /*border: 1px solid #eee; 
    background-color: #f9f9f9;     
  
}*/

/* 轮播容器样式 */
/* 轮播容器样式 */
/* 轮播容器样式 */
.index-top .flash {
    height: 280px;
    width: 450px;   
    overflow: hidden;
}



.index-top .photo-list {
    height:100px;
    display: flex;
    justify-content: space-between; /* 左右图片分别对齐 */
    gap: 20px; /* 图片间距 */
    flex: 1; /* 占据剩余高度 */
}
.index-top .photo-item {
    flex: 1; 
    position: relative; 
    height: 100%; 
    overflow: hidden; 
}

.index-top .photo-item img {
    width: 100%;
    height: 100%;
    object-fit: cover; 
    transition: transform 0.3s;
}
.index-top .photo-item:hover img {
    transform: scale(1.05); /* hover放大效果 */
}
.index-top .photo-title {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 8px 10px;
    background-color: rgba(0, 0, 0, 0.6); /* 半透明黑背景 */
    color: white;
    font-size: var(--size-small);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align:center;
}
/* #endregion */


/* #region 第一屏热点文章 */

.index-top .hot-articles {    
    display: flex;
    flex-direction: column;
}
.index-top .hot-articles .tit {
    font-size: var(--size-small);    
    color: var(--text-primary);
    height:35px;
    line-height:35px;    
    margin-bottom: 10px;
    border-bottom: 1px solid var(--text-primary); 
}

/* 头条文章样式 */
.index-top .top-article {
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border);
}

.index-top .top-article b {
    display: block;
    font-size: var(--size-medium);
    color: var(--text-primary);
    margin-bottom: 5px;
    height:30px;line-height:30px;overflow:hidden; white-space: nowrap;text-overflow: ellipsis; 
}

.index-top .top-article span {
    font-size: var(--size-small);
    color: var(--text-secondary);
    /*多行超出部分放省略号*/
    display: -webkit-box; 
    -webkit-box-orient: vertical; 
    -webkit-line-clamp: 2;  
    overflow: hidden; 
    text-overflow: ellipsis;    
}



/* 文章列表样式 */
.index-top .hot-articles .list{
    padding:10px;
    box-sizing:border-box;
}

.index-top .hot-articles ul {   
    list-style: none; /* 移除默认列表样式 */   
}

.index-top .hot-articles li {
    height: 25px;
    line-height: 25px;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    position: relative;
    padding-left: 20px; /* 为模拟的圆点预留空间 */
}

/* 模拟列表圆点 */
.index-top .hot-articles li::before {
    content: "•"; /* 使用圆点字符 */
    position: absolute;
    left: 0px;
    color: inherit; /* 继承文本颜色 */
    font-size: 1.2em; /* 调整圆点大小 */
}

.index-top .hot-articles li a {
    flex: 1;
    color: var(--text-body);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 10px;
}

.index-top .hot-articles .date {
    flex-shrink: 0;
    color: var(--text-secondary);
    font-size: var(--size-small);
    white-space: nowrap;
    width: 80px;
    text-align: right;
}

.index-top .hot-articles li a:hover {
    color: var(--link-hover);
}


/* #endregion */

/* #region 第一屏右边的最新动态 */
.index-top .new-info {    
    border:1px solid var(--border);
    height: 100%; 
    background-color:var(--border-bg); 
    overflow: hidden; 
    box-shadow: 0 2px 5px rgba(0,0,0,0.05); /* 轻微阴影 */
    
}

/* 右侧标题样式 */
.index-top .new-info .tit {
    font-size: var(--size-medium);    
    color: var(--text-primary);   
    border-bottom: 1px solid var(--text-primary); 
    
    height:50px;
    line-height:50px;
    text-indent:15px;
    overflow:hidden;
}

.index-top .new-info .list {
    padding: 15px 20px;
}

.index-top .new-info .list ul {
    list-style-type: disc; 
    list-style-position: inside;
}

.index-top .new-info .list li {
    height: 25px;
    line-height: 25px;
    overflow:hidden;
    margin-bottom: 8px; 

    /* 新增以下属性实现文字溢出省略 */
    white-space: nowrap; 
    text-overflow: ellipsis; 
}


/* #endregion */


/* #region 第二屏：左右各一张图片*/
.index-ads{margin-bottom:30px;}
.index-ads .content{display:flex;gap:20px;height:100px;overflow:hidden;}
.index-ads .ad-left{flex:1;width:100%;overflow:hidden;}
.index-ads .ad-right{width:320px;}
.index-ads img{height:100px;width:100%;object-fit:cover;transition: transform 0.3s;}
.index-ads img:hover {
    transform: scale(1.05); /* hover放大效果 */
}
/* #endregion */

/* #region  第三屏：聚焦三农 基本布局 */

.index-news { margin-bottom: 30px;}

/*左边聚焦三农 右边是推荐新闻*/
.index-news .content {
    display: flex; 
    gap: 20px; 
    height: 450px; 
   
}
.index-news .news-left{
    flex:1;    
    width:100%;
    overflow:hidden;
       
}
.index-news .news-right{width: 320px;overflow:hidden;}


/* #endregion */

/* #region 聚焦三农图片区域*/

.index-news .news-photos {  
    padding:15px 20px;
    border:1px solid var(--border);
    background:var(--border-bg);
    width:100%;
   
}

.index-news .news-photos .tit {    
    padding-bottom: 10px;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom:1px solid var(--text-primary);
}

.index-news .tit-name {
    font-size: var(--size-medium);
    font-weight: bold;
    color: var(--text-primary);    
}

.index-news .tit-list {
    display: flex;
    list-style: none;    
    gap: 15px;
}
.index-news .tit-list li a {    
    color: var(--text-primary);
    font-size: var(--size-small);
    padding:8px 15px;
    border:1px solid var(--border);
    border-radius:5px;
}

.index-news .tit-list li a:hover {
    background:var(--text-primary);
    color:var(--text-on-dark);
}

/* 图片容器使用Grid布局 */
.index-news .photos {
    width:100%;
    overflow:hidden;
    margin-top: 20px;
    display: grid;
    grid-template-columns: repeat(3, 1fr); 
    gap: 20px; 
    
}

.index-news .photo-item {
    width:100%;    
    overflow:hidden;
   
}
 
.index-news .photo-item img {
    width: 100%;
    height: 130px;    
    border-radius:5px;
    display: block;
    margin-bottom: 8px;    
    transition: transform 0.3s;
    object-fit:cover;

}
.index-news .photo-item:hover img {
    transform: scale(1.05); /* hover放大效果 */
}

.index-news .photo-item span {    
    overflow:hidden;
    display: block;
    white-space: nowrap;    
    text-overflow: ellipsis;   
    font-size:var(--size-small);
    color:var(--text-secondary);
    text-align: center;
}
/* #endregion */


/* #region  推荐新闻*/

.index-news .hot-news {        
    height: 100%; /* 高度填满父容器 */
    background-color:var(--border-bg); 
    overflow: hidden; 
    box-shadow: 0 2px 5px rgba(0,0,0,0.05); /* 轻微阴影 */
    
}

.index-news .hot-news .tit {
    text-align:center;
    font-size: var(--size-medium);    
    color: var(--text-body);
    font-weight:bold;
    height:50px;
    line-height:50px;
    border-bottom: 3px solid var(--border); 
}

.index-news .hot-news .list {
    padding: 30px 20px;
}

.index-news .hot-news .list ul {
    list-style-type: disc; 
    list-style-position: inside;
}

.index-news .hot-news .list li {
    height: 25px;
    line-height: 25px;
    overflow:hidden;
    margin-bottom: 10px; 

    /* 新增以下属性实现文字溢出省略 */
    white-space: nowrap; 
    text-overflow: ellipsis; 
}


/* #endregion */


/* #region  第四屏：商城基本布局 */

.index-shop { margin-bottom: 30px;}

.index-shop .content {
    display: flex; 
    gap: 20px; 
    height: 450px;    
}
.index-shop .shop-left{width: 320px;overflow:hidden;}
.index-shop .shop-right{
    flex:1;    
    width:100%;
    overflow:hidden;       
}

/* #endregion */

/* #region  最新企业*/

.index-shop .new-shop {        
    height: 100%; /* 高度填满父容器 */
    background-color:var(--border-bg); 
    border:1px solid var(--border);
    overflow: hidden; 
    box-shadow: 0 2px 5px rgba(0,0,0,0.05); /* 轻微阴影 */
    padding:10px 20px;
    
}

.index-shop .new-shop .tit {    
    font-size: var(--size-medium);    
    color: var(--text-body);
    font-weight:bold;
    height:40px;
    line-height:40px;    
    border-bottom: 3px solid var(--border); 
}

.index-shop .new-shop .list {
    padding: 20px 20px;
}

.index-shop .new-shop .list ul {
    list-style-type: none;     
}

.index-shop .new-shop .list li {
    height: 25px;
    line-height: 25px;
    overflow:hidden;
    margin-bottom: 10px; 

    /* 新增以下属性实现文字溢出省略 */
    white-space: nowrap; 
    text-overflow: ellipsis; 
}


/* #endregion */

/* #region 产品图片*/

.index-shop .shop-products {
    width:100%;
}

.index-shop .shop-products .tit {        
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom:2px solid var(--text-primary);
}

.index-shop .tit-name {
    font-size: var(--size-medium);
    font-weight: bold;
    background: var(--text-primary);
    color:var(--text-on-dark);
    padding:8px 15px;
}

.index-shop .tit-more {
    font-size:var(--size-small);
    color:var(--text-secondary);   
}

.index-shop .tit-more:hover{color:var(--link-hover);}


/* 图片容器使用Grid布局 */
.index-shop .photos {
    width:100%;
    overflow:hidden;
    margin-top: 30px;
    display: grid;
    grid-template-columns: repeat(4, 1fr); 
    gap: 30px; 
    
}

.index-shop .photo-item {
    width:100%;    
    overflow:hidden;   
}
 
.index-shop .photo-item img {
    width: 100%;
    height: 130px;    
    border-radius:5px;
    display: block;
    margin-bottom: 8px;    
    transition: transform 0.3s;
    object-fit:cover;
}
.index-shop .photo-item:hover img {
    transform: scale(1.05); /* hover放大效果 */
}

.index-shop .photo-item span {    
    overflow:hidden;
    display: block;
    white-space: nowrap;    
    text-overflow: ellipsis;   
    font-size:var(--size-small);
    color:var(--text-secondary);
    text-align: center;
}
/* #endregion */




/* #region 第五屏：横幅广告*/
.index-banner{margin-bottom:30px;}
.index-banner .ad-banner{width:100%;overflow:hidden;height:80px;}
.index-banner img{height:100%;width:100%;object-fit:cover;}

/* #endregion */



/* #region 第六屏服务栏目：基础布局*/

.index-service { margin-bottom: 30px;}
.index-service .content {
    display: flex; 
    gap: 20px; 
    height: 450px;    
}
.index-service .service-left{width: 320px;overflow:hidden;}
.index-service .service-middle{
    flex:1;    
    width:100%;
    overflow:hidden;       
}
.index-service .service-right{width: 320px;overflow:hidden;}

/* #endregion */


/* #region  一村一品*/

.index-service .hot-brands {        
    height: 100%; /* 高度填满父容器 */
    background-color:var(--border-bg); 
    border:1px solid var(--border);
    overflow: hidden; 
    box-shadow: 0 2px 5px rgba(0,0,0,0.05); /* 轻微阴影 */
    padding:10px 20px;
    
}

.index-service .hot-brands .tit {    
    font-size: var(--size-medium);    
    color: var(--text-primary);
    font-weight:bold;
    height:40px;
    line-height:40px;    
    border-bottom: 2px solid var(--text-primary); 
}
.index-service .hot-brands .tit a{color:var(--text-primary);}
.index-service .hot-brands .list {
    padding: 20px 0px;
}

.index-service .hot-brands .list-photo{
    margin-bottom:15px;width:100%;overflow:hidden;
}
.index-service .hot-brands .list-photo span{display:block;overflow:hidden;width:100%;font-size:var(--size-small);color:var(--link-default);}

.index-service .hot-brands .list ul {
    list-style-type:disc;
    list-style-position:inside;
}

.index-service .hot-brands .list li {
    height: 22px;
    line-height: 22px;
    overflow:hidden;
    margin-bottom: 10px; 

    /* 新增以下属性实现文字溢出省略 */
    white-space: nowrap; 
    text-overflow: ellipsis; 
}


/* #endregion */





/* #region 生活服务*/

.index-service .new-services {width:100%;}

.index-service .new-services .tit {      
    padding-bottom: 10px;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom:1px solid var(--text-primary);
}

.index-service .tit-name {
    font-size: var(--size-medium);
    font-weight: bold;
    color: var(--text-primary);    
}

.index-service .tit-list {
    display: flex;
    list-style: none;    
    gap: 15px;
}
.index-service .tit-list li a {    
    color: var(--text-primary);
    font-size: var(--size-small);
    padding:5px 15px;
    border:1px solid var(--border);
    border-radius:5px;
}

.index-service .tit-list li a:hover {
    background:var(--text-primary);
    color:var(--text-on-dark);
}


/* 文章列表样式 */
.index-service .new-services .list{
    padding:10px;
    box-sizing:border-box;
}

.index-service .new-services .list ul {   
    list-style: none; /* 移除默认列表样式 */   
}

.index-service .new-services  .list li {
    height: 25px;
    line-height: 25px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    position: relative;
    padding-left: 20px; /* 为模拟的圆点预留空间 */
}

/* 模拟列表圆点 */
.index-service .new-services .list li::before {
    content: "•"; /* 使用圆点字符 */
    position: absolute;
    left: 0px;
    color: inherit; /* 继承文本颜色 */
    font-size: 1.2em; /* 调整圆点大小 */
}

.index-service .new-services .list li a {
    flex: 1;
    color: var(--text-body);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 10px;
}

.index-service .new-services  .list li .date {
    flex-shrink: 0;
    color: var(--text-secondary);
    font-size: var(--size-small);
    white-space: nowrap;
    width: 80px;
    text-align: right;
}

.index-service .new-services  .list li a:hover {
    color: var(--link-hover);
}



/* #endregion */


/* #region  政策解读*/

.index-service .new-policy {        
    height: 100%; /* 高度填满父容器 */
    background-color:var(--border-bg); 
    border:1px solid var(--border);
    overflow: hidden; 
    box-shadow: 0 2px 5px rgba(0,0,0,0.05); /* 轻微阴影 */
    padding:10px 20px;
    
}

.index-service .new-policy .tit {    
    font-size: var(--size-medium);    
    color: var(--text-primary);
    font-weight:bold;
    height:40px;
    line-height:40px;    
    border-bottom: 3px solid var(--text-primary); 
}
.index-service .new-policy .tit a{color:var(--text-primary);}

.index-service .new-policy .list {
    padding: 20px 10px;
}

.index-service .new-policy .list ul {
    list-style-type:disc;
    list-style-position:inside;
}

.index-service .new-policy .list li {
    height: 25px;
    line-height: 25px;
    overflow:hidden;
    margin-bottom: 10px; 

    /* 新增以下属性实现文字溢出省略 */
    white-space: nowrap; 
    text-overflow: ellipsis; 
}
.index-service .new-policy .list li a{color:var(--text-primary);}
.index-service .new-policy .list li a:hover{color:var(--link-hover);}


/* #endregion */