@charset "utf-8";
/* CSS Document */
header {
	width: 100%;
	max-width: 1920px;
	height: 370px;
	background: url("/en/Assets/Web/Images/Products/BannerBg.png") no-repeat center center;
	background-size: cover;
}
#HeaderForm {
	width: 100%;
	height: 420px;
	max-width: 1600px;
	margin: 0 auto;
	padding-left: 10px;
	padding-right: 10px;
	box-sizing: border-box;
}
#Logo {
	width: 84px;
	height: 96px;
	margin-top: 60px;
	position: fixed;
	z-index: 1000;
}
#ProductsCs {
	width: 100%;
	max-width: 1200px;
	height: 140px;
	margin: 0 auto;
	padding-top: 200px;
	position: relative;
}
.ProductsCs {
	width: calc((100% / 3) - 3px);
	height: 220px;
	color: #6e6e6e;
	float: left;
}
.CsName {
	width: 100%;
	height: 30px;
	font-size: 36px;
	font-family: 'Vollkorn', serif;
	font-weight: 400;
	text-align: center;
	margin-bottom: 30px;
	cursor: pointer;
}
.CsIcon {
	height: 105px;
	margin: 0 auto;
	cursor: pointer;
}
#Icon1 {
	width: 122px;
	height: 105px;
	overflow: hidden;
}
#Icon2 {
	width: 118px;
	height: 110px;
	overflow: hidden;
}
#Icon3 {
	width: 148px;
	height: 105px;
	overflow: hidden;
}
.CsAct {
	height: 152px;
}
#Products {
	width: calc(100% - 60px);
	max-width: 1320px;
	margin: 0 auto;
	letter-spacing: 1px;
	padding-top: 60px;
}
.ProductsForm {
	width: 100%;
	padding-top: 100px;
}
.ProductsHead {
	width: 100%;
	height: 100px;
}
.ProductsName {
	width: 200px;
	height: 30px;
	line-height: 0px;
	color: #b7a393;
	margin: 0 auto;
	background: #FFF;
	position: relative;
	z-index: 100;
	text-align: center;
	font-size: 24px;
	font-weight: 400;
	margin-top: -30px;
}
.Line1 {
	width: 100%;
	height: 15px;
	border-bottom: 1px solid #c8c8c8;
	float: left;
}
.ProductsListForm {
	width: 100%;
}
.ProductsListForm:after{
	content: ".";
	visibility: hidden;
	display: block;
	height: 0;
	clear: both;
}
.ProductsList {
	width: calc(100% / 5 - 4px);
	min-width: 260px;
	height: 400px;
	float: left;
	padding-bottom: 10px;
	cursor: pointer;
}
.ProductsImg {
	width: 240px;
	height: 240px;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}
.ProductsImg img {
	max-width: 240px;
	max-height: 240px;
	transform: scale(1, 1);
	transition: all .3s;
}
.ProductsImg img:hover {
	transform: scale(1.05, 1.05);
}
.ProductsIcon {
	width: 100%;
	height: 32px;
	margin-top: 15px;
	margin-bottom: 10px;
}
.IconNutrients {
	width: 100%;
	height: 32px;
	margin-top: 15px;
	margin-bottom: 10px;
	background: url("/en/Assets/Web/Images/index/ProductsIcon1.png") no-repeat center center;
}
.IconRamen {
	width: 100%;
	height: 32px;
	margin-top: 15px;
	margin-bottom: 10px;
	background: url("/en/Assets/Web/Images/index/ProductsIcon2.png") no-repeat center center;
}
.IconNoodle {
	width: 100%;
	height: 32px;
	margin-top: 15px;
	margin-bottom: 10px;
	background: url("/en/Assets/Web/Images/index/ProductsIcon3.png") no-repeat center center;
}
.ProductsTitle {
	width: 100%;
	height: 90px;
	max-width: 200px;
	margin: 0 auto;
	line-height: 25px;
	letter-spacing: 1px;
	font-weight: 300;
	text-align: center;
}
#BtnLeft {
	width: 150px;
	height: 200px;
	position: fixed;
	left: 70px;
	top: 482px;
	z-index: 100;
}
#BtnProMenu {
	width: 64px;
	height: 64px;
	cursor: pointer;
	margin-bottom: 25px;
	background: url("/en/Assets/Web/Images/Products/LeftMenu.png") no-repeat;
}
#BtnProBook {
	width: 64px;
	height: 64px;
	cursor: pointer;
	background: url("/en/Assets/Web/Images/Products/Book.png") no-repeat;
}
/* Products Menu*/
#ProductLeftMenu {
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 1000;
	background: rgba(0, 0, 0, 0.52);
	display: none;
}
#ProductsMenu {
	width: 400px;
	height: 100%;
	background: #f0f0f0;
}
#BtnPMenuClose {
	width: 32px;
	height: 26px;
	background: url("/en/Assets/Web/Images/cancel-02.svg");
	cursor: pointer;
	margin-left: 340px;
	top: 30px;
	position: absolute;
}
#ProMenu {
	width: 300px;
	height: 100%;
	margin-left: 50px;
	letter-spacing: 1px;
}
#ProMenuTitle {
	width: 100%;
	height: 50px;
	font-family: "Vollkorn";
	font-size: 36px;
	color: #b7a393;
	padding-top: 70px;
}
#Search {
	width: 100%;
	height: 40px;
	border: none;
	background: #FFF;
	padding-left: 10px;
	box-sizing: border-box;
	margin-top: 50px;
	margin-bottom: 20px;
}
input::placeholder {
	color: #c8c8c8;
	font-size: 16px;
	letter-spacing: 2px;
}
.MenuItem {
	width: 100%;
	height: 60px;
	padding-top: 30px;
}
.MenuItemList {
	width: 100%;
	height: 40px;
}
.MenuItemName {
	width: 90px;
	height: 40px;
	line-height: 40px;
	color: #b7a393;
	float: left;
	font-size: 18px;
}
.MenuItemLine {
	width: 210px;
	height: 20px;
	border-bottom: 1px solid #b7a393;
	float: right;
}
.CheckBox1 input {
	float: left;
}
.CheckBox1 input[type=checkbox] {
	display: none;
}
.CheckBox1 input[type=checkbox] + label {
	display: inline-block;
	padding: 0 0 0 0px;
	background: url("/en/Assets/Web/Images/Products/CheckOff.png") no-repeat;
	height: 20px;
	padding-left: 40px;
	color: #6e6e6e;
}
.CheckBox1 input[type=checkbox]:checked + label {
	background: url("/en/Assets/Web/Images/Products/CheckOn.png") no-repeat;
	height: 20px;
	display: inline-block;
}
.MenuDown {
	width: 100%;
	padding-top: 70px;
	color: #c8c8c8;
	font-size: 14px;
	text-align: center;
}
#ProMenuClose {
	width: calc(100% - 400px);
	height: 100vh;
	float: right;
}
@media screen and (min-width: 992px) and (max-width:1199px) {
	.ProductsList {
		width: calc(100% / 3 - 4px);
		min-width: 220px;
		height: 400px;
		display: inline-table;
		padding-bottom: 10px;
	}
	.ProductsForm {
		padding-left: 50px;
		padding-right: 50px;
		box-sizing: border-box;
	}
}
@media screen and (min-width: 1200px) and (max-width:1500px) {
	.ProductsList {
		width: calc(100% / 4 - 4px);
		min-width: 220px;
		height: 400px;
		display: inline-table;
		padding-bottom: 10px;
	}
	.ProductsForm {
		padding-left: 50px;
		padding-right: 50px;
		box-sizing: border-box;
	}
}
.CsIcon {
	height: 152px;
	margin: 0 auto;
}
#Icon1 {
	width: 122px;
}
#Icon2 {
	width: 118px;
}
#Icon3 {
	width: 148px;
}
@media screen and (max-width: 991px) {
	#Logo {
		width: 58px;
		height: 65px;
		margin-top: 30px;
		left: 35px;
		position: absolute;
	}
	#Logo img {
		width: 58px;
	}
	header {
		height: 80px;
		background: url("/en/Assets/Web/Images/Products/BannerBg.png") no-repeat center center;
		background-size: cover;
	}
	.ProductsCsForm-Mb {
		width: 100%;
		height: 170px;
		margin-top: -30px;
		overflow: hidden;
	}
	.ProductsCs {
		text-align: center;
	}
	.ProductsCsAct {
		padding-top: 0px;
	}
	.CsName {
		width: 0 auto;
		font-size: 16px;
		padding-top: 10px;
		cursor: pointer;
		transition: all .5s;
	}
	.CsImg {
		width: 67px;
		height: 67px;
		margin: 0 auto;
		margin-bottom: 20px;
	}
	.CsImg img {
		max-height: 67px;
	}
	.CsActMb {
		padding-top: 0px;
	}
	.SpanActMb {
		font-size: 24px;
		border-bottom: 1px solid #000;
	}
	#BtnLeft {
		width: 100%;
		height: 50px;
		position: static;
		left: 0px;
		top: 0px;
		margin-top: 0;
		padding-left: 30px;
		padding-right: 30px;
		box-sizing: border-box;
	}
	#BtnProMenu-Mb {
		width: 105px;
		height: 40px;
		line-height: 40px;
		cursor: pointer;
		margin-bottom: 25px;
		background: url("/en/Assets/Web/Images/Products/p-filters.svg") no-repeat;
		background-size: contain;
		display: inline-block;
		text-align: right;
		font-size: 14px;
		letter-spacing: 1px;
		color: #c8c8c8;
		float: left;
	}
	#BtnProBook-Mb {
		width: 135px;
		height: 40px;
		line-height: 20px;
		cursor: pointer;
		margin-bottom: 25px;
		background: url("/en/Assets/Web/Images/Products/p-download.svg") no-repeat;
		background-size: contain;
		text-align: right;
		font-size: 14px;
		letter-spacing: 1px;
		color: #c8c8c8;
		float: right;
	}
	.MenuText {
		width: 80px;
		height: 40px;
		line-height: 40px;
		float: right;
		text-align: left;
		color: #c8c8c8;
	}
	#Products {
		width: calc(100% - 60px);
		max-width: 1320px;
		margin: 0 auto;
		letter-spacing: 1px;
		padding-top: 0px;
	}
	.ProductsForm {
		width: 100%;
		padding-top: 50px;
	}
	.ProductsHead {
		width: 100%;
		height: 80px;
	}
	.ProductsName {
		width: 160px;
		height: 30px;
		line-height: 0px;
		color: #b7a393;
		margin: 0 auto;
		background: #FFF;
		position: relative;
		z-index: 100;
		text-align: center;
		font-size: 20px;
		font-weight: 400;
		margin-top: -30px;
	}
	.ProductsListForm {
		width: 100%;
		padding-bottom: 50px;
	}
	.ProductsList {
		width: calc(100% / 2 - 4px);
		min-width: 120px;
		height: auto;
		display: inline-table;
		padding-bottom: 20px;
	}
	.ProductsImg {
		width: 100%;
		height: auto;
		text-align: center;
	}
	.ProductsImg img {
		width: 100%;
		height: auto;
	}
	.ProductsImg img:hover {
		transform: scale(1, 1);
	}
	.ProductsIcon {
		width: 100%;
		height: 32px;
		margin-top: 15px;
		margin-bottom: 10px;
	}
	.ProductsIcon1 {
		background: url("/en/Assets/Web/Images/index/ProductsIcon1.png") no-repeat center center;
	}
	.ProductsIcon2 {
		background: url("/en/Assets/Web/Images/index/ProductsIcon2.png") no-repeat center center;
	}
	.ProductsIcon3 {
		background: url("/en/Assets/Web/Images/index/ProductsIcon3.png") no-repeat center center;
	}
	.ProductsTitle {
		width: 100%;
		height: 90px;
		max-width: 200px;
		margin: 0 auto;
		line-height: 25px;
		letter-spacing: 1px;
		font-weight: 300;
		text-align: center;
	}
	/* Products Menu*/
	#ProductLeftMenu {
		width: 100%;
		height: 100%;
		position: fixed;
		z-index: 1000;
		background: rgba(0, 0, 0, 0.52);
		
	}
	#ProMenuCloseForm{
		width: calc(100% - 320px);
		height: 100%;		
		float: right;
		
	}
	#ProductsMenu {
		width: 320px;
		height: 100%;
		background: #f0f0f0;
		overflow-y: auto;
	}
	#BtnPMenuClose {
		width: 28px;
		height: 26px;
		background: url("/en/Assets/Web/Images/cancel-02.svg") no-repeat;
		;
		cursor: pointer;
		background-size: contain;
		margin-left: 280px;
		top: 30px;
		position: absolute;
	}
	#ProMenu {
		width: 280px;
		height: 100%;
		margin-left: 20px;
		letter-spacing: 1px;
	}
	#ProMenuTitle {
		width: 100%;
		height: 50px;
		font-family: "Vollkorn";
		font-size: 24px;
		color: #b7a393;
		padding-top: 50px;
	}
	#Search {
		width: 100%;
		height: 35px;
		border: none;
		background: #FFF;
		padding-left: 10px;
		box-sizing: border-box;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	input::placeholder {
		color: #c8c8c8;
		font-size: 16px;
		letter-spacing: 2px;
	}
	.MenuItem {
		width: 100%;
		height: 60px;
		padding-top: 20px;
	}
	.MenuItemList {
		width: 100%;
		height: 35px;
	}
	.MenuItemName {
		width: 90px;
		height: 40px;
		line-height: 40px;
		color: #b7a393;
		float: left;
		font-size: 18px;
	}
	.MenuItemLine {
		width: 170px;
		height: 20px;
		border-bottom: 1px solid #b7a393;
		float: right;
	}
	.CheckBox1 input {
		float: left;
	}
	.CheckBox1 input[type=checkbox] {
		display: none;
	}
	.CheckBox1 input[type=checkbox] + label {
		display: inline-block;
		padding: 0 0 0 0px;
		background: url("/en/Assets/Web/Images/Products/CheckOff.png") no-repeat;
		height: 20px;
		padding-left: 40px;
		color: #6e6e6e;
	}
	.CheckBox1 input[type=checkbox]:checked + label {
		background: url("/en/Assets/Web/Images/Products/CheckOn.png") no-repeat;
		height: 20px;
		display: inline-block;
	}
}
@media screen and (min-width: 992px) and (max-width:1360px) {
	#Logo {
		width: 84px;
		height: 96px;
		margin-top: 60px;
		left: 30px;
		position: fixed;
		z-index: 1000;
	}
	#Products {
		width: 100%;		
		
		letter-spacing: 1px;
		padding-top: 60px;
		box-sizing: border-box;
		padding-left: 60px;
		padding-right: 60px;
	}
}