@charset "UTF-8";

/* -------------------------- */
/* content */
/* -------------------------- */
#pageTitle span {
	height: 465px;
	background: url(../images/recipe/title_h1.png) no-repeat;
}

/* ----- IE hack ----- */
@media only screen and (min-width:769px) {
	*::-ms-backdrop, .introBox { /* IE11 */
		top: -465px;
		margin-bottom: -395px;
	}
}

#recipe {
	margin-bottom: 70px;
}
	#recipe .txtTitle {
		padding: 25px 0;
		background-color: #f0eee8;
		letter-spacing: 4px;
	}
	#recipe .recipeList {
		padding: 75px 0;
		border-top: 1px solid #e6e3da;
	}
		#recipe .recipeList figure {
			line-height: 0;
		}
		#recipe .recipeList:nth-of-type(1) .contentInner > figure {
			float: left;
			margin-right: 45px;
		}
		#recipe .recipeList:nth-of-type(2) .contentInner > figure {
			float: right;
			margin-left: 45px;
		}
		#recipe .recipeList .txtBox {
			overflow: hidden;
		}
			#recipe .recipeList .txtBox h3 {
				float: left;
				width: 58px;
				margin-right: 45px;
				text-indent: 100%;
				white-space: nowrap;
				overflow: hidden;
			}
				#recipe .recipeList .txtBox h3.title01 {
					height: 174px;
					background: url(../images/recipe/txt_recipe01.png) no-repeat;
				}
				#recipe .recipeList .txtBox h3.title02 {
					height: 99px;
					background: url(../images/recipe/txt_recipe02.png) no-repeat;
				}
			#recipe .recipeList .txtBox .listRecipe {
				float: left;
				width: 508px;
				border-top: 1px dashed #dfdcd2;
			}
				#recipe .recipeList .txtBox .listRecipe dt {
					clear: both;
					float: left;
					padding-top: 11px;
				}
				#recipe .recipeList .txtBox .listRecipe dt.iconLarge {
					padding-top: 23px;
				}
				#recipe .recipeList .txtBox .listRecipe dd {
					padding: 15px 0 15px 50px;
					border-bottom: 1px dashed #dfdcd2;
					font-size: 1.6rem;
					line-height: 1.6em;
				}
				#recipe .recipeList .txtBox .listRecipe dd figure,
				#recipe .caption li figure {
					padding-top: 15px;
				}
			#recipe .recipeList .txtBox .caption {
				padding-left: 103px;
			}
	#recipe .otherRecipeBox {
	}
		#recipe .otherRecipeBox .contentInner {
			padding-top: 75px;
		}
			#recipe .otherRecipeBox figure {
				float: right;
				line-height: 0;
			}
			#recipe .otherRecipeList {
				width: 642px;
			}
			#recipe .otherRecipeList:not(:last-child) {
				margin-bottom: 50px;
			}
				#recipe .otherRecipeList h3 {
					min-height: 44px;
					margin-bottom: 20px;
					padding: 8px 0 0 70px;
					background: url(../images/recipe/icon_recipe01.png) no-repeat;
					font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
					font-size: 2.4rem;
					line-height: 1.4em;
				}
				#recipe .otherRecipeList .inner {
					padding-left: 70px;
				}
					#recipe .otherRecipeList .inner .normalTxt {
						text-align: justify;
					}
					#recipe .otherRecipeList .inner .tbrNormal {
						margin-top: 25px;
					}




/* ================================================================================================================================================================================== */
/* mobile */
/* ================================================================================================================================================================================== */

/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* max-768 */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media only screen and (min-width:320px) and (max-width:768px) {

/* -------------------------- */
/* content */
/* -------------------------- */
#pageTitle span {
	height: auto;
	background: none;
}


#recipe {
	margin-bottom: 40px;
}
	#recipe .txtTitle {
		padding: 20px 0;
		letter-spacing: 0;
		line-height: 1.2em;
	}
	#recipe .recipeList {
		padding: 40px 0;
	}
		#recipe .recipeList figure {
			width: 350px;
			margin: 0 auto;
		}
		#recipe .recipeList:nth-of-type(1) .contentInner > figure {
			float: none;
			margin: 0 auto 30px;
		}
		#recipe .recipeList:nth-of-type(2) .contentInner > figure {
			float: none;
			margin: 0 auto 30px;
		}
			#recipe .recipeList figure img {
				width: 100%;
				height: auto;
			}
		#recipe .recipeList .txtBox {
			overflow: hidden;
		}
			#recipe .recipeList .txtBox h3 {
				float: none;
				width: auto;
				margin: 0 0 20px 0;
				text-indent: 0;
				white-space: normal;
				overflow: auto;
				text-align: center;
				color: #b83944;
				font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
				font-size: 2.4rem;
				line-height: 1.6em;
			}
				#recipe .recipeList .txtBox h3.title01 ,
				#recipe .recipeList .txtBox h3.title02 {
					height: auto;
					background: none;
				}
			#recipe .recipeList .txtBox .listRecipe {
				float: none;
				width: auto;
			}
				#recipe .recipeList .txtBox .listRecipe dt {
					clear: both;
					float: left;
					padding-top: 10px;
				}
				#recipe .recipeList .txtBox .listRecipe dt.iconLarge {
					padding-top: 15px;
				}
				#recipe .recipeList .txtBox .listRecipe dd {
					padding: 15px 0 15px 45px;
					font-size: 1.4rem;
					line-height: 1.4em;
				}
				#recipe .recipeList .txtBox .listRecipe dd figure {
					transform: translateX(-22px);
				}
				#recipe .caption li figure {
					transform: translateX(8px);
				}
			#recipe .recipeList .txtBox .caption {
				padding-left: 0;
			}
	#recipe .otherRecipeBox {
	}
		#recipe .otherRecipeBox .contentInner {
			padding-top: 40px;
		}
			#recipe .otherRecipeBox figure {
				float: none;
				width: 350px;
				margin: 0 auto 30px;
			}
				#recipe .otherRecipeBox figure img {
					width: 100%;
					height: auto;
				}
			#recipe .otherRecipeList {
				width: auto;
			}
			#recipe .otherRecipeList:not(:last-child) {
				margin-bottom: 40px;
			}
				#recipe .otherRecipeList h3 {
					min-height: 44px;
					margin-bottom: 20px;
					padding: 8px 0 0 65px;
					font-size: 1.8rem;
				}
				#recipe .otherRecipeList .inner {
					padding-left: 0;
				}

}



/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* max-480 */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

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

#recipe {
}
	#recipe .recipeList figure {
			width: 250px;
		}
		#recipe .recipeList:nth-of-type(1) .contentInner > figure {
			float: none;
			margin: 0 auto 20px;
		}
		#recipe .recipeList:nth-of-type(2) .contentInner > figure {
			float: none;
			margin: 0 auto 20px;
		}
	#recipe .recipeList .txtBox h3 {
		font-size: 1.8rem;
		line-height: 1.6em;
	}
	#recipe .recipeList .txtBox .listRecipe dt {
		padding-top: 10px;
	}
	#recipe .recipeList .txtBox .listRecipe dt.iconLarge {
		padding-top: 15px;
	}
	#recipe .recipeList .txtBox .listRecipe dd {
		padding: 15px 0 15px 35px;
	}
	#recipe .recipeList .txtBox .listRecipe dd figure {
		width: calc(100% + 35px);
		transform: translateX(-35px);
	}
	#recipe .caption li figure {
		width: calc(100% + 16px);
		transform: translateX(0px);
	}
	#recipe .otherRecipeBox .contentInner {
		padding-top: 20px;
	}
		#recipe .otherRecipeBox figure {
			width: 100%;
			margin: 0 0 30px;
		}
		#recipe .otherRecipeList h3 {
			min-height: 28px;
			margin-bottom: 15px;
			padding: 7px 0 0 45px;
			background-size: 35px auto;
			font-size: 1.6rem;
		}
}