@media screen and (min-width: 1024px) {
	body{
	 background: #f7f7f7;
	}
	.content{
        width: 100%;
        background-color: #fff;
        display: flex;
        padding-bottom: 0.6rem;
    }
    
    .techContent{
        width: 12rem;
        margin: auto;
        margin-top: 0;
        display: flex;
        flex-direction: column;
    }
    .techContent h1{
        /* color: #333333; */
        /* font-weight: 600; */
        /* font-size: 0.24rem; */
        margin: auto;
        margin-top: 0.6rem;
        margin-bottom: 0;
        /* border-bottom: 2px solid #3B7CFF; */
        padding-bottom: 10px;
        caret-color: transparent;

		font-size: 0.36rem;
		font-family: Microsoft YaHei, Microsoft YaHei-Bold;
		font-weight: 700;
		color: #333333;
		letter-spacing: 3.6px;
    }
    .techContent h2{
        /* color: #666666; */
        /* font-size: 0.2rem; */
        margin: auto;
        margin-top: 10px;
        margin-bottom: 0;
        /* font-weight: 400; */
        caret-color: transparent;

		font-size: 0.2rem;
		font-family: DIN-BoldItalic, DIN-BoldItalic-Regular;
		font-weight: 400;
		/* text-align: left; */
		color: #bcc5d6;
		/* line-height: 36px; */
    }
    .techlist{
        width: 100%;
        display: flex;
        justify-content: space-between;
        margin: auto;
        margin-top: 0.4rem;
    }
    .techlistMo{
        display: none;
    }
    .techli{
        /* width: 3.8rem; */
        display: flex;
        flex-direction: column;
        margin: auto;
        margin-left: 0;
        margin-right: 0;
        cursor: pointer;

		width: 3.8rem;
		height: 3.6rem;
		background: #ffffff;
		border: 1px solid #f3f3f3;
		
		box-sizing: border-box;
		padding: 0.44rem 0.4rem;
    }
	.techli:hover{
		box-shadow: 0px 5px 10px 0px rgba(132,132,132,0.16);
	}
	.techli img{
		width: 0.6rem;
		height: 0.6rem;
		margin: auto;
		margin-top: 0;
		margin-bottom: 0;
	}
	.c1title{
		font-size: 0.22rem;
		font-family: Microsoft YaHei, Microsoft YaHei-Bold;
		font-weight: 700;
		color: #333333;
		margin: auto;
		margin-top: 0.2rem;
		margin-bottom: 0;
	}
	.c1line{
		width: 100%;
		height: 1px;
		background: #f3f3f3;
		margin: auto;
		margin-top: 0.2rem;
		margin-bottom: 0;
		flex-shrink: 0;
	}
	.c1desc{
		font-size: 0.16rem;
		font-family: Microsoft YaHei, Microsoft YaHei-Regular;
		font-weight: 400;
		color: #999999;
		line-height: 0.32rem;
		margin: auto;
		margin-top: 0.10rem;
	}
	.content2{
		width: 100%;
        background-color: #F9FBFE;
        display: flex;
        /* padding-bottom: 0.6rem; */
	}
	.dnoyixi{
		width: 100%;
        /* background-color: #F9FBFE; */
        display: flex;
		flex-direction: column;
        padding-bottom: 0.6rem;
		margin-top: 0.4rem;
	}
	.yixibox{
		width: 12rem;
        margin: auto;
        margin-top: 0;
		margin-bottom: 0.3rem;
        display: flex;
	}
	.yxLeft{
		width: 0.1rem;
		height: 1.4rem;
		background: linear-gradient(180deg,#62c2ff, #3c80ff);
		margin: auto;
		border-radius:  0.06rem 0px 0px 0.06rem ;
		
	}
	.yxright{
		width: calc(100% - 0.1rem);
		height: 1.4rem;
		background: #ffffff;
		border-radius: 0px 0.06rem 0.06rem 0px;
		margin: auto;
		box-sizing: border-box;
		padding: 0.39rem;
		display: flex;
	}
	.yxicon{
		width: 0.64rem;
		height: 0.64rem;
		margin: auto;
		margin-left: 0;
		margin-right: 0.49rem;
	}
	.yxdesc{
		font-size: 0.18rem;
		font-family: Microsoft YaHei, Microsoft YaHei-Regular;
		font-weight: 400;
		text-align: left;
		color: #333333;
		line-height: 0.33rem;
		margin: auto;
		margin-top: 0;
		margin-left: 0;	
	}
	.sflist{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-top: 0.5rem;
	}
	.sfli{
		width: 3.9rem;
		height: 4.2rem;
		border-radius: 0.1rem;
		margin: auto;
		margin-left: 0;
		margin-right: 0;
		position: relative;
		display: flex;
		margin-bottom: 0.4rem;
	}
	.empty{
		width: 3.9rem;
		height: 0;
		margin: auto;
		margin-left: 0;
		margin-right: 0;
	}
	.sfimg{
		width: 100%;
		height: 100%;
	}
	.sftitle{
		width: 100%;
		opacity: 0.8;
		background: linear-gradient(180deg,rgba(12,29,59,0.00), #0c1d3b);
		border-radius: 0px 0px 0.1rem 0.1rem;
		box-sizing: border-box;
		padding: 0.3rem;
		position: absolute;
		bottom: 0;
		left: 0;
		display: flex;
		padding-right: 0;
	}
	.sficon{
		width: 0.24rem;
		height: 0.24rem;
		margin: auto;
		margin-left:0;
		margin-right: 0;
		flex-shrink: 0;
	}
	.sftitleDesc{
		font-size: 0.24rem;
		font-family: Microsoft YaHei, Microsoft YaHei-Bold;
		font-weight: 700;
		color: #ffffff;
		line-height: 0.36rem;
		letter-spacing: 2.4px;
		margin: auto;
		margin-left: 0.12rem;
	}
	.sfHoverDiv{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(12,29,59,0.8);
		box-sizing: border-box;
		padding: 1rem 0.3rem 0 0.3rem;
		display: none;
		flex-direction: column;
		border-radius: 0.1rem;
	}
	.sfHTop{
		width: 100%;
		display: flex;
	}
	.sfHdesc{
		font-size: 0.14rem;
		font-family: Microsoft YaHei, Microsoft YaHei-Regular;
		font-weight: 400;
		text-align: left;
		color: #ffffff;
		line-height: 0.26rem;
		margin-top: 0.2rem;
	}
	.sfli:hover .sftitle{
		display: none;
	}
	.sfli:hover .sfHoverDiv{
		display: flex;
	}
}

@media screen and (max-width: 1023px) {
	body{
		background: #f7f7f7;
		padding-top: 0.8rem;
	   }
	   .content{
		   width: 100%;
		   background-color: #fff;
		   display: flex;
		   padding-bottom: 0.6rem;
	   }
	   
	   .techContent{
		   width: 100%;
		   margin: auto;
		   margin-top: 0;
		   display: flex;
		   flex-direction: column;
	   }
	   .techContent h1{
		   /* color: #333333; */
		   /* font-weight: 600; */
		   /* font-size: 0.24rem; */
		   margin: auto;
		   margin-top: 0.6rem;
		   margin-bottom: 0;
		   /* border-bottom: 2px solid #3B7CFF; */
		   padding-bottom: 10px;
		   caret-color: transparent;
   
		   font-size: 0.36rem;
		   font-family: Microsoft YaHei, Microsoft YaHei-Bold;
		   font-weight: 700;
		   color: #333333;
		   letter-spacing: 3.6px;
	   }
	   .techContent h2{
		   /* color: #666666; */
		   /* font-size: 0.2rem; */
		   margin: auto;
		   margin-top: 10px;
		   margin-bottom: 0;
		   /* font-weight: 400; */
		   caret-color: transparent;
   
		   font-size: 0.2rem;
		   font-family: DIN-BoldItalic, DIN-BoldItalic-Regular;
		   font-weight: 400;
		   /* text-align: left; */
		   color: #bcc5d6;
		   /* line-height: 36px; */
	   }
	   .techlist{
		   width: 100%;
		   display: flex;
		   flex-direction: column;
		   justify-content: space-around;
		   margin: auto;
		   margin-top: 0.4rem;
		   padding: 0 0.2rem;
		   box-sizing: border-box;
	   }
	   .techlistMo{
		   display: none;
	   }
	   .techli{
		   /* width: 3.8rem; */
		   display: flex;
		   flex-direction: column;
		   margin: auto;
		   margin-left: 0;
		   margin-right: 0;
		   margin-top: 0;
		   margin-bottom: 0.3rem;
		   cursor: pointer;
   
		   width: 100%;
		   height: auto;
		   background: #ffffff;
		   border: 1px solid #ebebeb;
		   
		   box-sizing: border-box;
		   padding: 0.3rem 0.3rem;
	   }
	   .techli:hover{
		   box-shadow: 0px 5px 10px 0px rgba(132,132,132,0.16);
	   }
	   .techli img{
		   width: 0.6rem;
		   height: 0.6rem;
		   margin: auto;
		   margin-top: 0;
		   margin-bottom: 0;
	   }
	   .c1title{
		   font-size: 0.26rem;
		   font-family: Microsoft YaHei, Microsoft YaHei-Bold;
		   font-weight: 700;
		   color: #333333;
		   margin: auto;
		   margin-top: 0.2rem;
		   margin-bottom: 0;
	   }
	   .c1line{
		   width: 100%;
		   height: 1px;
		   background: #f3f3f3;
		   margin: auto;
		   margin-top: 0.3rem;
		   margin-bottom: 0;
	   }
	   .c1desc{
		   font-size: 0.24rem;
		   font-family: Microsoft YaHei, Microsoft YaHei-Regular;
		   font-weight: 400;
		   color: #999999;
		   line-height: 0.42rem;
		   margin: auto;
		   margin-top: 0.3rem;
	   }
	   .content2{
		   width: 100%;
		   background-color: #F9FBFE;
		   display: flex;
		   box-sizing: border-box;
		   padding: 0 0.2rem;
		   /* padding-bottom: 0.6rem; */
	   }
	   .dnoyixi{
		   width: 100%;
		   /* background-color: #F9FBFE; */
		   display: flex;
		   flex-direction: column;
		   padding-bottom: 0.6rem;
		   margin-top: 0.4rem;
	   }
	   .yixibox{
		   width: 100%;
		   margin: auto;
		   margin-top: 0;
		   margin-bottom: 0.3rem;
		   display: flex;
	   }
	   .yxLeft{
		   width: 0.1rem;
		   height: 1.4rem;
		   background: linear-gradient(180deg,#62c2ff, #3c80ff);
		   margin: auto;
		   border-radius:  0.06rem 0px 0px 0.06rem ;
		   
	   }
	   .yxright{
		   width: calc(100% - 0.1rem);
		   height: auto;
		   background: #ffffff;
		   border-radius: 0px 0.06rem 0.06rem 0px;
		   margin: auto;
		   box-sizing: border-box;
		   padding: 0.39rem;
		   display: flex;
	   }
	   .yxicon{
		width: 0.64rem;
		height: 0.64rem;
		   margin: auto;
		   margin-right: 0.49rem;
	   }
	   .yxdesc{
		   font-size: 0.24rem;
		   font-family: Microsoft YaHei, Microsoft YaHei-Regular;
		   font-weight: 400;
		   text-align: left;
		   color: #333333;
		   line-height: 0.4rem;
		   margin: auto;
		   margin-top: 0;
	   }
	   .sflist{
		   width: 100%;
		   display: flex;
		   flex-wrap: wrap;
		   justify-content: space-around;
		   margin-top: 0.3rem;
	   }
	   .sfli{
		   width: 48%;
		   height: 3.6rem;
		   border-radius: 0.1rem;
		   margin: auto;
		   margin-left: 0;
		   margin-right: 0;
		   position: relative;
		   display: flex;
		   margin-bottom: 0.4rem;
	   }
	   .empty{
		width: 43%;
		   height: 0;
		   margin: auto;
		   margin-left: 0;
		   margin-right: 0;
	   }
	   .sfimg{
		   width: 100%;
		   height: 100%;
	   }
	   .sftitle{
		   width: 100%;
		   opacity: 0.8;
		   background: linear-gradient(180deg,rgba(12,29,59,0.00), #0c1d3b);
		   border-radius: 0px 0px 0.1rem 0.1rem;
		   box-sizing: border-box;
		   padding: 0.3rem;
		   position: absolute;
		   bottom: 0;
		   left: 0;
		   display: flex;
	   }
	   .sficon{
		   width: 0.24rem;
		   height: 0.24rem;
		   margin: auto;
		   margin-left:0;
		   margin-right: 0;
		   flex-shrink: 0;
	   }
	   .sftitleDesc{
		   font-size: 0.24rem;
		   font-family: Microsoft YaHei, Microsoft YaHei-Bold;
		   font-weight: 700;
		   color: #ffffff;
		   line-height: 0.36rem;
		   letter-spacing: 2.4px;
		   margin: auto;
		   margin-left: 0.12rem;
	   }
	   .sfHoverDiv{
		   position: absolute;
		   top: 0;
		   left: 0;
		   width: 100%;
		   height: 100%;
		   background-color: rgba(12,29,59,0.8);
		   box-sizing: border-box;
		   padding: 0.25rem;
		   display: none;
		   flex-direction: column;
		   border-radius: 0.1rem;
	   }
	   .sfHTop{
		   width: 100%;
		   display: flex;
	   }
	   .sfHdesc{
		   font-size: 0.22rem;
		   font-family: Microsoft YaHei, Microsoft YaHei-Regular;
		   font-weight: 400;
		   text-align: left;
		   color: #ffffff;
		   line-height: 0.35rem;
		   margin-top: 0.2rem;
	   }
	   .sfli:hover .sftitle{
		   display: none;
	   }
	   .sfli:hover .sfHoverDiv{
		   display: flex;
		   overflow: auto;
	   }
}

