/*************************************
 	business-trade.css
*************************************/

#business-trade{
	p{
		font-size: 1.6rem;
		line-height: 2.8rem;
	}

.needs{
	margin-bottom: 90px;
	
	@media screen and (max-width: 640px) {
		margin-bottom: 45px;
	}
}
.needs_txt{
	margin-bottom: 60px;
}
.needs_img{
	text-align: center;
}

.item_txt{
	margin-bottom: 60px;

	@media screen and (max-width: 640px) {
		margin-bottom: 30px;
	}
}
.item_list{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 60px;

	@media screen and (max-width: 640px) {
		margin-bottom: 30px;
		grid-template-columns: repeat(2, 1fr);
	}
}
.item_img{
	img{
		display: block;
		width: 100%;
	}

	figcaption{
		padding: 15px 0;
		font-size: 1.75rem;
		font-weight: bold;
		letter-spacing: -0.5px;
		text-align: center;
		background-color: #F8F8F8;

		@media screen and (max-width: 640px) {
			padding: 10px 0;
			font-size: 1.4rem;
		}
	}
}
.item_banner{
	a{
		transition: all 0.4s;

		&:hover{
			opacity: 0.8;
		}
	}
}
.item_flow{
	margin: 60px 0 120px;

	@media screen and (max-width: 640px) {
		margin: 30px 0 60px;
	}
}
.item_flow_txt{
	margin-bottom: 60px;
	text-align: center;
	font-size: 2.7rem;
	line-height: 1.8;
	font-weight: bold;

	@media screen and (max-width: 640px) {
		margin-bottom: 30px;
		font-size: 1.8rem;
	}
}
.item_flow_img{
	text-align: center;
}
}