@charset "utf-8";

.sect1 {

	background: #000000;

	padding: 50px 0;

	color: #fff;

}

.sect1 .container{

	display: flex;

	align-items: center;

}

.sect1 .pic{

	width: 50%;

	order:2;

}

.sect1 .pic img{

	max-width: 80%;

}

.sect1 .text-box{

	width: 50%;

	letter-spacing: 0;



}

.sect1 .text-box .text{

	line-height: 1.5;

	font-size: 24px;

}

.sect1 .sub-title{

	margin: 0 0 20px;

	font-size: 56px;

	font-weight: 900;

}

.sect1 .text-box .text_sm{

	font-size: 20px;

	font-weight: 300;

	margin: 15px 0px;

}

.sect2{

	background: #FFFFFF;

	padding: 50px 0;

}

.sect2 .container{

	display: flex;

	align-items: center;

}

.sect2 .pic{

	width: 50%;

}

.sect2 .text-box{

	width: 50%;

	letter-spacing: 0;

	padding-left: 60px;



}

.sect2 .sub-title{

	margin: 0 0 10px;

	font-weight: 900;

}
.sect2 .text{

	font-size: 24px;

	font-weight: 500;

	line-height: 1.25;

	margin-bottom: 10px;

}
.sect2 .text_sm{

	font-size: 20px;

	font-weight: 300;
}

.sect2 .btn1{

	margin-top: 30px;

}

.products-box {

	display: flex;

	flex-wrap: wrap;

	padding: 15px 7px;

}

.products-box .item{

	width: 50%;

	text-align: center;

	color: #000000;

	padding: 0 7px;

}

.products-box .item .name{

	font-size: 42px;

	font-weight: bold;

	margin:  0 0 10px;

	line-height: 1;

}

.products-box .item .text{

	font-size: 20px;

	font-weight: 500;

	line-height: 1.25;

	margin-bottom: 10px;

	margin-top: 5px;

}

.products-box .item .tag{

	font-weight: 500;

	font-size: 21px;

	display: block;

	margin-bottom: 20px;

}	

.products-box .item .box{

	position: relative;

	background: #FFFFFF;

	padding: 50px 10px 26px;

	height: 100%;

}

.products-box .item:nth-child(4n+3) .box{

	background: #eee;

}

.products-box .item:nth-child(4n+2) .box{

	background: #eee;

}

.products-box .item:nth-child(4n+1) .box{

	background: #eee;

}

.products-box .item:nth-child(4n) .box{

	background: #eee;

}

.products-box .item .box .cover{

	position: absolute;

	opacity: 0;

	top: 0;

	left: 0;

	bottom: 0;

	right: 0;

}



@media screen and (max-width: 1440px){

	.sect1 {
	
		padding: 65px 0;
	
	}

	.sect1 .sub-title{

		font-size: 42px;

	}

	.sect2{

		padding: 65px 0;
	
	}
	.products-box .item .name{

		font-size: 36px;
	
	}

}

@media(max-width: 1299px){
	.sect1 .sub-title{

		font-size: 36px;

	}
	.sect1 .text-box .text{

		font-size: 20px;
	}
	.sect1 .text-box .text_sm{

		font-size: 18px;
	}
	.sect2 .text{

		font-size: 20px;

	}
	.sect2 .text_sm{

		font-size: 18px;
	}
	.products-box .item .name{

		font-size: 28px;
	
	}
	.products-box .item .text{

		font-size: 18px;
	
	}
}

@media screen and (max-width: 1024px){

	.sect1 {
	
		padding: 50px 0;
	
	}

	.sect1 .sub-title{

		font-size: 28px;

	}

	.sect1 .text-box .text{

		font-size: 18px;
	}
	.sect1 .text-box .text_sm{

		font-size: 16px;

		margin: 10px 0px;
	}
	.sect2 .text{

		font-size: 18px;

	}
	.sect2 .text_sm{

		font-size: 16px;
	}
	.sect1 .container,

	.sect2 .container{

		flex-wrap: wrap;

	}

	.sect1 .text-box,.sect1 .pic,

	.sect2 .pic,.sect2 .text-box{

		width: 100%;

		padding: 0;

	}

	.sect2{

		padding: 50px 0;
	
	}

	.sect2 .text-box,.sect1 .text-box{

		order: 2

	}

	.products-box .item .name{

		font-size: 24px;

	}

	.sect2 .btn1{

		margin-top: 20px;
	
	}

	.products-box .item .tag{

		font-size: 18px;

	}

}
@media(max-width: 991px){
	.sect1{
		
		padding: 30px 0;

	}
	.sect2{

		padding: 30px 0;

		margin: 5px 0px;
	
	}
	.sect2 .text_sm{

		display: none;
	}
	.sect2 .btn1{

		margin-top: 10px;

	}
	.products-box{

		display: block;

		padding: 0px;

	}
	.products-box .item{

		width: 100%;

		padding: 5px 0px;

	}
	.products-box .item .box{

		padding: 30px;

		display: flex;

		flex-direction: column;

	}
	.products-box .item .box .t_block{

		display: block;

		order: 2;

		text-align: left;

	}
	.products-box .item .name{

		font-size: 28px;

	}
	.products-box .item .tag{

		margin: 10px 0px 0px 0px;
	}
	.products-box .item .pic{

		display: block;

		order: 1;
	}
}
@media(max-width: 500px){
	.sect1 .sub-title{

		font-size: 24px;

	}
	.sect2 .sub-title{

		font-size: 24px;
		
	}
	.sect2 .text{

		font-size: 16px;

	}
	.products-box .item .name{

		font-size: 24px;

	}
	.products-box .item .text{

		font-size: 16px;

	}
}