main section{ padding-bottom: 40px;}
main section:nth-of-type(odd){background: #F9F9F9;}

/* 循环线 *//* 外层容器：固定尺寸 + 透视（perspective） */
  .flip_card {
    width: 160px;
    min-width: 160px;
    height: 160px;
    perspective: 1000px;
    /* 3D 深度感 */
    margin: 10px;
  }
   @media screen and (min-width: 1282px){
    
    .flip_card {
      width: 200px;
    min-width: 200px;
    height: 200px;margin: 15px;
}
   }

    @media screen and (min-width: 1500px){
    
    .flip_card {
    width: 227px;
    min-width: 227px;
    height: 227px;margin: 20px;
}
   }
  /* 内层：启用 3D 变换 + 过渡动画 */
  .flip_card_inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
   
  } 
  .flip_card .flip_card_inner::after{ content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 100%;  background: linear-gradient( 180deg, rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 15%); border-radius: 50%;}
  .flip_card .flip_card_inner { pointer-events: none;
    transition: transform 0.6s;
    transform-style: preserve-3d;}
  .flip_card_more .flip_card_inner{ border:1px solid #BDDCF3; border-radius: 50%;
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center; 
    display: flex; align-items: center; justify-content: center; color: var(--lan); text-decoration: none;background: #fff;
  }
  .flip_card_more:hover .flip_card_inner{ background: #e2f2ff;}
.flip_card_more {text-decoration: none; }
  /* hover 时翻转 180 度 */
  .flip_card:not(.flip_card_more):hover .flip_card_inner {
    transform: rotateY(180deg);
  }

  /* 正面 & 背面：绝对定位叠在一起 */
  .flip_card_front,
  .flip_card_back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    /* 翻转后隐藏背面 */
    border-radius: 50%;
    /* 圆形裁剪（可选） */
    overflow: hidden;
  }

  /* 正面：正常显示 */
  .flip_card_front {
    /* SVG 已是圆形，这里可不加样式 */
  }

  /* 背面：初始旋转 180°，hover 时才正过来 */
  .flip_card_back {
    transform: rotateY(180deg);
  }

  /* 背面图片填充 */
  .flip_card_back img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* 保持比例并覆盖整个区域 */
  }

  .hxx_svg_0 {
    fill: currentColor;
  }

  .hxx_svg_1 {
    font-size: 28px;
    fill: #fff;
    text-anchor: middle;
  }

  .hxx_svg_2 {
    fill: currentColor;
    text-anchor: middle;
    font-size: 20px
  }

.hxx_svg_3 {
    fill: #fff;
    text-anchor: middle;
    font-size: 16px
  }

  .fx_img {
    
    /* height: 327px; */
    width: 100%;
    position: relative;
    overflow: hidden;
    cursor: grab;
  }  
  .fx_img  > div{ display: flex;
    
 }

  /* 拖拽时的样式 */
  .fx_img.moving {
    cursor: grabbing;
  }

  .fx_img.moving a,
  .fx_img.moving img {
    pointer-events: none;
    user-select: none;
  }

 .fx_img button { cursor: pointer; width: 40px; height: 40px; z-index: 99;
    color: #757575 !important;
    cursor: pointer;
    background-color: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    
    display: flex;
     }
 .fx_btn{ opacity: 0; bottom: 20px; position: absolute; left:  50%; transform: translateX(-50%); display: flex; gap: 10px; z-index: 10;}

  .fx_img:hover .fx_btn{ opacity: 1;}
 body{ margin: 0; padding: 0;}

 /* banner */
 
 .swiper{ opacity: 0;}
 
 .swiper.ok{opacity: 1; }
 .recommend .swiper-slide{ width: 33.3%;}

 .banner .bg{ position: relative; }
 .banner{ padding-bottom: 0;}
 .banner img{ height: 250px; object-fit: cover; width: 100%; }
 .banner .swiper{ text-align: center;}

  @media screen and (min-width: 1024px){
.banner img{ height: 428px}
  }





.banner .swiper-pagination{ padding-left: calc((100vw - var(--bg_w)) /2);  width: auto ; text-align: left; margin-bottom: 20px;}
.recommend { overflow: hidden;margin-top: -5px;}
.recommend img{width: 100%;border-radius: 22px 22px 22px 22px;height: 130px;  }
  @media screen and (min-width: 1282px){
    .recommend img{ height: 160px; object-fit: cover;}
  }
  @media screen and (min-width: 1500px){
     
  }
  .recommend .swiper-wrapper{  padding-top: 5px;}
  .recommend .ok a, .list a{transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);  }
.recommend a:hover, .list a:hover{  transform: translateY(-4px); }


 .swiper-button-next, .swiper-button-prev{    z-index: 99;
    color: #757575 !important;
    cursor: pointer;
    background-color: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 32px;
    height: 32px;
    margin-top: -16px;
    display: flex ;
    position: absolute;
    top: 50% !important;
}.swiper-button-next svg, .swiper-button-prev  
    svg {
        height: 40% !important;}
        .swiperw{ position: relative;}
      .swiperw   .swiper{ width: 90%;overflow: inherit !important; float: left;}
         
           .swiper-button-next, .swiper-button-prev{ display: none !important;}
 @media screen and (min-width: 480px){
       .swiperw .swiper{ width: 100%;overflow: hidden !important; float: none;  }
    .swiper-button-next, .swiper-button-prev{ display: flex !important;}
.swiperw .swiper-button-prev{ margin-left: -60px !important;}
         .swiperw .swiper-button-next{ margin-right: -60px;}
 }

.h2{ width: 100%; display: flex; align-items: center;  white-space:nowrap; padding: 30px 0 15px 0;}
.h2 h2{ font-size: var(--font24);}
.h2 a.more{font-size: var(--font14);  margin-left: auto; margin-right: 0; 
 
  transition: all 0.4s ease-in-out;
border-radius: 22px 22px 22px 22px;
border: 1px solid #E6E6E6; padding: 5px 20px 5px 10px;
 background-color: #FFFFFF ; background-repeat: no-repeat;
background-image: url(../images/home/jt.svg)  ; background-position: calc(100% - 4px) center; background-size: 20px auto;}
.h2 a.more:hover{ border-color: #000;}
@media screen and (min-width: 480px){
.h2 a.more{  padding: 5px 30px 5px 10px;background-image:   url(../images/home/jtx.svg);background-position: calc(100% - 12px) center;}
}
.en{ font-size: var(--font24);color: rgba(0,0,0,0.2);font-family:Arial, Helvetica, sans-serif; padding: 0 0 0 10px; margin-left: 20px; position: relative; overflow: hidden;}
.en::before,.p_title::before{ content: "";width: 0;
height: 20px;
border-left: 1px solid #C7C7C7;transform:rotate(25deg); position: absolute; left: 0; top: 5px; }
.p_title::before{top: 15px;}
.p_title{ overflow-x: auto; position: relative; margin-left: 20px; display: flex; align-items: center; padding: 10px 0 10px 15px;  }
.p_title a{  padding:0 10px; }
.h2 a.this{ color: var(--lan); }
.h2 .this{  position: relative;}
.h2 .this ~ .p_title::before{ display: none;}
.h2 .this ~ .p_title{ margin-left: 0;}
.h2 .this::after{ content: ""; position: absolute; bottom: -7px; left: 50%; width: 40%; height: 3px; max-width: 40px;transform: translatex(-50%); background-color: var(--lan); border-radius: 8px;} 


.p_list{ padding-bottom: 10px;}
/* gg_banner */
.gg_banner { padding-top:40px;}
.gg_banner img{ border-radius: 18px; width: 100%;}
/* ai */
.ai_trip{  transition: all 0.4s ease-in-out; background: #26064d url(../images/home/banner_ai.jpg) center no-repeat; background-size: cover; color: #fff; position: relative; padding: 0;}
/* .ai_trip:hover{ background-size: auto 120%;} */
 

.ai_btn{ padding: 8px 15px;;
background: #F85A5E; color: #fff;
border-radius: 14px ; font-size: var(--font16);}
.ai_btn:hover{ color: #EC3636; background-color: #fff;}
.ai_trip .con_text{ display: flex; align-items: center; justify-content: center; flex-direction: column; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 2;}





.ai_trip img{ height: 100%; width: 100%; position: relative; z-index: 1; object-fit: cover;}
.ai_trip h2{font-size: 34px;}.ai_trip b{ font-size:37px;}
.ai_trip{ height: 280px;}
  @media screen and (min-width: 768px){
.ai_trip{ height: 406px;}
   }
    @media screen and (min-width: 1024px){
.ai_trip h2{font-size: 64px;}.ai_trip b{ font-size: 72px;}
   }
   @media screen and (min-width: 1282px){

   }
  @media screen and (min-width: 1500px){

  }



/* 机票 */
.deals{ display: flex; flex-wrap: wrap; margin: 0 -10px;  }
.route::before,.route::after,.deal::before,.deal::after,.route span{transition: all 0.4s ease-in-out;}
.route::before{  z-index: 1;content: "";border-radius: 10px ;
border: 1px solid #D7D7D7;  top: 0; left: 0; bottom: 0; right: 0; position: absolute;}

.route::after{ z-index: 2; content: ""; border-radius:0 0 12px 12px; height: 10px;
background-color:  #8DCEED;    left: 0; bottom: 0; right: 0; position: absolute;}

.deal{ padding: 20px;  overflow: hidden;
height: 113px;
background: #FFFFFF; 
position: relative;  margin: 10px ;}
.deal::before,.deal::after{ content: ""; display: block;border: 1px solid #D7D7D7;  position: absolute; top: 50%;; width: 16px; height: 16px; border-radius: 50%;  transform: translatey(-50%); background: #fff; z-index: 10;}
.main section:nth-of-type(odd) .deal::before,.main section:nth-of-type(odd) .deal::after{background: #F5F5F5;}
.deal::before{ right: -8px;}
.deal::after{ left: -8px;}
.deal img{ width: 24px; height: 24px; display: inline-block;}
.route span{font-size: 12px;
color: #8DCEED; padding-left: 5px;}
.route{ border-bottom: 1px dotted #ccc; padding-bottom: 10px ; margin-bottom: 5px}
.deal_b{ display: flex; align-items: center;}
.deal_b .price{ margin-left: auto; color: #F9740C; font-size: var(--font24);}
.deal_b .price em{ font-style: normal; font-size: var(--font12);}
.riqi{ color: #A4A4A4;margin-right: auto;}
.btn{ width: 51px;
height: 23px;
background: #F9740C;
border-radius: 4px 4px 4px 4px; color: #fff; font-size: var(--font12); text-align: center; line-height: 23px; margin-left: 4px;}

.deal:hover::before,.deal:hover::after,.deal:hover .route::before{ border-color: #8DCEED;}
/* .deal:hover  .route::after{ background-color: var(--lan);} */

.deal:hover  span{
color:  #F9740C; }

  .deal {transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);  }
.deal:hover{  transform: translateY(-4px); }
.route i{ background: url(../images/home/fj.svg) no-repeat center; line-height: 100px; height: 20px; width: 20px; display: inline-block; overflow: hidden; vertical-align: middle;}
.deal:nth-of-type(9){ display: none;}
.deal{width: calc(100% - 20px);}
  @media screen and (min-width: 540px) and (max-width: 1024px){
 .deal{ width: calc(50% - 20px)}
  }
  @media screen and (min-width: 1024px) and (max-width: 1280px) {

  .deal{ width: calc(33.3% - 20px)}
.deal:nth-of-type(9){ display: flex;}
   }
   @media screen and (min-width: 1281px) {
 .deal{ width: calc(25% - 20px)}
   }
  @media screen and (min-width: 1500px){
 
  }

  /* reviews */

    @media screen and (min-width: 1024px){
   .reviews  .bg{ display: flex;} 
  .reviews .bg > div{ width: 50%; margin-right: 20px;}
  .reviews .bg > div:nth-last-of-type(1){ margin-right: 0;}
   }
   @media screen and (min-width: 1282px){
 
   }
  @media screen and (min-width: 1500px){
 
   }
/* why? */
.features{ display: flex; justify-content: center;text-align: center; padding: 10px 0 10px 0; flex-wrap: wrap;}
.feature_item{width: calc(50% - 40px); margin: 0 20px;  text-align: center; padding-bottom: 20px;}
.features p{ max-width: 180px; margin: 0 auto; padding-top: 8px;}
.feature_item img{ max-width: 100px;}
 
  @media screen and (min-width: 768px){
 .feature_item{   width: calc(25% - 40px);}
 .feature_item img{ max-width: 160px;}
   }
   @media screen and (min-width: 1282px){
 
   }
  @media screen and (min-width: 1500px){
 
   }

  /* 友情链接 */
  .hzhb_link,main .hzhb_link:nth-of-type(odd){ padding-bottom:50px;  background-color: #fff; border-bottom: 1px solid #e7e7e7; }
.hzhb_link .h1_t i.itb{  }
.hzhb_link .h1_t{color:#076cb6 }
.hzhb_link ul{ margin: 0 -5px; width: calc(100% + 10px); display: flex;  flex-wrap: wrap;  border-bottom:none; border-right:none;  }
.hzhb_link li {  position:relative;vertical-align:middle; text-align:center;  border-top:none; border-left:none; line-height:80px; height:80px; float:left; background-color: #fff;}
.hzhb_link li span{ display:none;}
.hzhb_link li img{ vertical-align:middle; max-width:88%; height:auto ; max-height: 60px; object-fit: cover;}
.hzhb_link li:hover span{ position:absolute; top:0; left:0; display:block; width:100%; height:100%; line-height:80px; text-align:center; background:#fff; background:rgba(255,255,255,.9);}
.hzhb_link li::before{ pointer-events: none;position: absolute; content:""; top:5px; left:5px; bottom: 5px; right: 5px; border: 1px solid #e7e7e7; z-index: 10; border-radius: 5px;}
    .hzhb_link li {width:50%;}
    @media screen and (min-width: 480px){
.hzhb_link li {width:33.3%;}
  }
  @media screen and (min-width: 768px){
 
.hzhb_link li {width:25%}
  }
  @media screen and (min-width:1024px){
 

.hzhb_link li {width:20%}
  }
@media screen and (min-width:1280px){
 

 .hzhb_link li {width:14.28%}
  }
     @media screen and (min-width:1500px){
	   
 .hzhb_link li {width:12.5%}
	   }
	    @media screen and (min-width:1700px){
	   
 .hzhb_link li {width:11.1%}
	   }
	    
 
	 
     /* 评价 */
     

/* 瀑布流容器 */
.pingjia_list {   
    padding-top: 10px;
    padding-bottom: 30px;

    column-gap: 20px;
   
}

/* 瀑布流项 */
.pingjia_list .li { position: relative;
    break-inside: avoid; /* 防止内容被分割到不同列 */
    margin-bottom: 20px;
    transition: transform 0.3s ease;
}

.pingjia_list .li:hover {
    transform: translateY(-5px);
}

/* 卡片样式 */
.pingjia_list .card { margin-left: 30px;
    display: block;
    background: white;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.pingjia_list .card:hover {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

/* 标签样式 */
.pingjia_list .tag { 
   
    background-color: #ff6b6b;
    color: white;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: bold;
    z-index: 1;
}

/* 图片样式 */
 
.pj_img img{ width: 40px; height: 40px; object-fit: cover; margin: 0 5px 5px 0;}

 
/* 卡片内容 */
.pingjia_list .card-content {
    padding: 15px;
    position: relative;
}

.pingjia_list .card-content h3 {
    font-size: 18px;
    margin-bottom: 10px;

    font-weight: 600;
    line-height: 1.4;
}

.pingjia_list .meta {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
   opacity: .5;
    margin-bottom: 10px;
}

.pingjia_list .stats {
    display: flex;
    align-items: center;
  
    font-size: 12px;
}.pingjia_list .stats  span{  opacity: .5;}

.pingjia_list .stats i {
      background-image: url(https://cdn.kaytrip.com/kaytrip/style/images/ky_index2015/gonglue/gonglue_02.png);
    background-repeat: no-repeat;
    margin-right: 5px;
    font-size: 14px; 
    width: 22px; height: 18px; vertical-align: middle;
    background-position: 0 -745px;
}
.limore .card{ text-align: center; padding: 40px 0;}
.limore .card h3::before{
    content: "";
    background-position: 0 -547px;
display: block;
   clear: both;
    width: 44px;
    height: 32px;
    margin: 0 auto;
    color: dodgerblue;
    background-image: url(https://cdn.kaytrip.com/kaytrip/style/images/ky_index2015/gonglue/gonglue_02.png);
    background-repeat: no-repeat;
}
@media (min-width: 900px) {
 
}
/* 响应式设计 */
@media (max-width: 900px) {
   
}

@media (max-width: 600px) {

}

 

 .pingjia_list   {
        column-count: 1;
    }
     @media screen and (min-width: 768px){
      .pingjia_list   {
        column-count: 2;
    }
    
   .pingjia_list  .card-content h3 {
        font-size: 16px;
    }
   }
   @media screen and (min-width: 1024px){
    .pingjia_list .card-content h3{ text-align: left;}
    .author{ display: none;}
    
 
  .pingjia_list{ padding-left:  20px;padding-right:  20px;
        column-count: 3;
    }
   }
   @media screen and (min-width: 1282px){
 .pingjia_list {    column-count: 3; /* 默认4列 */}
   }
  @media screen and (min-width: 1500px){
 
   }




.pingjia_list .card{ position: relative; border: 2px solid #fff; border-left: none; border-top: none;}
.pingjia_list .li{  display: block;}
.pingjia_list .li::before,.xc_list .user_info::before{ background-color:#ccc; width: 24px; height: 24px; background-image: url(../images/home/user.svg) ;background-repeat: no-repeat; background-size: contain; position: absolute; top: 0; left: 0; content: ""; border-radius: 50%;}

.pingjia_list .li:nth-of-type(2)::before{ background-color: #FDD585; }
.pingjia_list .li:nth-of-type(2) .card{ background-color: #F7EDDA; }
.pingjia_list .li:nth-of-type(4)::before{ background-color: #E8A5A5; }
.pingjia_list .li:nth-of-type(4) .card{ background-color: #E8A5A5; }
.pingjia_list .li:nth-of-type(4) .card-content h3,.pingjia_list .li:nth-of-type(10) .meta,.pingjia_list .li:nth-of-type(4) .stats{ color: #fff;}

.pingjia_list .li:nth-of-type(5)::before{ background-color: #79C3D7; }
.pingjia_list .li:nth-of-type(5) .card{ background-color: #BFE3ED; }

.pingjia_list .li:nth-of-type(7)::before{ background-color: #B1BCE6; }
.pingjia_list .li:nth-of-type(7) .card{ background-color: #D7E0FF; }

.pingjia_list .li:nth-of-type(10)::before{ background-color: #56ABC1; }
.pingjia_list .li:nth-of-type(10) .card{ background-color: #56ABC1;  }
.pingjia_list .li:nth-of-type(10) .card-content h3,.pingjia_list .li:nth-of-type(10) .meta,.pingjia_list .li:nth-of-type(10) .stats{ color: #fff;}
.pingjia_list .li:nth-of-type(11)::before{ background-color: #ADBC51; }
.pingjia_list .li:nth-of-type(11) .card{ background-color: #EBF4B6; }

/* 团友相册 */
 .xc_list {  
    display: grid;
  
    gap: 18px ;
  }
    .xc_list .map{text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
-webkit-line-clamp: 2;background: rgba(0,0,0,0.3);
border-radius: 9px 9px 0 0; padding: 4px 5px 0 25px; font-size: .6rem;}
  .xc_list .user_info{ position: relative; padding: 4px 5px 4px 25px; font-size: 12px;
background: rgba(0,0,0,0.3);
border-radius:9px;text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
-webkit-line-clamp: 1;}
 .xc_list .map ~ .user_info {border-radius: 0 0 9px 9px;}
  .xc_item { position: relative;
    overflow: hidden;
    position: relative;
    border-radius: 12px; transition: all 0.4s ease-in-out;
  }  .xc_list .user_info::before{   width: 14px; height: 14px; background-color: #2477EF; margin: 7px 0 0 5px;}
.xc_item::before{ display: block; content: ""; padding-top: 72%; }
  .xc_item img {   
    position: absolute; left: 0; top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .xc_item a:hover{  transform: translateY(50%); }
 .xc_item:hover{transform: translateY(-4px); }
  /* 第一个图片设置 */
  .xc_item:first-child {
    grid-row: span 2;}
    .xc_item:first-child::before{
padding-top: 144%; 
  }
  .xc_item a{ transition: all 0.4s ease-in-out;display: flex; flex-direction: column; justify-content: flex-end; position: absolute; top: 0; left: 0; right: 0; bottom: 0; padding: 10px 10px 10px 10px; color: #fff;}

   .xc_list {  
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px ;
  }
  
     @media screen and (min-width: 768px){
   .xc_list { 
    grid-template-columns: repeat(3, 1fr); 
}
   }
   @media screen and (min-width: 1282px){
 
   }
  @media screen and (min-width: 1500px){
 
   }

  /* 攻略 */
  .gonglue_list a {  display: block; position: relative;  margin-top: 18px; 
/* height: 135px; */

} .gonglue_list a:nth-of-type(1){ margin-top: 0;}
  .gonglue_list .img{  width: 40%;min-width: 40%;border-radius: 19px 19px 19px 19px;  }
   .gonglue_list .img::before{  position: absolute; content: "";
    display: inline-block;
    width: 0;
    height: 0;
      border-top: 10px solid transparent ;
    border-bottom: 10px solid transparent ;
    border-left: 10px solid #fff; z-index: 10; top: 20px;}
.gonglue_list .img::after{ padding-top: 75%;}
 .gonglue_list .con{ padding: 20px; display: flex; flex-direction: column; justify-content: center; flex: 1; }

 
 .gonglue_list  a > div{  background: #FFFFFF;
border-radius: 19px ; display: flex; flex-direction: row-reverse;
  overflow: hidden;}

  .gonglue_list h4 {text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
-webkit-line-clamp: 1; text-decoration: underline; margin-bottom: 4px;}
 .gonglue_list p {text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
-webkit-line-clamp: 3; margin: 0; padding: 0;}

    @media screen and (min-width: 1024px){
          .gonglue_list .img{  width: 33.3%;min-width: 33.3%;}
        .gonglue_list a:before{ padding-top: calc(25% - 18px); content: ""; display: block;}
  .gonglue_list  a > div{position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
   }
   @media screen and (min-width: 1282px){
 
   }
  @media screen and (min-width: 1500px){
 
   }


   /* 产品 */
   
.list{ margin: 0 -16px;display: flex; flex-wrap: wrap; }
.list a{ background: #fff; margin: 0 8px 20px 8px; position: relative; width: calc(50% - 16px); border-radius: 18px;}
 .list a::before{ transition: all 0.4s ease-in-out;  content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; border: 1px solid #eee; pointer-events: none;border-radius: 18px; z-index: 9;}
 .list .img,.list .img img{ border-radius: 18px 18px 0 0;}
 .info{ padding: 10px 20px; display: flex; flex-direction: column;}
 .xiangqing{ 
background: #EC3636; padding: 5px 10px; color: #fff; position: absolute; right: 20px; bottom: 20px;
border-radius: 13px 13px 13px 13px; opacity: 0;}
 .list a:hover .xiangqing{ opacity: 1; }
 .list a:hover::before{  border-color: #EC3636; }
  .list .price{ font-size: var(--font12); color:#EC3636 ; margin-bottom: 0; margin-top: auto}
   .list .price b{font-size: var(--font24);}
   .list .price em{ color: #000; font-style: normal;}
  
  @media screen and (min-width: 768px) and (max-width: 1281px){
 .list a{ margin: 0 15px 30px 15px;width: calc(33.3% - 30px)}
  .list4 a:nth-of-type(4){ display: none;}
  .list8 a:nth-of-type(8), .list8 a:nth-of-type(7){ display: none;}
   }
   @media screen and (min-width: 1282px){
  .list a{  width: calc(25% - 30px); margin: 0 15px 30px 15px;}
   }
  @media screen and (min-width: 1500px){
 .list a{margin: 0 18px 36px 18px;  width: calc(25% - 36px);}
  }
   .list h3{text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
-webkit-line-clamp: 2; margin-bottom: auto; font-weight: 400;}
   /* 产品 end */


   .p_tag{    padding: 0 0 20px 0; margin-top:-5px}
   .p_tag a{ padding: 4px 10px; font-size: var(--font14);}
   .p_tag a.this{ background-color: var(--lan); border-radius: 18px; color: #fff;}