#banner
{
	li
	{
		position: relative;
		picture
		{
			position: relative;
			width: 100%;
			display: block;
			overflow: hidden;
			padding-top:88%;
			img
			{
				display: block;
				width: 100%;
				position: absolute;
				top:0px;
				left:0px;
				right:0px;
				bottom:0px;
				object-fit: cover;
				object-position: center;
			}
		}
		>div
		{
			position: absolute;
			width: 100%;
			top: 50%;  
			left: 50%;
			transform: translate(-50%, -50%);
			text-align: center;
			span
			{
				display: block;
				color:#fff;
			}
			a
			{
				display: inline-block;
				color:#fff;
				border:1px solid #fff;
				transition-duration:.5s;
				&:hover
				{
					border-color:#333;
					background-color:#333;
				}
			}
		}
	}
	@media(max-width:1199px)
	{
		padding:0px;
	}
	@media(min-width:769px)
	{
		display: flex;
		li
		{
			min-width: 50%;
			>div
			{
				span
				{
					font-size:1.2vw;
					letter-spacing: 0.156vw;
					margin-bottom:1.04vw;
				}
				a
				{
					width:10.41vw;
					padding:0.52vw;
					font-size:0.729vw;
					letter-spacing: 0.156vw;
				}
			}
		}
	}
	
	@media(max-width:768px)
	{
		li
		{
			>div
			{
				span
				{
					font-size:20px;
					margin-bottom:20px;
					letter-spacing: 3px;
				}
				a
				{
					font-size:14px;
					width:50vw;
					padding:10px 0;
					letter-spacing: 3px;
				}
			}
		}
	}
}


#about
{
	text-align: center;
	.more
	{
		
		a
		{
			color:#333;
			border:1px solid #333;
			transition-duration:.5s;
			display: inline-block;
			&:hover
			{
				background-color: #333;
				color:#fff;
			}
		}
	}
	@media(min-width:769px)
	{
		padding-top:5.2vw;
		padding-bottom:5.2vw;
		h2
		{
			font-size:2vw;
			margin-bottom:3vw;
		}
		p
		{
			font-size:1.2vw;
			letter-spacing: 0.104vw;
			line-height:1.6vw;
			margin-bottom:3vw;
		}
		.more
		{
			a
			{
				width:7.81vw;
				padding-top:.5vw;
				padding-bottom:.5vw;
				font-size:pxvw(13);
				letter-spacing: 0.104vw;
			}
		}
		
	}
	@media(max-width:768px)
	{
		padding-top: 100px;
		padding-bottom:100px;
		h2
		{
			letter-spacing: 0;
			line-height: 25px;
			font-size:16px;
			margin-bottom:50px;
		}
		p
		{
			font-size:14px;
			line-height:20px;
			margin-bottom:50px;
		}
		.more
		{
			a
			{
				width:150px;
				padding-top:10px;
				padding-bottom:10px;
				font-size:13px;
				letter-spacing: 3px;
			}
		}
	}
}



#product-list
{
	text-align: center;
	ul
	{
		display: flex;
		flex-wrap:wrap;
		li
		{
			a
			{
				display: block;
				position: relative;
				picture
				{
					display: block;
					position: relative;
					padding-top:154%;
					overflow: hidden;
					img
					{
						position: absolute;
						top:0px;
						left:0px;
						right:0px;
						bottom:0px;
						display: block;
						width: 100%;
						object-fit: cover;
						object-position: center;
						margin:auto;
					}
				}
				>div
				{
					width:100%;
					z-index:1;
					position: absolute;
					top: 50%;  
					left: 50%;
					transform: translate(-50%, -50%);
					span
					{
						display: block;
						color:#fff;
						&.vm
						{
							display: inline-block;
							border:1px solid #fff;
							transition-duration:.5s;
							&:hover
							{
								background-color: #333;
								border-color:#333;
							}
						}
					}
				}
			}
		}
	}
	.more
	{
		text-align: center;
		a
		{
			display: inline-block;
			border:1px solid #333;
			color:#333;
			transition-duration:.5s;
			&:hover
			{
				background-color: #333;
				color:#fff;
			}
		}
	}
	@media(min-width:769px)
	{
		padding-top:pxvw(100);
		padding-bottom:pxvw(100);
		h2
		{
			font-size:pxvw(24);
			margin-bottom:pxvw(100);
		}
		ul
		{
			margin-bottom:pxvw(100);
			li
			{
				width:calc((100% - 6.25vw) / 4);
				margin:0 pxvw(20);
				&:nth-child(4n)
				{
					margin-right: 0px;
				}
				&:nth-child(4n + 1)
				{
					margin-left:0px;
				}
				a
				{
					>div
					{
						span
						{
							&.title
							{
								font-size:pxvw(16);
								margin-bottom:pxvw(20);
								width:100%;
							}
							&.vm
							{
								display: inline-block;
								font-size:pxvw(13);
								width:pxvw(150);
								padding:pxvw(5) 0;
								
							}
						}
					}
				}
			}
		}
		.more
		{
			a
			{
				width:7.81vw;
				padding-top:.5vw;
				padding-bottom:.5vw;
				font-size:pxvw(13);
				letter-spacing: 0.104vw;
			}
		}
	}
	@media(max-width:768px)
	{
		padding-bottom:100px;
		padding-top:100px;
		h2
		{
			font-size:20px;
			letter-spacing: 3px;
			margin-bottom:50px;
		}
		ul
		{
			margin-bottom:50px;
			li
			{
				width: calc(50% - 5px);
				margin-bottom:10px;
				&:nth-child(2n)
				{
					margin-left:5px;
				}
				&:nth-child(2n + 1)
				{
					margin-right: 5px;
				}
				a
				{

					>div
					{
						span
						{
							&.title
							{
								font-size:16px;
								margin-bottom:20px;
								padding:0 10px;
								line-height:20px;
							}
							&.vm
							{
								font-size:13px;
								padding:5px 20px;
							}

						}
					}
				}
			}
		}
		.more
		{
			a
			{
				width:150px;
				padding-top:10px;
				padding-bottom:10px;
				font-size:13px;
				letter-spacing: 3px;
			}
		}
	}
	
}


#order-from
{
	border-top:1px solid #E0E0E0;
	text-align: center;
	
	picture
	{
		display: block;
		img
		{
			width: 100%;
			display: block;
		}
	}
	.more
	{
		a
		{
			color:#333;
			border:1px solid #333;
			transition-duration:.5s;
			&:hover
			{
				color:#fff;
				background: $main-color;
			}
		}
	}
	@media(min-width:769px)
	{
		padding-top:pxvw(100);
		padding-bottom:pxvw(100);
		h2
		{
			font-size:pxvw(24);
			margin-bottom:pxvw(50);
		}
		p
		{
			font-size:pxvw(16);
			line-height: pxvw(22);
			margin-bottom:pxvw(50);
		}
		.more
		{
			margin-bottom: pxvw(50);
			a
			{
				padding:.5vw 1vw;
				font-size:pxvw(13);
				letter-spacing: 0.104vw;
			}
		}
	}
	@media(max-width:768px)
	{
		padding-top:100px;
		padding-bottom:100px;
		h2
		{
			line-height:25px;
			font-size:16px;
			letter-spacing: 3px;
			margin-bottom:50px;
		}
		p
		{
			line-height: 24px;
			font-size:14px;
			margin-bottom:50px;
		}
		.more
		{
			margin-bottom:50px;
			a
			{
		
				padding:10px 20px;
				font-size:13px;
				letter-spacing: 3px;
			}
		}
	}
	
}