body {
  background: #F9F9F9;
}



.body_fr {
    width: 10.33rem;
    height: 9.23rem;
    /*background: #FFFFFF;*/
    border-radius: 0.2rem 0.2rem 0.2rem 0.2rem;
}
.body_fr_top{
    display: flex;
    justify-content: space-between;
    width: 9.83rem;
    
    height: 3.67rem;
    margin: 0 auto;
}
.body_fr_top_right{
    width: 4.38rem;
/*height: 3.67rem;*/
background: #FFFFFD;
border-radius: 0.1rem 0.1rem 0.1rem 0.1rem;
border: 0.01rem solid #EDEDED;
display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.41rem
}
.body_fr_top_right > img{
    width: 3.85rem;
    height: 2.87rem;
}
.body_ft_t > p:nth-of-type(1){
    width: 1.6rem;
    height: 0.5rem;
    background: linear-gradient( 180deg, #8965F6 0%, #4D40B2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.41rem;
    border-radius: 25px;
}
.body_ft_t > p:nth-of-type(1) > img{
    width: 0.26rem;
    height: 0.26rem;
    margin-right: 0.055rem;
}
.body_ft_t > p:nth-of-type(1) > span{
    width: 0.76rem;
height: 0.26rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: bold;
font-size: 0.19rem;
color: #FFFFFF;
line-height: 0.23rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-left: 0.055rem;
}
.body_ft_t > p:nth-of-type(2){
    width: 5.2rem;
height: 0.75rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: 400;
font-size: 0.16rem;
color: #2E2E2E;
line-height: 0.27rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-top: 0.18rem;
}
.body_fr_bot{
    width: 9.83rem;
    /*height: 4.18rem;*/
    height: auto;
    margin:0.42rem auto 0;
    /*border: 1px solid black;*/
}
.body_fr_bot_img{
    width: 100%;
    /*height: 100%;*/
    display: flex;
    flex-wrap: wrap;
    /*justify-content: space-between;*/
    align-content: space-between;
}
.body_fr_bot_img img{
    width: 3.14rem;
    height: 2.03rem;
    margin-left: 0.2rem;
    margin-bottom: 0.1rem;
    border-radius: 0.1rem;
}

.body_fr_bot_img img:nth-child(3n+1){
    margin-left: 0;
}
 .type_name {
  max-width: 9.2rem;
  height: 1.87rem;
  margin: 0 auto;
  font-weight: 600;
  font-size: 0.36rem;
  color: #000000;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.body_fr_hw{
    width: 10.33rem;
height: 6.33rem;
background: #FFFFFF;
border-radius: 0.2rem 0.2rem 0.2rem 0.2rem;
display: flex;
flex-direction: column;
}

.body_fr_hw_top{
    width: 9.83rem;
    height: 3.3rem;
    margin: 0 auto;
}
.body_fr_hw_bot{
    width: 9.83rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
}

.body_fr_hw_bot_t > p:nth-of-type(1){
    width: 1.6rem;
    height: 0.5rem;
    background: linear-gradient( 180deg, #8965F6 0%, #4D40B2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.41rem;
    border-radius: 25px;
}
.body_fr_hw_bot_t > p:nth-of-type(1) > img{
    width: 0.26rem;
    height: 0.26rem;
    margin-right: 0.055rem;
}
.body_fr_hw_bot_t > p:nth-of-type(1) > span{
    width: 0.76rem;
height: 0.26rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: bold;
font-size: 0.19rem;
color: #FFFFFF;
line-height: 0.23rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-left: 0.055rem;
}
.body_fr_hw_bot_b{
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.body_fr_hw_bot_b > p{
    width: 4.51rem;
height: 1.4rem;
margin-top: 0.4rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: 400;
font-size: 0.16rem;
color: #555555;
line-height: 0.25rem;
text-align: left;
font-style: normal;
text-transform: none;
border-bottom: 0.01rem solid #DEDEDE;
}




.body_fr_hw_bot_b > p > span{

width: 1rem;
height: 0.33rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: 600;
font-size: 0.25rem;
color: #000000;
line-height: 0.2rem;
text-align: center;
font-style: normal;
text-transform: none;

}
.hw_top_left > div{
    height: 2.17rem;
    position: relative;
    display: flex;
    flex-direction: column;
}
.hw_top_left > div > .lbt{
    width: 4.5rem;
    height: 2.17rem;
    /*border: 1px solid black;*/
    position: absolute;
    left: 5rem;
}

.hw_top_left > div > .lbt.flex{
    display: flex;
    justify-content: space-between;
    gap: 0.1rem;
    left: 4.63rem;
    top: 0.37rem;
}

.lbt_img:first-child{
    width:2.92rem;
    height: 100%;
    object-fit: cover;
    border-radius: 0.1rem;
}

.lbt_img:last-child{
    width:2.18rem;
    height: 100%;
    object-fit: cover;
    border-radius: 0.1rem;
}


.highlighted{
    color: rgba(248, 172, 0, 1);
    font-weight: 600;
}
.swiper-slide > img{
    width: 100%;
    height: 100%;
}
.hw_top_left > p:nth-of-type(1){
    width: 1.6rem;
    height: 0.5rem;
    background: linear-gradient( 180deg, #8965F6 0%, #4D40B2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.41rem;
    border-radius: 25px;
}
.hw_top_left > p:nth-of-type(1) > img{
    width: 0.26rem;
    height: 0.26rem;
    margin-right: 0.055rem;
}
.hw_top_left > p:nth-of-type(1) > span{
    width: 0.76rem;
height: 0.26rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: bold;
font-size: 0.19rem;
color: #FFFFFF;
line-height: 0.23rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-left: 0.055rem;
}
.hw_top_left > div > p:nth-of-type(1){
    display: inline-block;
    width: 3.37rem;
height: 0.27rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: bold;
font-size: 0.2rem;
color: #3F38A1;
line-height: 0.35rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-top: 0.59rem;
}
.hw_top_left > div > p:nth-of-type(2){
    width: 3.22rem;
height: 0.59rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: 400;
font-size: 0.18rem;
color: #2E2E2E;
line-height: 0.35rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-top: 0.22rem;
}
.hw_top_left > div > p:nth-of-type(2) span{
    color: #3F38A1;
}
.hw_top_left > div > p:nth-of-type(3){
    width: 3.22rem;
height: 0.59rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: 400;
font-size: 0.18rem;
color: #2E2E2E;
line-height: 0.35rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-top: 0.22rem;
}
.hw_top_left > div > p:nth-of-type(3) span{
    color: #3F38A1;
}
.body_fr_md{
   width: 10.33rem;
height: 10.28rem;
background: #FFFFFF;
border-radius: 0.2rem 0.2rem 0.2rem 0.2rem;
display: flex;
flex-direction: column;
}
.body_fr_md_top{
    width: 9.83rem;
    margin: 0 auto;
}
.body_fr_md_top_t{
    border-bottom: 1px dashed #d5d5d5;
    padding-bottom: 0.4rem;
    /*height: 3rem;*/
}

.body_fr_md_top_t > p:nth-of-type(1){
    width: 1.6rem;
    height: 0.5rem;
    background: linear-gradient( 180deg, #8965F6 0%, #4D40B2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.41rem;
    border-radius: 25px;
}
.body_fr_md_top_t > p:nth-of-type(1) > img{
    width: 0.26rem;
    height: 0.26rem;
    margin-right: 0.055rem;
}
.body_fr_md_top_t > p:nth-of-type(1) > span{
    width: 0.76rem;
height: 0.26rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: bold;
font-size: 0.19rem;
color: #FFFFFF;
line-height: 0.23rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-left: 0.055rem;
}
.body_fr_md_top_t > div > p:nth-of-type(1){
    width: 5.53rem;
height: 0.27rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: bold;
font-size: 0.2rem;
color: #3F38A1;
line-height: 0.35rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-top: 0.4rem;
}
.body_fr_md_top_t > div > p:nth-of-type(2){
    width: 5.53rem;
height: 0.24rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: 400;
font-size: 0.18rem;
color: #2E2E2E;
line-height: 0.35rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-top: 0.17rem;
}
.body_fr_md_top_t > div > p:nth-of-type(3){
    width: 100%;
/*height: 0.21rem;*/
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: 400;
font-size: 0.16rem;
color: #2E2E2E;
line-height: 0.25rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-top: 0.15rem;
display: flex;
    /*justify-content: space-between;*/
}
.body_fr_md_top_t > div > p:nth-of-type(3)>span:last-child{
    margin-left: 1rem;
}
.body_fr_md_top_t > div > p span{
    line-height: 0.3rem;
}

.body_fr_md_top_b > p:nth-of-type(1){
    width: 1.6rem;
    height: 0.5rem;
    background: linear-gradient( 180deg, #8965F6 0%, #4D40B2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.41rem;
    border-radius: 25px;
}
.body_fr_md_top_b > p:nth-of-type(1) > img{
    width: 0.26rem;
    height: 0.26rem;
    margin-right: 0.055rem;
}
.body_fr_md_top_b > p:nth-of-type(1) > span{
    width: 0.76rem;
height: 0.26rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: bold;
font-size: 0.19rem;
color: #FFFFFF;
line-height: 0.23rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-left: 0.055rem;
}
.body_fr_md_top_b_img{
    width: 9.83rem;
    height: 5.15rem;
}
.body_fr_md_top_b_img{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between;
    margin-top: 0.4rem;
}
.body_fr_md_top_b_img div{
    width: 3.15rem;
    height: 2.44rem;
    /*border: 1px solid black;*/
    position: relative;
}
.body_fr_md_top_b_img div > img{
    width: 100%;
    height: 100%;
    position: absolute;
}
.body_fr_md_top_b_img div > p{
    width: 1.87rem;
height: 0.36rem;
background: #FFFFFF;
border-radius: 0.04rem 0.04rem 0.04rem 0.04rem;
position: relative;

font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: bold;
font-size: 0.16rem;
color: #3F38A1;
line-height: 0.19rem;
text-align: left;
font-style: normal;
text-transform: none;
display: flex;
align-items: center;
padding-left: 0.11rem;
position: absolute;
top: 1rem;
left: 0.1rem;
z-index: 2;
}
.body_fr_md_top_b_img div > div{
    width: 3.15rem;
height: 1.24rem;
background: #000000;
border-radius: 0rem 0rem 0.1rem 0.1rem;
opacity: 0.7;
position: relative;
top: 1.2rem;
display: flex;
    flex-direction: column;
}
.body_fr_md_top_b_img div > div>span:first-child>span:first-child{
    display: inline-block;
    margin-right: 5px;
}

.body_fr_md_top_b_img div > div > span:nth-of-type(1){
    width: 2.84rem;
/*height: 0.19rem;*/
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: 400;
font-size: 0.14rem;
color: #FFFFFF;
line-height: 0.15rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-top: 0.29rem;
margin-left: 0.1rem;
}
.body_fr_md_top_b_img div > div > span:nth-of-type(2){
    width: 2.84rem;
height: 0.39rem;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: 400;
font-size: 0.14rem;
color: #FFFFFF;
line-height: 0.2rem;
text-align: left;
font-style: normal;
text-transform: none;
margin-left: 0.1rem;
}





.type_content {
  display: flex;
  justify-content: space-between;
}

.cont_list {
  width: 3.44rem;
}

.cont_list .cont_li {
  width: 100%;
  height: 2.45rem;
  background-size: cover !important;
  overflow: hidden;
  border: 0.01rem dashed #999;
  cursor: pointer;
  position: relative;
}

.cont_li .cont_li_top {
  width: 100%;
  height: 100%;
  padding: 0.28rem 0.32rem;
  box-sizing: border-box;
  background-color: rgba(0, 0, 0, 0.5);
    position: absolute;
  bottom: 0;
}

.cont_li .cont_li_top .cont_class {
  font-weight: 400;
  font-size: 0.16rem;
  color: #FFFFFF;
  line-height: 0.35rem;
  display: flex;
  align-items: center;
}

.cont_li .cont_li_top .cont_class img {
  width: 0.15rem;
  height: 0.15rem;
  margin-left: 0.05rem;
}

.cont_li .cont_li_top .cont_title {
  font-weight: 600;
  font-size: 0.25rem;
  color: #FFFFFF;
  line-height: 0.35rem;
}
.cont_li .cont_li_top:hover .cont_class,
.cont_li .cont_li_top:hover .cont_title{
  color: #F8AC00;
}

.cont_li .cont_li_bottom{
      width: 100%;
      height: 100%;
      background-color: rgba(63, 56, 161, 0.8);
      padding: 0.43rem 0.34rem 0.46rem 0.37rem;
      box-sizing: border-box;
      position: absolute;
      top: 100%;
      transition: 0.5s;
}
.cont_li .cont_li_bottom .cont_class {
  font-weight: 600;
  font-size: 0.26rem;
  color: #FFFFFF;
  display: flex;
  align-items: center;
}

.cont_li .cont_li_bottom .cont_class img {
  width: 0.22rem;
  height: 0.22rem;
  margin-left: 0.11rem;
}

.cont_li .cont_li_bottom .cont_title {
  font-weight: 600;
  font-size: 0.26rem;
  color: #FFFFFF;
}
.cont_li .cont_more {
  width: 1.37rem;
  height: 0.43rem;
  background: #FFFFFF;
  border-radius: 0.25rem;
  line-height: 0.43rem;
  text-align: center;
  font-weight: 400;
  font-size: 0.13rem;
  color: #3F38A1;
  display: block;
  position: absolute;
  bottom: 0.46rem;
}
.cont_li:hover .cont_li_top{
	bottom: 100%;
	transition: 0.5s;
}
.cont_li:hover .cont_li_bottom{
	top: 0;
	transition: 0.5s;
}












.style1 {
  height: 4.91rem !important;
  position: relative;
  overflow: hidden;
}
.style1 .cont_li_top{
  position: absolute;
  bottom: 0;
  transition: 0.5s;
}
.style1 .cont_li_bottom {
  width: 100%;
  height: 100%;
  background-color: rgba(63, 56, 161, 0.8);
  padding: 0.43rem 0.34rem 0.46rem 0.37rem;
  box-sizing: border-box;
  position: absolute;
  top: 100%;
  transition: 0.5s;
}

.style1 .cont_li_bottom .cont_class {
  font-weight: 600;
  font-size: 0.29rem;
  color: #FFFFFF;
  display: flex;
  align-items: center;
}

.style1 .cont_li_bottom .cont_class img {
  width: 0.22rem;
  height: 0.22rem;
  margin-left: 0.11rem;
}

.style1 .cont_li_bottom .cont_title {
  font-weight: 600;
  font-size: 0.29rem;
  color: #FFFFFF;
}

.style1 .cont_li_bottom .cont_name {
  width: 100%;
  border-top: 0.01rem solid #fff;
  padding-top: 0.31rem;
  margin-top: 0.22rem;
  font-weight: 400;
  font-size: 0.16rem;
  color: #FFFFFF;
  line-height: 0.35rem;
}

.style1 .cont_more {
  width: 1.37rem;
  height: 0.43rem;
  background: #FFFFFF;
  border-radius: 0.25rem;
  line-height: 0.43rem;
  text-align: center;
  font-weight: 400;
  font-size: 0.13rem;
  color: #3F38A1;
  display: block;
  position: absolute;
  bottom: 0.46rem;
}

.style1:hover .cont_li_top{
	bottom: 100%;
	transition: 0.5s;
}
.style1:hover .cont_li_bottom{
	top: 0;
	transition: 0.5s;
}
@media screen and (max-width: 1024px){
    .type_content{
        width: 100%;
    }    
    .cont_li .cont_li_top .cont_class{
        font-size: 0.26rem;
    }
    .cont_li .cont_li_top .cont_title{
        font-size: 0.24rem;
    }
    .body_fr_md{
        width: 95vw;
        height: auto;
        padding-bottom: 10px;
    }
    .body_fr_md_top{
        width: 90vw;
    }
    .body_fr_bot{
        width: 100%;
    }
    .body_fr_md_top_t > div > p:nth-of-type(1){
        font-size: 14px;
        width: 100%;
        height: auto;
    }
    .body_fr_md_top_t > div > p:nth-of-type(3){
        flex-direction: column;
    }
    .body_fr_md_top_t > div > p:nth-of-type(3)>span:last-child{
        margin-left: 0;
    }
    .body_fr_md_top_t > div > p span{
        font-size: 14px;
    }
    .body_fr_hw_bot_b > p{
        font-size: 14px;
        line-height: 1.4;
    }
    .body_fr_bot_img img{
        margin-left: 0;
    }
    .body_fr_bot_img{
        justify-content: space-between;
    }
    .body_fr{
        height: auto;
    }
    .body_fr_top{
        width: 90vw;
        height: auto;
        flex-direction: column;
    }
    .body_ft_t > p:nth-of-type(2){
        width: 100%;
        height: auto;
        font-size: 14px;
        line-height: 1.4;
    }
    .body_fr_md_top_b_img{
        width: 100%;
        height: auto;
        row-gap: 10px;
    }
    .body_fr_hw{
        width: 95vw;
        height: auto;
        padding-bottom: 20px;
    }
    .body_fr_hw_top{
        width: 90vw;
        height: auto;
    }
    .hw_top_left > div{
        height: auto;
    }
    .hw_top_left > div > .lbt{
        position: static;
        margin: 10px 0;
    }
    .hw_top_left > div > p:nth-of-type(1),
    .hw_top_left > div > p:nth-of-type(2),
    .hw_top_left > div > p:nth-of-type(3){
        font-size: 14px;
        width: 100%;
        height: auto;
        line-height: 1.4;
    }
    .body_fr_hw_bot{
        width: 90vw;
    }
    .body_fr_hw_bot_b{
        flex-direction: column;
    }
    
    .body_fr_hw_bot_b > p{
        width: 100%;
        height: auto;
        font-size: 14px;
        line-height: 1.4;
        padding-bottom: 10px;
    }
    .body_fr_md_top_t > div > p:nth-of-type(2){
        width: 100%;
        height: auto;
        font-size: 14px;
        line-height: 1.4;
    }
    .style1 .cont_li_bottom{
        padding: 5px;
    }
    .cont_li .cont_li_bottom .cont_title{
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}