/* ---------------------------------------
   レシピのベース
------------------------------------------ */
.hamburger-open .hamburger-nav{ z-index: 2; }
.hamburger-button{ z-index: 3; }
@media screen and (min-width:1080px) {
	.hamburger{ z-index: 3; }
}
#recipe-article .pc,#recipe .pc{ display: none; }
.content-button02:hover{ background: var(--main); }
/* ページ内リンク */
.recipe-nav{
	font-size: 0.9375rem;
	margin-bottom: 4.8em;
	gap: 1em 2em;
	justify-content: center;
	flex-wrap: wrap;
	display: flex; }
.recipe-nav__item{
	position: relative;
	padding-right: 1.6em; }
.recipe-nav__item a{ text-decoration: underline; }
.recipe-nav__item .arow{
	top: 0;
	bottom: 0;
	margin: auto;
	display: flex;
	align-items: center;
	right: 0;
	width: 12px;
	position: absolute; }
.recipe-nav__item:last-child{ margin-right: 0; }
/* レシピのヘッド */
.recipe-content{
	margin-top: 18vw;
	padding-top: 18vw;
	border-top: solid 1px var(--gray); }
.article-content-head__img img,
.recipe-content-head__img img{ width: 100%; }
.article-content-head__textbox{
	padding-top: 8vw;
	line-height: 2.25; }
.recipe-content-head__textbox{
	padding-top: 8vw;
	line-height: 1.8889; }
.recipe-content-head__title{
	margin-bottom: 0.675em;
	font-size: 1.714285rem; }
@media screen and (min-width:480px) {
	.recipe-content{
		margin-top: 70px;
		padding-top: 70px; }
	.recipe-content-head__title{ font-size: 2.25rem; }
}
@media screen and (min-width:768px) {
	.recipe-content{
		margin-top: 140px;
		padding-top: 140px; }
	.recipe-content-head__textbox{ padding-top: 0; }
	.recipe-nav__item a:hover{ text-decoration: none; }
	#recipe-article .sp,#recipe .sp{ display: none; }
	#recipe-article .pc,#recipe .pc{ display: block; }
	/* レシピのヘッド */
	.article-content-head,
	.recipe-content-head{
		flex-direction: row-reverse;
		flex-wrap: wrap;
		display: flex; }
}
/* ---------------------------------------
   レシピ一覧 #recipe
------------------------------------------ */
#recipe .page-title{ margin-bottom: 1.2em; }
.recipe-list{
	gap: 8vw 4vw;
	flex-wrap: wrap;
	display: flex; }
.recipe-list__item{ width: calc((100% - 4vw) / 2); }
.recipe-list__title{
	text-decoration: underline;
	position: relative;
	margin: 0.5em 0;
	color: #e2b800;
	font-size: 1.25rem; }
.recipe-list__img img{ width: 100%; }
.recipe-list__title .arow{
	right: 0;
	top: 0.75em;
	height: 0.25em;
	position: absolute;
	width: 1em;
	display: none; }
.recipe-list__title .arow:before,
.recipe-list__title .arow:after{
	content: "";
	position: absolute;
	transition: .2s;
	display: block; }
.recipe-list__title .arow:before{
	transform: rotate(-45deg);
	right: 1px;
	width: 1px;
	height: 100%;
	background: #e2b800; }
.recipe-list__title .arow:after{
	width: 100%;
	height: 1px;
	bottom: 0;
	background: #e2b800; }
.recipe-list__text{ font-size: 0.9275rem; }
@media screen and (min-width:480px) {
	.recipe-list{ gap: 30px; }
	.recipe-list__item{ width:calc((100% - 30px) / 2); }
	.recipe-list__text{ font-size: 0.8125rem; }
}
@media screen and (min-width:768px) {
	.recipe-content-head__item{ width: 50%; }
	.recipe-content-head__textbox{ padding-right: 60px; }

	.recipe-list__title{
		text-decoration: none;
		padding-right: 2.25em; }
	.recipe-list__title .arow{ display: block; }
	.recipe-list{ gap: 60px; }
	.recipe-list__item{ width:calc((100% - 120px) / 3); }
	.recipe-list__item a:hover .recipe-list__title{ text-decoration: underline; }
}
/* 追従 */
.recipe-nav-fix{
	transition: .2s;
	background: rgba(255,255,255,0.95);
	top: 0;
	transform: translateY(-100%);
	left: 0;
	z-index: 1;
	font-size: 0.9375rem;
	padding: 1.3em 5vw;
	position: fixed;
	width: 100%; }
.recipe-nav-fix.fix{ transform: translateY(0); }
.recipe-nav-fix .recipe-nav{ margin-bottom: 0; }

/* ---------------------------------------
   記事詳細 #recipe-article
------------------------------------------ */
#recipe-article .page-title{ margin-bottom: 1.5em; }
.article-content-head__title{
	margin-bottom: 0.175em;
	color: #e2b800;
	font-size: 1.714285rem; }
.article-content-head__text{ font-size: 1.125rem; }

/* 本文内見出しと共通 */
.wp-article-body h2,
.article-main__title{
	border-bottom: solid 1px var(--main);
	padding-bottom: 0.7em;
	font-size: 1.5rem; }
/* 材料 */
.article-ingredients{ width: 100%; }
.article-ingredients li{
	padding: 0.5em 1.25em;
	background: var(--gray);
	align-items: center;
	display: flex; }
.article-ingredients li+li{ margin-top: 1px; }
.article-ingredients .ingredients-name{ padding-right: 1em; }
.article-ingredients .ingredients-amount{ margin-left: auto; }
.article-content-bottom{ text-align: center; }
.article-bottom__text{
	text-align: justify;
	margin-top: 2em;
	font-size: 1.125rem;
	line-height: 2.111; }
.use-product{
	flex-wrap: wrap;
	display: flex; }
.use-product__img{ width: 30vw; }
.use-product__img,
.use-product__img img{ width: 100%; }
.use-product__textbox{
	text-align: center;
	margin-top: 4vw;
	width: 100%; }
.use-product__title{
	text-align: left;
	margin-bottom: 0.5em;
	font-size: 1.5rem; }
.use-product__text{ text-align: left; }
.use-product__button{
	margin-top: 1.25em;
	color: var(--white);
	display: inline-block;
	background: var(--main);
	padding: 0.7em 3em;
}
@media screen and (min-width:768px) {
	#recipe-article .page-title{ margin-bottom: 2.5em; }
	.article-content-head__img{ width: 60%; }
	.article-content-head__textbox{
		padding-top: 0;
		width: 40%;
		padding-right: 80px; }
	.article-content-head__title{ font-size: 2.25rem; }
	.article-content-main{
		flex-wrap: wrap;
		justify-content: flex-end;
		gap: 70px;
		display: flex; }
	.article-ingredients{ width: 360px; }
	.article-bottom__text{ text-align: center; }
	.use-product__img{ width: 240px; }
	.use-product__textbox{
		text-align: left;
		margin-top: 0;
		margin-left: 40px;
		width: calc(100% - 280px); }
	.use-product__title{ font-size: 1.75rem; }
	.use-product__button:hover{ background: #e2b800; }
}

/* 記事本文 */
.wp-article-body{
	counter-reset: number 0;
	margin-top: 8vw;
	width: 100%; }
.wp-article-body ol li{
	position: relative;
	padding-left: 1em; }
.wp-article-body ol li+li{ margin-top: 1.5em; }
.wp-article-body ol li:before{
	counter-increment: number 1;
 	 content: counter(number) ".";
	left: 0;
	position: absolute;
}
.wp-article-body h2{ margin-bottom: 1.5em; }
.wp-article-body h2:nth-child(n+2){ margin-top: 3em; }
.wp-article-body p{ line-height: 2; }
.wp-article-body a{ display: inline-block; text-decoration: underline; color: #e2b800;}
.use-product__textbox a { color: #fff; text-decoration: none;}
@media screen and (min-width:768px) {
	.wp-article-body{
		margin-top: 0;
		width:calc(100% - 430px); }
}