
.crumb{
    height: 3rem;
    margin: 1.5rem 0;
    font-size: 1.8rem;
}

/* #region citystart */
.main-content .content{
    border: 1px solid #E9ECF0;
    margin: 1rem 0;
}
.city-hd{
    margin: 0 3rem;
    padding: 2rem 0;
    font-size: 2rem;
    text-align: center;
    border-bottom: 1px solid #E9ECF0;
}
.city-hd .h2{
    width: 90%;
    
}
.city-list{
    padding: 3rem;
}
.city-list ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 2rem; /* 元素之间的间距 */
}
.city-list ul li{
    flex: 1 1 calc(10% - 10px); /* 每行显示 4 个，间距 10px */
    text-align: center; /* 文字居中 */
}
  /* 导航链接 */
  .city-list li a {
    display: block;
    padding: 10px;
    background-color: #DD302D;  /*按钮背景色为主题色 */
    /*background-color: #ececec;  按钮背景色为主题色 */
    color: #FFFFFF; /* 文字颜色为白色 */
    text-decoration: none; /* 去掉下划线 */
    border-radius: 5px; /* 圆角 */
    font-size: 14px; /* 字体大小 */
    transition: background-color 0.3s ease; /* 悬停效果 */
  }
  /* #endregion cityend */
  
/* #region citydetail s */
  .city-des .content,
  .delivery-area .content,
  .flower-shop .content,
  .product .content,
  .city-articles .content{
    margin: 1rem 0;
    padding: 1rem;
    border: 1px solid #E9ECF0;
  }
  .city-des .content{
   
    display: flex;
    justify-content: space-between;
  }
  .city-des .content .left{
    width: 30%;
  }
  .city-des .content .left img{
    width: 90%;
    height: auto;
  }
  .city-des .content .right{
    width: 70%;
  }
  .city-des .content .right .title,
  .delivery-area .content .title,
  .flower-shop .content .title,
  .product .content .title,
  .city-articles .content .title
  {
    text-align: center;
    padding: 1rem 0;
    font-size: 2rem;
    border-bottom: 1px solid #E9ECF0;
  }
  .city-des .content .right .des,
  .delivery-area .content .des,
  .flower-shop .content .des,
  .product .content .des,
  .city-articles .content .des
  {
    margin-top: 1rem;
    text-indent: 2em;
    line-height: 3rem;
    font-size: 1.5rem;
  }
  .city-des .content .right .city-description{
    font-size: 1.8rem;
  }

/* 商品列表 */

.city-hot-sale{
    /* margin-top: 2rem; */
    /* border: 1px solid #eee; */
    /* margin-top: 1rem; */
    /* padding: 1rem 1rem; */
  }
  .city-hot-sale ul{
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
    list-style: none;
    gap: 1rem; /* 商品之间的间距 */
  }
  .city-hot-sale ul li{
    flex: 0 1 19.3%;
    /*max-width: 22.5rem;  (1190 - 40) ÷ 5 = 230px，40px是商品间总间距 */
    padding: 1rem;
    box-sizing: border-box;
    border: 1px solid #eee;
    border-radius: 0.4rem;
    transition: all  .5s ease;
  }
  .city-hot-sale ul li:hover{
    /* 2d转换放大或者缩小 scale(1.2)放大1.2倍*/
    transform:scale(1.1)
  }
  .city-hot-sale ul li img{
    max-width: 100%;
    height: auto;
    border-radius: .4rem;
  }
  .city-hot-sale ul li .name,
  .city-hot-sale ul li .price
  {
    padding-top: .5rem;
    text-align: center;
  }
  .city-hot-sale ul li .name a{
    color: #737373;
    font-size: 1.6rem;
  }
  .city-hot-sale ul li .price{
    color: #DD302D;
    font-weight: bold;
    font-size: 1.8rem;
  }

  /* 文章列表 */
  .article-list{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;

  }
  .article-list .article-item{
    flex: 0 1 29%;
    position: relative;
    /* width: 38rem; */
    font-size: 1.3rem;
    line-height: 2.8rem;
    padding-left: 1rem
  }
  .article-list .article-item a{
    color: #232628;;
  }
  .article-list .article-item ::before{
    position:absolute;
    content: "";
    left: 3.2rem;
    top: 1.2rem;
    width: .4rem;
    height: .4rem;
    border-radius: 50%;
    background-color: #B4BABF;
  }
/* #region citydetail e */

/* #region 媒体查询 start*/
@media (max-width:1200px){
 
    .city-hot-sale ul li{
        flex: 0 1 48%;
    }
    .article-list .article-item{
        flex: 0 1 45%;
    }
}

@media(max-width:992px){
   


     
}
@media(max-width:768px){
  
    .city-hot-sale ul,
    .hot-sale-list ul{
        justify-content: center;
    }
    .city-hot-sale ul li,
    .hot-sale-list ul li{
        flex: 0 1 48%;
    }
    .article-list .article-item{
        flex: 0 1 80%;
    }
    
}
/* #endregion 媒体查询 end*/




