.section-1{
    background: linear-gradient(180deg, rgba(255, 242, 246, 0.5) 0%, rgba(255, 255, 255, 0.5) 100%);
}
.section-1 .nav{
    width: 1140px;
}
.section-1 .list{
    display: grid;
    display: -ms-grid;
   
     /* 三列，宽度分别为 100px、200px 和剩余空间的 1 份 */
    grid-template-columns: repeat(5, 1fr);
    justify-items: center;
    align-items: stretch;
  margin-top: 30px;
 gap: 0;
}
.section-1 .list li .tit{
    opacity: 0.8;
font-size: 18px;
font-weight: 400;
letter-spacing: 0px;
line-height: 26.06px;
color: rgba(0, 0, 0, 1);
}
.section-1 .list li .nav_item{
    width: 179px;
    display: flex;
    flex-wrap: wrap;
    column-gap: 13px;

    row-gap: 15px;
 margin-top: 30px;
}

.section-1 .list li a{
    display: block;
    padding: 0 9px;
    height: 30px;
opacity: 1;
border-radius: 8px;
background: rgba(255, 240, 244, 1);
font-size: 16px;
font-weight: 400;
letter-spacing: 0px;
line-height: 30px;
color: rgba(0, 0, 0, 0.5);
}
.section-1 .list li a.active{
    background: rgba(255, 127, 180, 0.8);
    color: rgba(255, 255, 255, 1);
}
.section-1 .list li{
    padding: 0 30px;
    position: relative;
 
}
.section-1 .list li:not(:nth-child(5n)){
    border-right: 0.5px dashed rgba(0, 0, 0, 0.1);
}
.section-1 .list li:nth-child(1),.section-1 .list li:nth-child(6){
    padding-left: 0;
}
.section-1 .list li:nth-child(5),.section-1 .list li:nth-child(10){
    padding-right: 0;
}
.section-1 .list li:nth-child(-n + 5){
   padding-bottom: 30px;
   border-bottom:  0.5px dashed rgba(0, 0, 0, 0.6);
  }
  .section-1 .list li:nth-child(n + 6):nth-child(-n + 10){
    padding-top: 30px;
   }
   .section-1 .list li::before{
  content: '';
  display: block;
  width: 60px;
height: 60px;
position: absolute;
right: 20px;
   }
   .section-1 .list li:nth-child(1):before{
    background: url('/static/index/pc/images/zxs.webp') no-repeat center;
    background-size: cover;
    top: -20px;
   }
   .section-1 .list li:nth-child(2):before{
    background: url('/static/index/pc/images/hd.webp') no-repeat center;
    background-size: cover;
    top: -20px;
   }
   .section-1 .list li:nth-child(3):before{
    background: url('/static/index/pc/images/hn.webp') no-repeat center;
    background-size: cover;
    top: -20px;
   }
   .section-1 .list li:nth-child(4):before{
    background: url('/static/index/pc/images/hz.webp') no-repeat center;
    background-size: cover;
    top: -20px;
   }
   .section-1 .list li:nth-child(5):before{
    background: url('/static/index/pc/images/hb.webp') no-repeat center;
    background-size: cover;
    top: -20px;
    right: 0;
   }
   .section-1 .list li:nth-child(6):before{
    background: url('/static/index/pc/images/xb.webp') no-repeat center;
    background-size: cover;
    top: 9px;
   }
   .section-1 .list li:nth-child(7):before{
    background: url('/static/index/pc/images/xn.webp') no-repeat center;
    background-size: cover;
    top: 9px;
   }
   .section-1 .list li:nth-child(8):before{
    background: url('/static/index/pc/images/db.webp') no-repeat center;
    background-size: cover;
    top: 9px;
   }
   .section-1 .list li:nth-child(9):before{
    background: url('/static/index/pc/images/tb.webp') no-repeat center;
    background-size: cover;
    top: 9px;
   }
   .section-1 .list li:nth-child(10):before{
    background: url('/static/index/pc/images/hw.webp') no-repeat center;
    background-size: cover;
    top: 9px;
    right: 0;
   }
   /* 内容样式 */
.section-2{
    margin-top: 60px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
/* 左侧列表样式 */
.left-content{
    width: 800px; 
}
.left-content .tit{
    width: 800px;
height: 50px;
opacity: 1;
border-radius: 10px;
font-size: 20px;
font-weight: 900;
letter-spacing: 0px;
line-height: 50px;
color: rgba(255, 255, 255, 1);
padding-left: 20px;
background: url(/static/index/pc/images/list_tit_bg.webp) no-repeat center;
background-size: 100% 100%;
}
.left-content .list li{
margin-top: 20px;
border-radius: 10px;
background: rgba(250, 250, 250, 1);
overflow: hidden;
padding: 20px;
}
.left-content .list .yy{
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}
.left-content .list .yy .img{
    width: 198px;
height: 124px;
mix-blend-mode: multiply;
opacity: 1;
border-radius: 10px;
overflow: hidden;
}
.left-content .list .yy .info{
    width: 547px;
    display: flex;
    flex-direction: column;
   gap: 10px;
    align-items: flex-start;
}
.left-content .list .yy .info .title{
    width: 465px;
    height: 22px;
opacity: 0.8;
font-size: 24px;
font-weight: 400;
letter-spacing: 0px;
line-height: 20px;
color: rgba(0, 0, 0, 1);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.left-content .list .yy .info .tag{
    display: flex;
    align-items: center;
   gap: 10px;
}
.left-content .list .yy .info .tag span{
    display: block;
    padding: 0 7px;
    height: 25px;
mix-blend-mode: multiply;
opacity: 1;
border-radius: 5px;
font-size: 14px;
font-weight: 400;
letter-spacing: 0px;
line-height: 25px;
}
.left-content .list .yy .info .tag span:nth-child(1){
    background: rgba(255, 207, 228, 1);
    color: rgba(153, 24, 80, 0.5);
}
.left-content .list .yy .info .tag span:nth-child(2){
    background: rgba(242, 242, 242, 1);
    color: rgba(0, 0, 0, 0.5);
}
.left-content .list .yy .info .rank{
    display: flex;
    align-items: center;
    height: 25px;
    padding-right: 10px;
mix-blend-mode: multiply;
opacity: 1;
border-radius: 5px;
background: rgba(255, 246, 207, 1);
}
.left-content .list .yy .info .rank div{
    font-size: 14px;
font-weight: 400;
letter-spacing: 0px;
line-height: 14px;
color: rgba(170, 101, 8, 1);
margin-left: 10px;
}
.left-content .list .yy .info .rank:before{
    content: '';
    display: block;
    width: 74px;
    height: 25px;
background: url(/static/index/pc/images/rank_icon.webp) no-repeat;
background-size: 100% 100%;
}
.left-content .list .yy .info .rank span{
    font-size: 14px;
font-weight: 900;
letter-spacing: 0px;
line-height: 20px;
color: rgba(170, 101, 8, 1);
margin-left: 3px;
}
.left-content .list .yy .info .dizhi{
    font-size: 18px;
font-weight: 400;
letter-spacing: 0px;
line-height: 20px;
color: rgba(0, 0, 0,0.5);
}
.left-content .list .yy button{
    position: absolute;
    width: 120px;
height: 50px;
opacity: 1;
border-radius: 40px;
background: rgba(255, 156, 199, 1);
border: none;
font-size: 16px;
font-weight: 400;
letter-spacing: 0px;
line-height: 50px;
color: rgba(255, 255, 255, 1);
top: 6px;
right: 0;
cursor: pointer;
}
.left-content .list .ys{
    opacity: 1;
border-radius: 10px;
background: rgba(255, 255, 255, 1);
padding:15px;
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-top: 15px;
}
.left-content .list .ys .img{
    width: 50px;
height: 50px;
opacity: 1;
border-radius: 120px;
overflow: hidden;
}
.left-content .list .ys .info{
    width: 670px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
}
.left-content .list .ys .info .title{
    display: flex;
    align-items: center;
 
}
.left-content .list .ys .title .n{
    height: 20px;
    opacity: 0.8;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0px;
    line-height: 20px;
    color: rgba(0, 0, 0, 1);
}
.left-content .list .ys .title .w{
    height: 14px;
opacity: 0.5;
font-size: 12px;
font-weight: 400;
letter-spacing: 0px;
line-height: 12px;
color: rgba(0, 0, 0, 1);
margin: 0 8px 0 5px;
}
.left-content .list .ys .title .h{
    height: 20px;
    mix-blend-mode: multiply;
    opacity: 1;
    border-radius: 5px;
    background: rgba(255, 255, 255, 1);
    
    border: 0.5px solid rgba(255, 141, 26, 1);
padding: 0 6px;   
font-size: 12px;
font-weight: 400;
letter-spacing: 0px;
line-height: 20px;
color: rgba(250, 138, 25, 1);
}
.left-content .list .ys .tag{
    display: flex;
    gap:10px;
    align-items: center;
}
.left-content .list .ys .tag .y{
    height: 14px;
opacity: 0.5;
font-size: 12px;
font-weight: 400;
letter-spacing: 0px;
line-height: 12px;
color: rgba(0, 0, 0, 1);
}
.left-content .list .ys .tag .s{
    height: 20px;
mix-blend-mode: multiply;
opacity: 1;
border-radius: 5px;
background: rgba(255, 255, 255, 1);

border: 0.5px solid rgba(202, 113, 151, 1);
padding: 0 6px;
font-size: 12px;
font-weight: 400;
letter-spacing: 0px;
line-height: 20px;
color: rgba(202, 113, 151, 1);
}
.left-content .list .ys .rank{
    display: flex;
    align-items: center;
    height: 20px;
mix-blend-mode: multiply;
opacity: 1;
border-radius: 5px;
background: rgba(255, 246, 207, 1);
font-size: 12px;
font-weight: 400;
letter-spacing: 0px;
line-height: 20px;
color: rgba(170, 101, 8, 1);
margin-bottom: 5px;
gap: 5px;
padding-right: 13px;
}
.left-content .list .ys .rank div{
    font-size: 12px;
font-weight: 400;
letter-spacing: 0px;
line-height: 20px;
color: rgba(170, 101, 8, 1);
}
.left-content .list .ys .rank:before{
    content: '';
    display: block;
    width: 60px;
    height: 20px;
background: url(/static/index/pc/images/rank_icon.webp) no-repeat;
background-size: 100% 100%;
}
.left-content .list .ys .rank span{
    font-size: 12px;
font-weight: 900;
letter-spacing: 0px;
line-height: 20px;
color: rgba(170, 101, 8, 1);
margin-left: 3px;
}
.left-content .list .ys .des{
    opacity: 0.5;
font-size: 12px;
font-weight: 400;
letter-spacing: 0px;
line-height: 28px;
color: rgba(0, 0, 0, 1);
display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
}
