@charset "UTF-8";
/* CSS Document */

/* !import
---------------------------------------------------------- */
@import url("./archive.css");
@import url("./single.css");
@import url("./product.css");

/* !pageheader
---------------------------------------------------------- */
.pageheader-archive {
	background-image: url("../img/story/archive_pageheader_bg.jpg");
}
.pageheader-archive h2 {
	width: 647px;
	height: 300px;
}
@media screen and (max-width: 750px) {
.pageheader-archive h2 {
	width: 75%;
	max-width: 280px;
	height: auto;
}
}

/* !post-archive
---------------------------------------------------------- */
.post-archive--related {
	background: #fbf9f5;
}

/* !post-single
---------------------------------------------------------- */
.post-single .wrap {
	width: 1000px;
}
.post-single__block {
	margin: 0 0 200px;
}
.post-single__block.post-single__block--first {
	margin: 0 -100px 100px;
}
.post-single__block.post-single__block--end {
	margin: 150px -100px 200px;
}
.post-single__block.post-single__block--bg {
	position: relative;
	background-size: cover;
}
.post-single__block.post-single__block--bg::before {
	content:"";
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.7);
	position: absolute;
	top: 0;
	left: 0;
}
.post-single__block::after {
	content:"";
	height: 0;
	display: block;
	clear: both;
}
.post-single__name {
	font-size: 4.0rem;
	font-weight: 400;
	line-height: 1;
	text-align: center;
	margin: 0 0 250px;
	position: relative;
}
.post-single__name::before {
	content:"";
	width: 100%;
	height: 1px;
	margin: auto;
	background: #d9c4b8;
	position: absolute;
	bottom: -125px;
	left: 0;
	right: 0;
}
.post-single__name::after {
	content:"";
	width: 180px;
	height: 80px;
	margin: auto;
	background: url("../img/common/common_bg_illust01.png") no-repeat center center #fff;
	background-size: 130px 80px;
	position: absolute;
	bottom: -165px;
	left: 0;
	right: 0;
}
.post-single__imgbox01 {
	width: 430px;
}
.post-single__imgbox01 span {
	width: 410px;
	height: 410px;
	border-radius: 205px;
	-webkit-border-radius: 205px;
	overflow: hidden;
	position: relative;
	display: block;
}
.post-single__imgbox01 img {
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: block;
}
.post-single__imgbox02 {
	width: 50%;
}
.post-single__txtbox01 {
	width: 430px;
	margin: 0 140px 0 0;
}
.post-single__txtbox01 h3 {
	font-size: 2.5rem;
	font-weight: 500;
	margin: 0 0 30px;
}
.post-single__txtbox02 {
	width: 50%;
	padding: 25px 100px;
}
.post-single__txtbox02 h3 {
	width: 450px;
	font-size: 2.5rem;
	font-weight: 500;
	margin: 0 0 30px;
	padding: 100px 0 0;
	position: relative;
}
.post-single__txtbox02 h3::after {
	content:"";
	width: 180px;
	height: 80px;
	margin: auto;
	background: url("../img/common/common_bg_illust01.png") no-repeat center center #fff;
	background-size: 130px 80px;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}
.post-single__txtbox02 p {
	width: 450px;
}
.post-single__txtbox03 {
	padding: 150px 100px;
}
.post-single__txtbox03 h3 {
	color: #fff;
	font-size: 2.5rem;
	font-weight: 500;
	text-align: center;
	margin: 0 0 30px;
}
.post-single__txtbox03 p {
	color: #fff;
	line-height: 2.5;
}
.post-single__section-title {
	font-size: 3.0rem;
	font-weight: 700;
	line-height: 1;
	margin: 0 0 100px -100px;
	position: relative;
}
.post-single__section-title::before {
	content:"";
	margin: auto;
	position: absolute;
	left: 0;
}
.post-single__section-title::after {
	content:"";
	width: 70px;
	height: 3px;
	background: #c37d55;
	position: absolute;
	bottom: -45px;
	left: 0;
}
.post-single__section-title--features {
	padding: 0 0 0 280px;
}
.post-single__section-title--technique {
	padding: 0 0 0 320px;
}
.post-single__section-title--ingredient {
	padding: 0 0 0 530px;
}
.post-single__section-title--features::before {
	width: 279px;
	height: 51px;
	background: url("../img/story/txt_title_features.svg") no-repeat center center;
	background-size: 279px 51px;
	top: -20px;
}
.post-single__section-title--technique::before {
	width: 319px;
	height: 72px;
	background: url("../img/story/txt_title_technique.svg") no-repeat center center;
	background-size: 319px 72px;
	top: -20px;
}
.post-single__section-title--ingredient::before {
	width: 528px;
	height: 73px;
	background: url("../img/story/txt_title_ingredient.svg") no-repeat center center;
	background-size: 528px 73px;
	top: -20px;
}
.post-single__section-title span::before {
	content:"／";
	margin: 0 10px;
	display: inline-block;
}
@media screen and (max-width: 750px) {
.post-single .wrap {
	width: auto;
}
.post-single__block {
	margin: 0 0 60px;
}
.post-single__block.post-single__block--first {
	margin: 0 -15px 45px;
}
.post-single__block.post-single__block--end {
	margin: 0 0 60px;
}
.post-single__name {
	font-size: 2.4rem;
	line-height: 1.5;
	margin: 0 0 100px;
	padding: 0 15px;
}
.post-single__name::before {
	width: calc(100% - 30px);
	bottom: -50px;
}
.post-single__name::after {
	width: 90px;
	height: 40px;
	background-size: 65px 40px;
	bottom: -70px;
}
.post-single__name span {
	display: block;
}
.post-single__name span.post-single__name__r {
	font-size: 1.6rem;
	margin: 10px 0 0;
	padding: 0;
	border-left: none;
}
.post-single__imgbox01 {
	width: auto;
}
.post-single__imgbox01 span {
	width: 220px;
	height: 220px;
	margin: 30px auto;
	border-radius: 50%;
	-webkit-border-radius: 50%;
}
.post-single__imgbox02 {
	width: auto;
}
.post-single__txtbox01 {
	width: auto;
	margin: 0;
}
.post-single__txtbox01 h3 {
	font-size: 1.8rem;
	text-align: center;
	margin: 0 0 15px;
}
.post-single__txtbox02 {
	width: auto;
	padding: 25px 15px;
}
.post-single__txtbox02 h3 {
	width: auto;
	font-size: 1.8rem;
	text-align: center;
	margin: 0 0 15px;
	padding: 60px 0 0;
}
.post-single__txtbox02 h3::after {
  width: 90px;
  height: 40px;
  background-size: 65px 40px;
}
.post-single__txtbox02 p {
	width: auto;
}
.post-single__txtbox03 {
	padding: 50px 25px;
}
.post-single__txtbox03 h3 {
	font-size: 1.8rem;
}
.post-single__txtbox03 p {
	line-height: 2;
}
.post-single__section-title {
	font-size: 1.8rem;
	text-align: center;
	margin: 0 0 60px;
}
.post-single__section-title::before {
	left: 0;
	right: 0;
}
.post-single__section-title::after {
	margin: auto;
	bottom: -30px;
	left: 0;
	right: 0;
}
.post-single__section-title--features,
.post-single__section-title--technique,
.post-single__section-title--ingredient {
	margin: 75px 0 60px;
	padding: 45px 0 0;
}
.post-single__section-title--features::before {
	width: 140px;
	height: 25px;
	background-size: cover;
	top: 0;
}
.post-single__section-title--technique::before {
	width: 160px;
	height: 36px;
	background-size: cover;
	top: 0;
}
.post-single__section-title--ingredient::before {
	width: 265px;
	height: 36px;
	background-size: cover;
	top: 0;
}
.post-single__section-title span::before {
	content: none;
}	
}