@charset "Shift_JIS";

h1,
h2,
h3,
h4 {
	padding: 0;
	margin: 0;
	border: none;
	background: none;
	color: inherit;
}

h2 {
	height: auto;
}

a:hover img.Aover {
	opacity: 0.7;
	filter: alpha(opacity=70);
}

body {
	min-width: 860px;
	margin: 0 auto;
}

@media screen and (max-width: 767px) {
	body {
		min-width: 100%;
	}
}

/* ================================================

   biteki 261001 / autumn interior (PC)

================================================ */
#contentWrap {
	width: 100%;
	min-width: 800px;
	margin: 0 auto;
	overflow: hidden;
	background: #ffffff;
	text-align: left;
	font-family: 'Noto Serif JP', serif;
	font-weight: 200;
	color: #5f450d;
	font-feature-settings: normal;
	text-spacing-trim: space-all;
}

#contentWrap img,
#presentWrap img {
	vertical-align: bottom;
}

#contentWrap p {
	margin: 0;
	padding: 0;
}

#contentWrap ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#contentWrap .ttl img,
#contentWrap .side img,
#contentWrap .img img,
#contentWrap .eff img {
	width: 100%;
	height: auto;
}

/* ================================================

   .main_block

================================================ */
#contentWrap .main_block {
	position: relative;
}

#contentWrap .main_ttl img {
	width: 100%;
	height: auto;
}

#contentWrap .logo_biteki {
	position: absolute;
	top: 4.95%;
	left: 72.9%;
	width: 21.7%;
	z-index: 1;
}

#contentWrap .logo_biteki a {
	display: block;
}

#contentWrap .logo_biteki img {
	width: 100%;
	height: auto;
}

/* ================================================

   .contents
   ※各ブロックは幅720pxの内側コンテナ基準で絶対配置

================================================ */
#contentWrap .contents {
	background: #fff5f1;
}

#contentWrap .intro,
#contentWrap .sec01,
#contentWrap .sec02,
#contentWrap .sec03 {
	position: relative;
}

#contentWrap .intro_inner,
#contentWrap .sec01_inner,
#contentWrap .sec02_inner,
#contentWrap .sec03_inner {
	position: relative;
	width: 720px;
	margin: 0 auto;
}

#contentWrap .img,
#contentWrap .ttl,
#contentWrap .side,
#contentWrap .txt,
#contentWrap .eff {
	position: absolute;
}

#contentWrap .side {
	z-index: 1;
}

/* 本文 */
#contentWrap .txt {
	font-size: 15px;
	line-height: 35px;
	letter-spacing: 0.08em;
	white-space: nowrap;
}

/* 葉の影（乗算） */
#contentWrap .eff {
	line-height: 0;
	pointer-events: none;
}

#contentWrap .eff img {
	mix-blend-mode: multiply;
}

#contentWrap .eff01 {
	top: 151px;
	left: 0;
	width: 369px;
}

#contentWrap .eff02 {
	top: 682px;
	right: -0.5px;
	width: 382.5px;
}



#contentWrap .eff03 {
	top: 763px;
	right: -1px;
	width: 282.5px;
}

/* ================================================

   .intro

================================================ */
#contentWrap .intro_inner {
	height: 1196px;
}

#contentWrap .intro_lead {
	position: absolute;
	top: 61.5px;
	left: 0;
	width: 100%;
	padding-left: 4px;
	box-sizing: border-box;
	font-size: 16px;
	line-height: 37px;
	letter-spacing: 0.08em;
	text-align: center;
	white-space: nowrap;
	color: #583b0e;
}

#contentWrap .intro .img01 {
	top: 427px;
	left: 0;
	width: 302px;
}

#contentWrap .intro .img02 {
	top: 861px;
	left: 136px;
	width: 198px;
}

#contentWrap .intro .img03 {
	top: 350px;
	left: 490px;
	width: 230px;
}

#contentWrap .intro .ttl {
	top: 588px;
	left: 585.5px;
	width: 113.32px;
}

#contentWrap .intro_txt {
	position: absolute;
	top: 589.3px;
	left: 360.5px;
	width: 180px;
	font-size: 16px;
	line-height: 36px;
	letter-spacing: 0.08em;
	white-space: nowrap;
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
}

#contentWrap .intro_txt .tcy {
	-webkit-text-orientation: upright;
	text-orientation: upright;
	text-combine-upright: none;
}

#contentWrap .c-red {
	color: #aa152f;
}

#contentWrap .c-yellow {
	color: #daa40d;
}

#contentWrap .c-orange {
	color: #e47e18;
}

/* ================================================

   .sec01 #01 color

================================================ */
#contentWrap .sec01_inner {
	height: 1112px;
}

#contentWrap .sec01 .side {
	top: 0;
	left: 627.5px;
	width: 117.08px;
}

#contentWrap .sec01 .ttl {
	top: 69.5px;
	left: 3.5px;
	width: 151.22px;
}

#contentWrap .sec01 .img04 {
	top: 90px;
	left: 210px;
	width: 510px;
}

#contentWrap .sec01 .img05 {
	top: 522px;
	left: 0;
	width: 234px;
}

#contentWrap .sec01 .img06 {
	top: 692px;
	left: 0;
	width: 234px;
}

#contentWrap .sec01 .txt {
	top: 534.67px;
	left: 290px;
}

/* ================================================

   .sec02 #02 fabric

================================================ */
#contentWrap .sec02_inner {
	height: 1055px;
}

#contentWrap .sec02 .side {
	top: 0;
	left: 444.5px;
	width: 251.35px;
}

#contentWrap .sec02 .img07 {
	top: 64px;
	left: 0;
	width: 480.5px;
}

#contentWrap .sec02 .ttl {
	top: 213.5px;
	left: 539.5px;
	width: 175.06px;
}

#contentWrap .sec02 .txt {
	top: 402.68px;
	left: 0;
}

#contentWrap .sec02 .img08 {
	top: 840px;
	left: 240px;
	width: 212px;
}

#contentWrap .sec02 .img09 {
	top: 688px;
	left: 490px;
	width: 250px;
}

/* ================================================

   .sec03 #03 small items

================================================ */
#contentWrap .sec03_inner {
	height: 1166px;
}

#contentWrap .sec03 .side {
	top: 0;
	left: 3px;
	width: 118.15px;
}

#contentWrap .sec03 .img10 {
	top: 189px;
	left: 64px;
	width: 592px;
}

#contentWrap .sec03 .ttl {
	top: 683.5px;
	left: 10.5px;
	width: 260.22px;
}

#contentWrap .sec03 .txt {
	top: 675px;
	left: 318px;
}

/* ================================================

   .product

================================================ */
#contentWrap .product {
	padding-bottom: 165px;
}

#contentWrap .product_inner {
	position: relative;
	width: 720px;
	height: 1060px;
	margin: 0 auto;
	background: url(../images/product_bg.png) no-repeat 0 0 / 720px 1060px;
}

#contentWrap .product_inner::before,
#contentWrap .product_inner::after {
	content: "";
	position: absolute;
	box-sizing: border-box;
	pointer-events: none;
}

#contentWrap .product_inner::before {
	top: 24.5px;
	right: 25px;
	bottom: 24.5px;
	left: 25px;
	background: #ffffff;
}

#contentWrap .product_inner::after {
	top: 30.5px;
	right: 31px;
	bottom: 30.5px;
	left: 31px;
	border: 1px solid #b3b59e;
}

#contentWrap .product_ttl {
	position: absolute;
	top: 104.5px;
	left: 109.5px;
	width: 501.19px;
}

#contentWrap .product_ttl img {
	width: 100%;
	height: auto;
}

#contentWrap .product_img {
	position: absolute;
	top: 245px;
	left: 112px;
	width: 543.5px;
}

#contentWrap .product_img img {
	width: 100%;
	height: auto;
}

#contentWrap .product .txt {
	top: 650px;
	left: 112px;
	width: 498px;
	line-height: 34px;
	white-space: normal;
}

#contentWrap .product .btn-wrap {
	position: absolute;
	top: 875px;
	left: 87.5px;
	z-index: 2;
	display: flex;
}

#contentWrap .product .btn-wrap li + li {
	margin-left: 25px;
}

#contentWrap .product .btn-wrap a {
	display: block;
	width: 260px;
}

#contentWrap .product .btn-wrap img {
	width: 100%;
	height: auto;
}

#headerWrap_sp,
#contentWrap_sp,
#presentWrap_sp {
	display: none;
}
/* ================================================

   SP版
   ※750px幅デザイン基準（1px = 0.1333vw）で配置

================================================ */
@media screen and (max-width: 767px) {

	#contentWrap,
	#presentWrap {
		display: none;
	}

	#contentWrap_sp,
	#presentWrap_sp {
		display: block;
	}

	#contentWrap_sp {
		overflow-x: clip;
		background: #fff5f1;
		text-align: left;
		font-family: 'Noto Serif JP', serif;
		font-weight: 200;
		color: #583b0e;
		font-feature-settings: normal;
		text-spacing-trim: space-all;
	}

	#contentWrap_sp img,
	#presentWrap_sp img {
		width: 100%;
		height: auto;
		vertical-align: bottom;
	}

	#contentWrap_sp ul,
	#contentWrap_sp p {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	#contentWrap_sp section {
		position: relative;
	}

	#contentWrap_sp .img,
	#contentWrap_sp .ttl,
	#contentWrap_sp .txt,
	#contentWrap_sp .eff {
		position: absolute;
	}

	/* 本文 */
	#contentWrap_sp .txt {
		font-size: 4vw;
		line-height: 8.533vw;
		letter-spacing: 0.08em;
		line-break: strict;
	}

	/* 葉の影（乗算） */
	#contentWrap_sp .eff {
		line-height: 0;
		pointer-events: none;
	}

	#contentWrap_sp .eff img {
		mix-blend-mode: multiply;
	}

	#contentWrap_sp .c-red {
		color: #aa152f;
	}

	#contentWrap_sp .c-yellow {
		color: #daa40d;
	}

	#contentWrap_sp .c-orange {
		color: #e47e18;
	}

	/* ================================================

   .main_block SP版

================================================ */
	#contentWrap_sp .main_block {
		position: relative;
	}

	#contentWrap_sp .logo_biteki {
		position: absolute;
		top: 4.933vw;
		left: 3.933vw;
		width: 37.067vw;
		z-index: 0.267vw;
	}

	#contentWrap_sp .logo_biteki a {
		display: block;
	}

	/* ================================================

   .intro SP版

================================================ */
	#contentWrap_sp .intro {
		height: 392.733vw;
	}

	#contentWrap_sp .intro_lead {
		position: absolute;
		top: -0.61vw;
		left: 0;
		width: 100%;
		padding-left: 0.32vw;
		box-sizing: border-box;
		font-size: 4vw;
		line-height: 9.333vw;
		letter-spacing: 0.08em;
		text-align: center;
		white-space: nowrap;
	}

	#contentWrap_sp .eff01 {
		top: 76.2vw;
		left: 0;
		width: 69.333vw;
	}

	#contentWrap_sp .intro .img01 {
		top: 108.067vw;
		left: 39.2vw;
		width: 54vw;
	}

	#contentWrap_sp .intro .ttl01 {
		top: 161.2vw;
		left: 61.867vw;
		width: 26.912vw;
	}

	#contentWrap_sp .intro_txt {
		position: absolute;
		top: 161.179vw;
		left: 9.74vw;
		width: 44.667vw;
		font-size: 4vw;
		line-height: 8.933vw;
		letter-spacing: 0.08em;
		white-space: nowrap;
		color: #5f450d;
		-webkit-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
	}

	#contentWrap_sp .intro_txt .tcy {
		-webkit-text-orientation: upright;
		text-orientation: upright;
		text-combine-upright: none;
	}

	#contentWrap_sp .intro .img02 {
		top: 268.6vw;
		left: 10.667vw;
		width: 79.467vw;
	}

	/* ================================================

   .sec01 SP版 #01 color

================================================ */
	#contentWrap_sp .sec01 {
		height: 438.867vw;
	}

	#contentWrap_sp .sec01 .ttl02 {
		top: 0;
		left: 6.867vw;
		width: 82.449vw;
		z-index: 0.133vw;
	}

	#contentWrap_sp .sec01 .img03 {
		top: 32.4vw;
		left: 6.667vw;
		width: 86.667vw;
	}

	#contentWrap_sp .sec01 .ttl03 {
		top: 128.267vw;
		left: 8.667vw;
		width: 70.792vw;
	}

	#contentWrap_sp .sec01 .txt {
		top: 172.343vw;
		left: 8.667vw;
		width: 82.667vw;
	}

	#contentWrap_sp .sec01 .img04 {
		top: 290.533vw;
		left: 8.667vw;
		width: 82.667vw;
	}

	#contentWrap_sp .eff02 {
		top: 373.667vw;
		right: 0;
		width: 74.733vw;
	}

	/* 書き出し画像がデザインより淡いため、同じ画像を重ねて濃度を合わせる */
	#contentWrap_sp .eff02::after {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: url(../images_sp/eff02.png) no-repeat 0 0 / 100% 100%;
		mix-blend-mode: multiply;
		opacity: 0.59;
	}

	/* ================================================

   .sec02 SP版 #02 fabric

================================================ */
	#contentWrap_sp .sec02 {
		height: 457.4vw;
	}

	#contentWrap_sp .sec02 .ttl04 {
		top: 0;
		left: 9.267vw;
		width: 84.043vw;
	}

	#contentWrap_sp .sec02 .img05 {
		top: 61vw;
		left: 0;
		width: 100vw;
	}

	#contentWrap_sp .sec02 .ttl05 {
		top: 137.2vw;
		left: 8.8vw;
		width: 79.995vw;
	}

	#contentWrap_sp .sec02 .txt {
		top: 180.953vw;
		left: 8.667vw;
		width: 82.667vw;
	}

	#contentWrap_sp .sec02 .img06 {
		top: 286.6vw;
		left: 8.667vw;
		width: 82.667vw;
	}

	/* ================================================

   .sec03 SP版 #03 small items

================================================ */
	#contentWrap_sp .sec03 {
		height: 452.933vw;
	}

	#contentWrap_sp .eff03 {
		top: 9.667vw;
		left: 50.6vw;
		width: 49.267vw;
	}

	#contentWrap_sp .sec03 .ttl06 {
		top: 0;
		left: 6.867vw;
		width: 86.707vw;
	}

	#contentWrap_sp .sec03 .img07 {
		top: 105.733vw;
		left: 13.6vw;
		width: 72.8vw;
	}

	#contentWrap_sp .sec03 .txt {
		top: 221.097vw;
		left: 8.667vw;
		width: 82.667vw;
	}

	#contentWrap_sp .sec03 .img08 {
		top: 328.8vw;
		left: 8.267vw;
		width: 63.667vw;
	}

	/* ================================================

   .product SP版

================================================ */
	#contentWrap_sp .product {
		padding-bottom: 22.667vw;
	}

	#contentWrap_sp .product_inner {
		position: relative;
		height: 366.667vw;
		background: url(../images_sp/product_bg.png) no-repeat 0 0 / 100% auto;
	}

	#contentWrap_sp .product_inner::before,
	#contentWrap_sp .product_inner::after {
		content: "";
		position: absolute;
		box-sizing: border-box;
		pointer-events: none;
	}

	#contentWrap_sp .product_inner::before {
		top: 5.333vw;
		right: 5.333vw;
		bottom: 5.333vw;
		left: 5.333vw;
		background: #ffffff;
	}

	#contentWrap_sp .product_inner::after {
		top: 6.667vw;
		right: 6.667vw;
		bottom: 6.667vw;
		left: 6.667vw;
		border: 1px solid #b3b59e;
	}

	#contentWrap_sp .product_ttl {
		position: absolute;
		top: 22vw;
		left: 15.533vw;
		width: 69.264vw;
		z-index: 0.133vw;
	}

	#contentWrap_sp .product_img01 {
		position: absolute;
		top: 61.267vw;
		left: 13.133vw;
		width: 75.333vw;
		z-index: 0.133vw;
	}

	#contentWrap_sp .product .txt {
		top: 168.897vw;
		left: 12.667vw;
		width: 74.667vw;
		line-height: 8.268vw;
		letter-spacing: 0;
		z-index: 0.133vw;
	}

	#contentWrap_sp .product_img02 {
		position: absolute;
		top: 246.533vw;
		left: 12.667vw;
		width: 74.667vw;
		z-index: 0.133vw;
	}

	#contentWrap_sp .product .btn-wrap {
		position: absolute;
		top: 307.867vw;
		left: 12.667vw;
		width: 74.667vw;
		z-index: 0.267vw;
	}

	#contentWrap_sp .product .btn-wrap li + li {
		margin-top: 4.733vw;
	}

	#contentWrap_sp .product .btn-wrap a {
		display: block;
	}

}

/* ================================================

   present

================================================ */
#presentWrap {
	padding: 104px 0 0;
	background: #FFFFFF;
}

#presentWrap .present_box {
	width: 800px;
	padding: 17px;
	box-sizing: border-box;
	background: #FEDE84;
	margin: 0 auto;
}

#presentWrap .present_box_inner {
	position: relative;
	background: #FFFFFF;
	box-shadow: 0 0 3px rgba(0, 0, 0, .2);
}

#presentWrap .present_tag {
	position: absolute;
	top: -23px;
	left: -23px;
	z-index: 1;
}

#presentWrap .present_outline {
	padding: 30px 0 30px 180px;
	position: relative;
}

#presentWrap .present_outline .img {
	position: absolute;
	top: 30px;
	left: 32px;
}

#presentWrap .present_outline .ttl {
	text-align: left;
}

#presentWrap .present_outline .note {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 12px;
	line-height: 1.6;
	color: #4d4d4d;
	text-align: left;
	letter-spacing: -0.04em;
	margin-top: 20px;
}

#presentWrap .present_outline .period {
	width: 222px;
	position: absolute;
	bottom: 88px;
	right: 17px;
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;
	padding: 8px 0 10px;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 14px;
	line-height: 1.43;
	color: #000000;
	text-align: center;
	letter-spacing: -0.04em;
	font-feature-settings: 'palt';
}

#presentWrap .present_btn {
	position: absolute;
	bottom: 24px;
	right: 17px;
}

@media screen and (max-width: 767px) {
	#presentWrap_sp {
		margin: 21.9vw 0;
		background: #FFFFFF;
	}

	#presentWrap_sp .present_box {
		width: 82.66vw;
		padding: 3vw;
		box-sizing: border-box;
		background: #FEDE84;
		margin: 0 auto;
	}

	#presentWrap_sp .present_box_inner {
		background: #FFFFFF;
		position: relative;
		box-shadow: 0 0 3px rgba(0, 0, 0, .2);
	}

	#presentWrap_sp .present_tag {
		width: 20.9vw;
		height: 20.9vw;
		position: absolute;
		top: -4.5vw;
		left: -4.5vw;
		z-index: 1;
	}

	#presentWrap_sp .present_outline {
		padding: 7.2vw 0 5vw;
	}

	#presentWrap_sp .present_outline .img {
		width: 62.6vw;
		margin: 0 auto;
	}

	#presentWrap_sp .present_outline .ttl {
		width: 63.5vw;
		margin: 4vw auto;
	}

	#presentWrap_sp .present_outline .note {
		width: 62.66vw;
		margin: 0 auto;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 2.6vw;
		line-height: 1.5;
		color: #4d4d4d;
		text-align: left;
		letter-spacing: -0.04em;
	}

	#presentWrap_sp .present_outline .note li {
		text-indent: -1em;
		padding-left: 1em;
	}

	#presentWrap_sp .present_outline .period {
		width: 62.66vw;
		margin: 3vw auto 0;
		padding: 2vw 0;
		border-top: 1px solid #000000;
		border-bottom: 1px solid #000000;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 3.73vw;
		line-height: 1.5;
		color: #000000;
		text-align: center;
		letter-spacing: -0.04em;
		font-feature-settings: 'palt';
	}

	#presentWrap_sp .present_btn {
		width: 62.8vw;
		margin: 0 auto;
		padding-bottom: 6vw;
	}
}

/* wrapFooter

ページ下部のリンク周り
------------------------------------------------ */
#wrapFooter {
	text-align: left;
	width: 800px;
	margin: 138px auto 0;
}

#wrapFooter a:hover {
	color: #eb5a7e;
}

@media screen and (max-width: 767px) {
	#wrapFooter {
		width: 82.667%;
		margin: 21.733vw auto 0;
	}
}

/* おすすめ記事
------------------------------------------------ */
.recommend>h3 {
	border-top: 2px solid #999;
	position: relative;
	text-align: center;
	font-size: 18px;
	font-weight: normal;
	padding: 30px 0 0;
}

.recommend>h3::after {
	content: "";
	width: 100%;
	height: 1px;
	background: #999;
	position: absolute;
	top: 2px;
	left: 0;
}

.recommend .articles {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.recommend .articles::after {
	content: "";
	width: 250px;
}

.recommend article {
	padding-top: 25px;
}

.recommend article a {
	display: block;
	width: 250px;
	color: #000;
	text-decoration: none;
}

.recommend article h4 {
	font-size: 13px;
	line-height: 1.5;
	font-weight: normal;
	padding-top: 8px;
}

.recommend article h4 .newline {
	display: inline-block;
}

.recommend .toBiteki {
	padding-top: 60px;
}

.recommend .toBiteki a {
	display: block;
	width: 250px;
	font-size: 13px;
	text-align: center;
	line-height: 1;
	padding: 18px 0 18px 10px;
	margin: 0 auto;
	border: 1px solid #999;
	box-sizing: border-box;
	color: #000;
	text-decoration: none;
	position: relative;
}

.recommend .toBiteki a::after {
	content: "";
	width: 16px;
	height: 6px;
	border-top: 6px solid transparent;
	border-left: 8px solid transparent;
	border-bottom: 6px solid transparent;
	border-right: 8px solid #000;
	box-sizing: border-box;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -6px;
	margin-left: -110px;
}

.recommend .toBiteki a:hover::after {
	border-right-color: #eb5a7e;
}

@media screen and (max-width: 767px) {
	.recommend>h3 {
		font-size: 16px;
		padding: 25px 0 5px;
	}

	.recommend .articles {
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-flex-wrap: nowrap;
		flex-wrap: nowrap;
	}

	.recommend article a {
		width: 100%;
		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
	}

	.recommend article .img {
		width: 40%;
	}

	.recommend article img {
		width: 100%;
		height: auto;
	}

	.recommend article h4 {
		width: 55%;
		padding: 0 0 0 5%;
	}

	.recommend .toBiteki {
		padding-top: 8%;
	}

	.recommend .toBiteki a {
		width: 100%;
		max-width: 320px;
	}
}

/* footer のマージン調整
------------------------------------------------ */
#footer.clfix {
	margin-bottom: 30px;
}
