/* CSS Document */


body div.wrap article section.hqsp div.group_img {
	width: 100%;
	height: auto;
	padding-top: 1rem;
}
body div.wrap article section.hqsp div.group_img ul {
	width: 100%;
	height: auto;
	padding: 0 0 0 0;
	margin:  0 0 0 0;
	list-style: none;
	text-align: center;
}
body div.wrap article section.hqsp div.group_img ul li {
	display: inline-block;
	width: auto;
	height: 8rem;
}
body div.wrap article section.hqsp div.group_img ul li img {
	width: auto;
	height: 100%;
}

body div.wrap article section.hqsp,
body div.wrap article section.ktop,
body div.wrap article section.sssi,
body div.wrap article section.k2nsk {
	padding: 2rem 1rem 8rem 1rem;
}
body div.wrap article section.hqsp {
	background: linear-gradient(0deg, rgba(0, 0, 0, 0), rgba(255, 255, 255, 1) 35%), url("../images/ingredient-01.jpg");
	background-blend-mode:lighten;
	background-position: center bottom;
	background-size: cover;
	background-repeat: no-repeat;
}
body div.wrap article section.ktop {
	background: linear-gradient(0deg, rgba(0, 0, 0, 0), rgba(255, 255, 255, 1) 40%), url("../images/ingredient-02.jpg");
	background-blend-mode:lighten;
	background-position: center bottom;
	background-size: cover;
	background-repeat: no-repeat;
}
body div.wrap article section.sssi {
	background: linear-gradient(0deg, rgba(0, 0, 0, 0), rgba(255, 255, 255, 1) 40%), url("../images/ingredient-03.jpg");
	background-blend-mode:lighten;
	background-position: center bottom;
	background-size: cover;
	background-repeat: no-repeat;
}
body div.wrap article section.k2nsk {
	background: linear-gradient(0deg, rgba(0, 0, 0, 0), rgba(255, 255, 255, 1) 40%), url("../images/ingredient-04.jpg");
	background-blend-mode:lighten;
	background-position: center bottom;
	background-size: cover;
	background-repeat: no-repeat;
}
/*
body div.wrap article section.hqsp h1,
body div.wrap article section.ktop h1,
body div.wrap article section.sssi h1,
body div.wrap article section.k2nsk h1 {
	text-align: center;
	font-size: 2rem;
	font-weight: normal;
	margin: 0 0 3rem 0;
  position: relative;
  padding: 0.6em;
  background: rgba(221, 203, 193, .4);
	border-radius: 1rem;
}
body div.wrap article section.hqsp h1:after,
body div.wrap article section.ktop h1::after,
body div.wrap article section.sssi h1::after,
body div.wrap article section.k2nsk h1::after {
  position: absolute;
  content: '';
  top: 100%;
  left: 30px;
  border: 15px solid transparent;
  border-top: 15px solid rgba(221, 203, 193, .4);
  width: 0;
  height: 0;
}
*/
body div.wrap article section.hqsp h2,
body div.wrap article section.ktop h2,
body div.wrap article section.sssi h2,
body div.wrap article section.k2nsk h2 {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 4rem auto 2rem auto;
}
body div.wrap article section.hqsp h2::before,
body div.wrap article section.ktop h2::before,
body div.wrap article section.sssi h2::before,
body div.wrap article section.k2nsk h2::before {
	content: '';
	position: absolute;
	width: 150px;
	height: 2.5em;
	border-radius: 50%;
	border: 2px solid rgba(222, 105, 135, 1);
	border-left-color: transparent;
	border-right-color: transparent;
}
body div.wrap article section.hqsp h2 + div,
body div.wrap article section.ktop h2 + div,
body div.wrap article section.sssi h2 + div,
body div.wrap article section.k2nsk h2 + div {
	text-align: center;
}
body div.wrap article section.hqsp div img, 
body div.wrap article section.ktop div img,
body div.wrap article section.sssi div img,
body div.wrap article section.k2nsk div img {
	width: auto;
	height: 10rem;
}
body div.wrap article section.hqsp h3,
body div.wrap article section.ktop h3,
body div.wrap article section.sssi h3,
body div.wrap article section.k2nsk h3 {
	text-align: center;
	font-weight: normal;
}

body div.wrap article section.hqsp ol,
body div.wrap article section.ktop ol,
body div.wrap article section.sssi ol,
body div.wrap article section.k2nsk ol {
	width: 100%;
	height: auto;
	padding: 0 1rem 0 2rem;
	margin:  2rem 0 2rem 0;
	font-size: 1.1rem;
}
body div.wrap article section.hqsp ol li,
body div.wrap article section.ktop ol li,
body div.wrap article section.sssi ol li,
body div.wrap article section.k2nsk ol li {
	margin: 0 0 1rem 0;
}
body div.wrap article section.hqsp ol li b,
body div.wrap article section.ktop ol li b,
body div.wrap article section.sssi ol li b,
body div.wrap article section.k2nsk ol li b {
	color: rgba(222, 105, 135, 1);
	font-weight: normal;
}


@media only screen and (max-width: 480px) {

	body div.wrap article section.hqsp div.group_img ul li {
		display: inline-block;
		width: auto;
		height: 5rem;
	}

	body div.wrap article section.hqsp,
	body div.wrap article section.ktop,
	body div.wrap article section.sssi,
	body div.wrap article section.k2nsk {
		padding: 4rem 1rem 8rem 1rem;
	}
	body div.wrap article section.hqsp h2,
	body div.wrap article section.ktop h2,
	body div.wrap article section.sssi h2,
	body div.wrap article section.k2nsk h2 {
		font-weight: normal;
		font-size: 1.4rem;
	}
	body div.wrap article section.hqsp h3,
	body div.wrap article section.ktop h3,
	body div.wrap article section.sssi h3,
	body div.wrap article section.k2nsk h3 {
		font-weight: normal;
		font-size: 1.1rem;
	}
	body div.wrap article section.hqsp ol,
	body div.wrap article section.ktop ol,
	body div.wrap article section.sssi ol,
	body div.wrap article section.k2nsk ol {
		width: 100%;
		height: auto;
		padding: 0 0 0 1rem;
		margin:  2rem 0 2rem 0;
		font-size: 1.1rem;
	}

}