@media (max-width:1000px) {
	.main {
		width: 100%;
		height: auto;
		padding: 15px 0;
	}

	.m-title {
		width: 90%;
		height: auto;
		line-height: 1.5;
		font-size: 24px;
		font-weight: 500;
		margin: 10px auto;
		text-align: center;
		color: #30302B;
		font-family: 'Oswald', sans-serif;
		text-transform: uppercase;

	}

	.list1 {
		width: 93%;
		height: auto;
		padding: 15px 0;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;

	}

	.l1-box {
		width: 47%;
		height: auto;
		margin: 0px 2px 20px 6px;

	}

	.l1-img {
		width: 100%;
		height: auto;
		position: relative;
	}

	.l1-img img {
		width: 100%;
		height: 165px;
		/* display: block; */

	}

	.mb {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		/* background-color: #000000; */
		/* background-color: rgba(255,255,255,0.2); */
		/* display: none; */
	}

	.l1-text {
		width: 100%;
		margin: 5px 0 0;
		line-height: 1.5;
		text-align: center;
		font-size: 16px;
		color: #30302B;
		font-family: 'Open Sans';
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
	}

	.l2 {
		width: 100%;
		height: auto;
		background-color: #efedea;
	}

	.list2 {
		width: 90%;
		height: auto;
		padding: 15px 0;
		margin: 0 auto;

	}

	.l2-box {
		width: 100%;
		height: auto;
		margin-bottom: 20px;
	}

	.l2-img {
		width: 100%;
		height: auto;
		position: relative;
	}

	.l2-box img {
		width: 100%;
		height: 260px;
	}

	.l2-text {
		width: 100%;
		height: auto;
		margin-top: 5px;
		line-height: 1.5;
		font-size: 19px;
		text-align: center;
		color: #30302B;
	}

	.list3 {
		width: 90%;
		height: auto;
		margin: 0 auto;
		padding: 15px 0;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}

	.l3-box {
		width: 45%;
		height: auto;
		margin: 0 0 20px;
	}

	.l3-img {
		width: 80px;
		height: 80px;
		border-radius: 100%;
		position: relative;
		margin: 0 auto;

	}

	.l3-img img {
		width: 100%;
		height: 100%;
		border-radius: 100%;
	}

	.l3-text {
		color: #30302B;
		font-size: 15px;
		text-align: center;
		font-family: 'Oswald';
		text-transform: uppercase;
		font-weight: 600;
		line-height: 1.5;

	}

	.l3-box:nth-of-type(3n+1) {
		width: 70%;

	}

	.list4 {
		width: 90%;
		height: auto;
		display: flex;
		flex-wrap: wrap;
		padding: 15px 0;
		margin: 0 auto;
		justify-content: space-between;

	}

	.l4-box {
		width: 47%;
		height: auto;
		margin-bottom: 20px;
		/* margin-left:12px; */
	}

	.l4-box:nth-of-type(3n+1) {
		width: 100%;
		margin: 0 0 20px 0;
		/* background-color: #000000; */
	}

	.l4-box:nth-of-type(3n+1) .l4-img img {
		height: 280px;
	}

	.l4-img {
		width: 100%;
		height: auto;
		position: relative;
	}

	.l4-img img {
		width: 100%;
		height: 180px;
		display: block;
	}

	.l4-text {
		text-align: center;
		font-size: 14px;
		font-family: 'Open Sans';
		line-height: 1.5;
		margin-top: 5px;
		font-weight: 600;
		color: #30302B;

	}

	.l4-box:nth-of-type(3n+1) .l4-text {
		font-size: 18px;
	}
}

@media (min-width:1000px) {
	.main {
		width: 100%;
		height: auto;
		padding: 15px 0;
	}

	.m-title {
		width: 1300px;
		height: auto;
		line-height: 1.5;
		font-size: 27px;
		font-weight: 500;
		margin: 10px auto;
		color: #30302B;
		font-family: 'Oswald', sans-serif;
		text-transform: uppercase;
	}

	.l1,
	.l2,
	.l3 {
		width: 1300px;
		margin: 0 auto;


	}

	.l1 {
		color: #30302B;
		font-size: 15px;
		text-align: center;
		font-family: 'Oswald';
		line-height: 1.5;
	}

	.list1 {
		width: 100%;
		height: auto;
		padding: 15px 0;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;

	}

	.l1-box {
		width: 22%;
		height: auto;
		margin: 0px 12px 20px 24px;

	}

	.l1-img {
		width: 100%;
		height: auto;
		position: relative;
	}

	.l1-img img {
		width: 100%;
		height: 278px;
		/* display: block; */

	}

	.mb {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		/* background-color: #000000; */
		background-color: rgba(255, 255, 255, 0.3);
		display: none;
	}

	.l1-text {
		width: 100%;
		margin: 5px 0 0;
		line-height: 1.5;
		text-align: center;
		font-size: 19px;
		color: #595959;
		font-family: 'Open Sans';
		font-size: 600;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
	}

	.l2 {
		width: 100%;
		height: auto;
		background-color: #efedea;

	}

	.inner-box {
		width: 1300px;
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
	}

	.list2 {
		width: 75%;
		height: auto;
		padding: 15px 0;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;

	}

	.l2-box {
		width: 23%;
		height: auto;
		margin: 0 8px 20px 10px;
	}

	.l2-img {
		width: 100%;
		height: auto;
		position: relative;
	}

	.l2-box img {
		width: 100%;
		height: 300px;
	}

	.l2-text {
		width: 100%;
		height: auto;
		margin-top: 5px;
		line-height: 1.5;
		font-size: 19px;
		text-align: center;
		color: #30302B;
	}

	.list3 {
		width: 20%;
		height: auto;
		margin: 0 auto;
		padding: 15px 0;
		/* display: flex;
		justify-content: center;
		flex-wrap: wrap; */
	}

	.list3 .m-title {
		width: 90%;
		margin: 0;
	}

	.l3-box {
		width: 100%;
		height: auto;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin: 10px auto 20px;
	}

	.l3-img {
		width: 80px;
		height: 80px;
		border-radius: 100%;
		position: relative;
		margin: 0 auto;

	}

	.l3-img img {
		width: 100%;
		height: 100%;
		border-radius: 100%;
	}

	.l3-text {
		width: 75%;
		color: #30302B;
		font-size: 15px;
		text-align: center;
		font-family: 'Oswald';
		text-transform: uppercase;
		font-weight: 600;
		line-height: 1.5;

	}

	.list4 {
		width: 1300px;

		display: flex;
		flex-wrap: wrap;
		padding: 15px 0;
		margin: 0 auto;
		position: relative;

	}

	.l4-box {
		width: 22%;
		height: auto;
		margin: 0 10px 20px 22px;

	}

	.l4-img {
		width: 100%;
		height: auto;
		position: relative;
	}

	.l4-img img {
		width: 100%;
		height: 200px;
		display: block;
	}

	.l4-box:nth-of-type(3n+1) {
		width: 24%;
		margin: 0 0 20px 16px;
	}

	.l4-box:nth-of-type(3n+1) .l4-img img {
		height: 470px;
	}

	.l4-box:nth-of-type(3) {
		position: absolute;
		top: 270px;
		left: 327px;

	}

	.l4-box:nth-of-type(6) {
		position: absolute;
		top: 270px;
		right: 10px;

	}

	.l4-box:nth-of-type(8) {
		position: absolute;
		top: 829px;
		left: 327px;


	}

	.l4-box:nth-of-type(12) {
		position: absolute;
		top: 829px;
		right: 10px;


	}

	.l4-box:nth-of-type(15) {
		position: absolute;
		top: 1380px;
		left: 327px;

	}

	.l4-box:nth-of-type(18) {
		position: absolute;
		top: 1380px;
		right: 10px;


	}

	.l4-box:nth-of-type(21) {
		position: absolute;
		top: 1929px;
		left: 327px;
		/* border: 1px solid red; */
	}

	.l4-text {
		text-align: center;
		font-size: 14px;
		font-family: 'Open Sans';
		line-height: 1.5;
		margin-top: 5px;
		font-weight: 600;
		color: #30302B;

	}

	.l4-box:nth-of-type(3n+1) .l4-text {
		font-size: 18px;
	}

	/* .list4 {
		width: 1300px;
		height: 550px;
		display: flex;
		flex-wrap: wrap;
		padding: 15px 0;
		margin: 0 auto;
		flex-direction: column;
		align-items: center;
		
	}
		
	.l4-box {
		width: 22%;
		height: auto;
		margin: 0 10px 20px 22px;
		
	}
	
	.l4-box:nth-of-type(3n+1) {
		width: 24%;
		margin: 0 0 20px 16px;
	}
	
	.l4-box:nth-of-type(3n+1) .l4-img img {
		height: 470px;
	}
	
	.l4-img {
		width: 100%;
		height: auto;
		position: relative;
	}
	
	.l4-img img {
		width: 100%;
		height: 200px;
		display: block;
	}
	
	.l4-text {
		text-align: center;
		font-size: 14px;
		font-family: 'Open Sans';
		line-height: 1.5;
		margin-top: 5px;
		font-weight: 600;
		color: #30302B;
	
	}
	
	.l4-box:nth-of-type(3n+1) .l4-text {
		font-size: 18px;
	} */
	.l1-box:hover .mb {
		display: block;
	}

	.l2-box:hover .mb {
		display: block;
	}

	.l3-box:hover .mb {
		display: block;
	}

	.l4-box:hover .mb {
		display: block;
	}

}