@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&family=Libre+Caslon+Text:ital,wght@0,400;0,700;1,400&display=swap');
/*
keycolor ff9541
*/

#korean_revcell * {
	color: #555;
	font-size: 14px;
	font-family: "Noto Sans JP";
}

#korean_revcell ::selection {
	color: #FFF;
	background: #ff9541;
}

#korean_revcell .scroll_move {
	filter: blur(8px);
	opacity: .3;
}
#korean_revcell .scroll_move_default {
	transition: 1.2s;
}

/*----- H1 H2 H3 -----*/
#korean_revcell h1,
#korean_revcell h2,
#korean_revcell h3,
#korean_revcell h4 {
	font-weight: 200;
}

#korean_revcell h1{

}

#korean_revcell h2 {
	position: relative;
	padding: 112px 0 90px 0;
	color: #333;
	text-align: center;
	font-size: 3.2rem;
}
	#korean_revcell h2.underline::after {
		position: absolute;
		content: "";
		bottom: 64px;
		left: calc(50% - 45px);
		width: 90px;
		height: 2px;
		background: #ff9541;
	}

#korean_revcell h3 {

}

/*----- COMMON -----*/
#korean_revcell img {
	width: 100%;
}

#korean_revcell a{
	font-size: inherit;
}

#korean_revcell .flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
}

#korean_revcell .image_fade_inout img {
	display: block;
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	transition: 1s;
	opacity: 0;
}
	#korean_revcell .image_fade_inout img:first-of-type {
		opacity: 1;
}

#korean_revcell .seminar_bnr {
	display: block;
	width: 100%;
	max-width: 710px;
	margin: 0 auto;
  padding: 48px;
}
#korean_revcell .seminar_bnr a:hover img {
	opacity: 0.7;
	transition: opacity 0.2s ease;
}


/*----- REMARK AREA-----*/
#korean_revcell sup {
	color: #CCC;
	font-size: 1rem;
}
#korean_revcell .remarkArea {
	margin-left: 48px;
	padding-right: 12px;
	text-align: justify;
}
	#korean_revcell .remarkArea ul {
		display: flex;
		flex-wrap: wrap;
	}
		#korean_revcell .remarkArea ul li {
			margin-right: 4px;
			color: #CCC;
			font-size: 1rem;
		}

/*----- KV-----*/
#korean_revcell .kv{
	position: relative;
	height: calc(100vw / 2.71);
/*
	background-image: url("../img/main_01.jpg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
*/
	overflow: hidden;
}


/*-----ABOUT -----*/
#korean_revcell .contents .about {
	position: relative;
	display: flex;
}
	#korean_revcell .about h2 {
		padding: 20px 0;
		color: #FFF;
		font-size: 4rem;
		text-align: left;
	}
	#korean_revcell .about p {
		color: #FFF;
		line-height: 2.4rem;
	}

	#korean_revcell .contents .about .text {
		position: relative;
		text-align: justify;
		flex-grow: 1;
	}
		#korean_revcell .contents .about .text > div {
			position: absolute;
			padding: 32px 48px;
			left: 80%;
			top: 50%;
			transform: translate(-50%, -50%);
			width: 140%;
			color: #FFF;
			background: rgba(255, 149, 65, 0.6);
		}
	#korean_revcell .contents .about .image {
		width: 70%;
	}

/*-----BRAND STORY -----*/
#korean_revcell.contents.about > h2 {
	font-size: 3rem;
}
/*-----HEADER NAV-----*/
#korean_revcell .header_nav {
	position: sticky;
	top: 0;
	display: flex;
	flex-wrap: wrap;
	font-weight:bold;
	z-index: 10;
}
	#korean_revcell .header_nav a {
		text-decoration: none;
		background: rgb(255 65 65 / 40%);
		transition: 0.5s;
	}
		#korean_revcell .header_nav a:hover {
		background: rgb(255 65 65 / 55%);
		}
	#korean_revcell .header_nav > * {
		flex: 1 1 0;
		padding: 16px 0;
		font-family: "Libre Caslon Text", serif;
		color: #FFF;
		text-align: center;
		cursor: pointer;
	}
		#korean_revcell .header_nav p {
			position: relative;
			color: #FFF;
			font-size: 2.1rem;
			font-family: "Libre Caslon Text";
			letter-spacing: 0.1rem;
			font-weight: 400;
			cursor: pointer;
			user-select: none;
		}
			#korean_revcell .header_nav p span {
				display: block;
				margin-top: -4px;
				color: #FFF;
				font-size: 1.1rem;
				letter-spacing: 0.2rem;
			}

/*----- RECOMMEND ITEMS-----*/
#korean_revcell #Items {
}
	#korean_revcell #Items .title {
		text-align: left;
		text-align: justify;
	}
#korean_revcell #Items .flex {
	position: relative;
	margin: 0 auto 80px auto;
	max-width: 1200px;
	box-shadow: 0 0 0 0 rgba(0,0,0,0.3);
}

		#korean_revcell #Items .flex > div {
/*			position: relative;
*/
		}
			#korean_revcell #Items .flex > div:first-child {
				width: 45%;
			}
			#korean_revcell #Items .flex > div:nth-child(2) {
				padding-top: 160px;
				width: 55%;
			}

			#korean_revcell #Items .flex > div h3 {
				position: absolute;
				padding: 12px;
				top: 40px;
				left: calc(50% - 120px);
				color: #ff9541;
				font-size: 2.4rem;
				font-weight: 400;
				line-height: 2.4rem;
				background: #FFF;
				z-index: 1;
				transition: 1s;
			}
			#korean_revcell #Items .flex > div h3.scroll_move {
				transform: translateX(20px);
				color: #FFF;
			}

				#korean_revcell #Items .flex > div h3 span {
					display: block;
					color: #AAA;
					font-size: 1rem;
				}
			#korean_revcell #Items .flex > div p.title {
				position: absolute;
				top: 12px;
				right: 0;
				color: rgba(255, 149, 65, 0.1);
				text-align: right;
				font-size: 20rem;
				font-family: "Noto serif JP";
				font-weight: 100;
				z-index: 2;
			}
			#korean_revcell #Items .flex > div .menu {
				position: relative;
				margin: 60px 60px 20px 60px;
				background: #ffb3b345;
			}
				#korean_revcell #Items .flex > div .menu::after {
					display: block;
					position: absolute;
					content: "";
					top: 100%;
					left: 100%;
					width: 0;
					height: 0;
					background: #FFF;
					transition: 1.2s;
				}
				#korean_revcell #Items .flex > div .menu.scroll_mask::after {
					top: -10%;
					left: -5%;
					width: 110%;
					height: 120%;
				}
				#korean_revcell #Items .flex > div .menu > p {
					margin: 0;
					padding: 8px 16px;
					color: #777;
					font-family: "Noto Serif JP";
					font-weight: 400;
				}
					#korean_revcell #Items .flex > div .menu > p.method {
						border-bottom: 1px dashed #AAA;
					}
					#korean_revcell #Items .flex > div .menu > p.body {
						font-size: 1.2rem;
						line-height: 2rem;
					}
				#korean_revcell #Items .flex > div .menu > p::before,
				#korean_revcell #Items .flex > div .menu > p::after {
					display: block;
					position: absolute;
					content: "";
					width: 20px;
					height: 20px;
					border-width: 2px;
					border-color: #ffe5e5;
				}
				#korean_revcell #Items .flex > div .menu > p.method::before {
					top: -10px;
					left: -10px;
					border-top-style: solid;
					border-left-style: solid;
				}
				#korean_revcell #Items .flex > div .menu > p.method::after {
					top: -10px;
					right: -10px;
					border-top-style: solid;
					border-right-style: solid;
				}
				#korean_revcell #Items .flex > div .menu > p.body::before {
					bottom: -10px;
					left: -10px;
					border-bottom-style: solid;
					border-left-style: solid;
				}
				#korean_revcell #Items .flex > div .menu > p.body::after {
					bottom: -10px;
					right: -10px;
					border-bottom-style: solid;
					border-right-style: solid;
				}

			#korean_revcell #Items .flex > div h4,
			#korean_revcell #Items .flex > div p {
				margin-left: 48px;
				padding: 12px 48px 12px 0;
				font-size: 1.3rem;
				line-height: 2.1rem;
				text-align: justify;
			}
			#korean_revcell #Items .flex > div h4 {
				margin-top: 12px;
				padding: 4px 8px;
				width: fit-content;
				font-size: 1.8rem;
				font-weight: 400;
				line-height: 2rem;
				background: linear-gradient(0, #fff0f0 40%, transparent 40%);
			}
				#korean_revcell #Items .flex > div h4 + span {
					display: block;
					margin-left: 48px;
					padding-left: 8px;
					font-size: 1rem;
					color: #AAA;
				}

	#korean_revcell #Items .flex:nth-child(odd) {
		flex-direction:row-reverse;
	}
		#korean_revcell #Items .flex:nth-child(odd) > div p.title {
			left: 0;
			right: unset;
		}

			#korean_revcell #Items .flex:nth-child(odd) > div h3 {
				left: unset;
				right: calc(50% - 120px);
				text-align: right;
			}
			#korean_revcell #Items .flex:nth-child(odd) > div p.title {
				text-align: left;
			}

			#korean_revcell #Items .flex > div.add_image {
				display: none;
				position: absolute;
				width: 400px;
				bottom: 0;
			}
			#korean_revcell #Items .flex:nth-child(even) > div.add_image {
				left: 48%;;
			}
			#korean_revcell #Items .flex:nth-child(odd) > div.add_image {
				right: 48%;;
			}



/*-----PRODUCT LINEUP-----*/
#korean_revcell #product > nav {
	display:flex;
	justify-content: space-between;
}

#korean_revcell .product_category {
	margin: 0 auto;
	width: 80%;
}
	#korean_revcell .product_category h3 {
		padding: 60px 0 8px 1%;
		font-size: 2rem;
		line-height: 6rem;
	}
	#korean_revcell .product_category > div {/* category */
		display: flex;
		flex-wrap: wrap;
	}
		#korean_revcell .product_category > div > div {/* thumbnail list */
			position: relative;
			margin: 1%;
			width: 30%;
			max-width: 320px;
			overflow: hidden;
		}
			#korean_revcell .product_category > div > div p {
				position: absolute;
				margin: 0;
				padding: 8px;
				width: 100%;
				font-size: 1.3rem;
				color: #FFF;
				background: rgba(255, 149, 65, 0.5);
				transition: 0.5s;
				cursor: pointer;
			}
			#korean_revcell .product_category > div > div p.hover {
				bottom: 0!important;
			}


@media screen and (max-width: 1199px){
}
@media screen and (max-width: 1169px){
}

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

@media (max-width: 767px){
	#korean_revcell .kv {
		height: 50vh;
	}
		#korean_revcell .image_fade_inout img {
			width: auto;
			height: 100%;
		}
	#korean_revcell h2 {
		padding-top: 0;
	}
	#korean_revcell .flex {
		flex-direction: column;
	}

	/* About */
	#korean_revcell .contents .about {
		flex-direction: column;
	}
		#korean_revcell .about h2 {
			padding-top: 0;
		}
		#korean_revcell .contents .about .text > div {
			position: static;
			left: unset;
			top: unset;
			width: auto;
			transform: unset;
		}
		#korean_revcell .contents .about .image {
			width: auto;
		}
		#korean_revcell .about p {
			font-size: 1.8rem;
		}

	/* Nav */
	#korean_revcell .header_nav p {
		line-height: 2.6rem;
	}

	/* Nav */
	#korean_revcell #Items {
		margin-top: 60px;
	}

	/* Item */
	#korean_revcell #Items .flex:nth-child(even) {
		flex-direction: column;
	}
	#korean_revcell #Items .flex > div:first-child,
	#korean_revcell #Items .flex > div:nth-child(2) {
		width: 100%;
	}
		#korean_revcell #Items .flex > div:first-child {
			padding-top: 140px;
		}
		#korean_revcell #Items .flex > div:nth-child(2) {
			padding-top: 20px;
		}

		#korean_revcell #Items .flex > div h3 {
			left: 0;
			font-size: 3rem;
			line-height: 3rem;
		}
		#korean_revcell #Items .flex:nth-child(odd) > div h3 {
			right: 0;
		}
			#korean_revcell #Items .flex > div h3 span {
				font-size: 1.4rem;
			}
		#korean_revcell #Items .flex > div h4,
		#korean_revcell #Items .flex > div p {
			margin-left: 12px;
			padding-right: 12px;
			font-size: 1.6rem;
			line-height: 2.8rem;
		}
		#korean_revcell #Items .flex > div h4 {
			font-size: 2.1rem;
			font-weight: 400;
		}
			#korean_revcell #Items .flex > div h4 + span {
				margin-left: 12px;
				font-size: 1.4rem;
			}
		#korean_revcell .remarkArea {
			margin-left: 12px;
		}


	#korean_revcell #Items .flex > div .menu {
		margin: 28px;
	}
	#korean_revcell #Items .flex > div .menu > p.body {
		font-size: 1.4rem;
		line-height: 2.4rem;
	}

	/* product */
	#korean_revcell #product .nav.flex {
		flex-direction: row;
	}
		#korean_revcell #product .nav.flex > div {
			padding: 8px 0;
			width: calc(100% / 3);
			text-align: center;
			border-bottom: 1px solid #CCC;
		}
	#korean_revcell .product_category {
		width: 90%;
	}
		#korean_revcell .product_category h3 {
			font-size: 3rem;
		}
		#korean_revcell .product_category > div > div {
			width: 48%;
			overflow: unset;
		}
			#korean_revcell .product_category > div > div p {
				position: relative;
				bottom: 0!important;
				color: #777;
				background: #E9E9E9;
			}
}