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

.section-feature02 {
	overflow: hidden;
	padding: 20px 0;
}

.h2-header01 {
	overflow: hidden;
	background: url(/sp/recipe/feature/img/img_header01.png) no-repeat right top;
	background-size: 171px 75px;
	height: 75px;
	border-bottom: 3px solid #fad4b7;
}
	.h2-header01 h2 {
		padding: 25px 0 0 20px;
		color: #434343;
		font-size: 143%;
		font-weight: bold;
	}
		.h2-header01 h2 span {
			color: #ff7272;
		}

.section-feature01 {
	overflow: hidden;
	padding: 10px 10px 5px 10px;
	background: #f9eadf;
}

/* !sample.html
---------------------------------------------------------- */
.section-feature03 {
	overflow: hidden;
	padding: 10px 0 17px 0;
}

.special-list01-box {
	overflow: hidden;
	background: #f9eadf;
	padding-bottom: 13px;
	margin-top: 10px;
}
	.special-list01-box .header01 {
		background: #c31c29;
		padding: 15px 10px 14px 16px;
		color: #fff;
		font-size: 143%;
		font-weight: bold;
		line-height: 1;
	}
	.special-list01-box ul {
		display: table;
		width: 100%;
		margin-bottom: 10px;
		text-align: center;
	}
		.special-list01-box ul li {
			display: table-cell;
			width:100%;
		}
		.special-list01-box ul.col2 li {
			width:50%;
		}
		.special-list01-box ul.col3 li {
			width:33.3%;
		}
	.special-list01-box .txt01 {
		padding: 0 15px 1px 15px;
		color: #535353;
		line-height: 1.4;
	}
	.special-list01-box .link01 {
		float: right;
		text-align: right;
		padding: 0 15px 0 15px;
		line-height: 1.2;
	}
		.special-list01-box .link01 a {
			color: #00249d;
			text-decoration: none;
		}

.special-list02-box {
	overflow: hidden;
	background: #f9eadf;
	padding: 0 10px 20px 10px;
}
	.special-list01 {
		overflow: hidden;
		margin-bottom: 10px;
	}
		.special-list01 > li {
			overflow: hidden;
			margin-bottom: 10px;
			padding-bottom: 14px;
			background: #fff;
			border: 1px solid #e0d2c8;
			-webkit-border-radius: 2px;
			-moz-border-radius: 2px;
			border-radius: 2px;
		}
			.special-list01 > li a {
				text-decoration: none;
			}
			.special-list01 > li .header01 {
				padding: 17px 23px 13px 15px;
				color: #434343;
				font-size: 122%;
				font-weight: bold;
				line-height: 1;
				border-bottom: 3px solid #c31c29;
				position: relative;
			}
				.special-list01 > li .header01:before {
					display: block;
					content: "";
					position: absolute;
					right: 9px;
					top: 50%;
					background: url(/sp/recipe/common/img/parts/parts.png) no-repeat right top;
					background-size: 132px 1054px;
					background-position: 0 -228px;
					width: 13px;
					height: 28px;
					margin-top: -13px;
				}
				
			.special-list01 > li .list-box01 {
				overflow: hidden;
				padding: 4px 5px 0 5px;
				margin-bottom: 11px;
			}
				.special-list01 > li .list-box01 > p {
					float: left;
					margin-right: 7px;
				}
				.special-list01 > li .list-box01 > ul {
					overflow: hidden;
					background: url(/sp/recipe/common/img/bg_line01.png) repeat-x left top;
					background-size: 3px 1px;
				}
					.special-list01 > li .list-box01 > ul > li {
						overflow: hidden;
						display: table;
						width: 100%;
						height: 50px;
						background: url(/sp/recipe/common/img/bg_line01.png) repeat-x left bottom;
						background-size: 3px 1px;
						position: relative;
					}
						.special-list01 > li .list-box01 > ul > li > p {
							display: table-cell;
							vertical-align: middle;
							word-break: break-all;
							color: #595959;
							line-height: 1;
						}
							.special-list01 > li .list-box01 > ul > li > p > span {
								font-size: 86%;
							}

						.special-list01 > li .list-box01 > ul > li.icn-time > p {
							padding: 0 6px 0 23px;
						}
							.special-list01 > li .list-box01 > ul > li.icn-time > p:before {
								content: "";
								display: block;
								width: 16px;
								height: 16px;
								background: url(/sp/recipe/common/img/parts/parts.png) no-repeat left top;
								background-size: 132px 1054px;
								background-position: 0 -901px;
								left: 2px;
								top: 50%;
								margin-top: -8px;
								position: absolute;
							}
						.special-list01 > li .list-box01 > ul > li.icn-energy > p {
							padding: 0 6px 0 23px;
						}
							.special-list01 > li .list-box01 > ul > li.icn-energy > p:before {
								content: "";
								display: block;
								width: 14px;
								height: 18px;
								background: url(/sp/recipe/common/img/parts/parts.png) no-repeat left top;
								background-size: 132px 1054px;
								background-position: 0 -422px;
								left: 2px;
								top: 50%;
								margin-top: -9px;
								position: absolute;
							}
						.special-list01 > li .list-box01 > ul > li.icn-calcium > p {
							padding: 0 6px 0 25px;
						}
						.special-list01 > li .list-box01 > ul > li.icn-calcium > p:before {
							content: "";
							display: block;
							width: 17px;
							height: 18px;
							background: url(/sp/recipe/common/img/parts/parts.png) no-repeat left top;
							background-size: 132px 1054px;
							background-position: 0 -300px;
							left: 2px;
							top: 50%;
							margin-top: -9px;
							position: absolute;
						}
						

			.special-list01 > li > .btn01 {
				overflow: hidden;
				padding: 0 10px 0 10px;
			}
				.special-list01 > li > .btn01 > a {
					display: block;
					height: 38px;
					line-height: 38px;
					color: #434343;
					text-align: center;
					text-decoration: none;
					background: #fcf4f4;
					background: -webkit-gradient(linear, 0 0, 0 bottom, from(#fcf4f4), to(#f9e8e9));
					background: -webkit-linear-gradient(#fcf4f4, #f9e8e9);
					background: -moz-linear-gradient(#fcf4f4, #f9e8e9);
					background: -ms-linear-gradient(#fcf4f4, #f9e8e9);
					background: -o-linear-gradient(#fcf4f4, #f9e8e9);
					background: linear-gradient(#fcf4f4, #f9e8e9);
					border: 1px solid #c31c29;
					-webkit-border-radius: 3px;
					-moz-border-radius: 3px;
					border-radius: 3px;
					position: relative;
				}
					.special-list01 > li > .btn01 > a:before {
						content: "";
						display: block;
						width: 9px;
						height: 14px;
						background: url(/sp/recipe/common/img/parts/parts.png) no-repeat right top;
						background-size: 132px 1054px;
						background-position: 0 -212px;
						right: 8px;
						top: 50%;
						margin-top: -7px;
						position: absolute;
					}
					
	.special-list02-box .txt-box01 {
		padding: 0 10px 0 10px;
		margin-bottom: 11px;
	}
		.special-list02-box .txt-box01 p {
			float: left;
			width: 82%;
			color: #535353;
			line-height: 1.4;
			padding-right: 12px;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
		}
		.special-list02-box .txt-box01 div {
			float: right;
			width: 18%;
			text-align: right;
		}
			.special-list02-box .txt-box01 div img {
				border: 1px solid #dcdcdc;
			}
					
	.special-list02-box .comment-box01 {
		margin: 0 10px 15px 63px;
		padding: 8px 10px 9px 10px;
		color: #535353;
		font-size: 86%;
		line-height: 1.4;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px;
		border: solid 1px #a2d8f2;
		min-height: 35px;
		position: relative;
	}
		.special-list02-box .comment-box01:before {
			content: "";
			display: block;
			width: 34px;
			height: 54px;
			background: url(/sp/recipe/common/img/parts/parts.png) no-repeat left top;
			background-size: 132px 1054px;
			background-position: 0 -955px;
			left: -49px;
			top: 4px;
			position: absolute;
		}
		.special-list02-box .comment-box01:after {
			content: "";
			display: block;
			width: 13px;
			height: 22px;
			background: url(/sp/recipe/common/img/parts/parts.png) no-repeat left top;
			background-size: 132px 1054px;
			background-position: 0 -380px;
			left: -13px;
			top: 18px;
			position: absolute;
		}

	.special-list02-box .btn-link01 {
		overflow: hidden;
		margin: 0 5px 0 5px;
		height: 40px;
		line-height: 40px;
	}
		.special-list02-box .btn-link01 a {
			display: block;
			height: 40px;
			line-height: 40px;
			color: #fff;
			font-size: 108%;
			font-weight: bold;
			text-align: center;
			text-decoration: none;
			background: #d5616a;
			background: -webkit-gradient(linear, 0 0, 0 bottom, from(#d5616a), to(#c31d2a));
			background: -webkit-linear-gradient(#d5616a, #c31d2a);
			background: -moz-linear-gradient(#d5616a, #c31d2a);
			background: -ms-linear-gradient(#d5616a, #c31d2a);
			background: -o-linear-gradient(#d5616a, #c31d2a);
			background: linear-gradient(#d5616a, #c31d2a);
			-webkit-border-radius: 3px;
			-moz-border-radius: 3px;
			border-radius: 3px;
			position: relative;
		}
			.special-list02-box .btn-link01 a:before {
				content: "";
				display: block;
				width: 9px;
				height: 14px;
				background: url(/sp/recipe/common/img/parts/parts.png) no-repeat right top;
				background-size: 132px 1054px;
				background-position: 0 -284px;
				right: 12px;
				top: 50%;
				margin-top: -7px;
				position: absolute;
			}



/* カラー設定:ピンク */
.main.theme-pink .cts-title {
	background: #ff9696;
}
.main.theme-pink .special-list01 > li .header01 {
	border-color: #ff9696;
}
.main.theme-pink .special-list01 > li > .btn-detail > a {
	background: #ff9696;
	background: -webkit-gradient(linear, 0 0, 0 bottom, from(#fff1f6), to(#ffe2ea));
	background: -webkit-linear-gradient(#fff1f6, #ffe2ea);
	background: -moz-linear-gradient(#fff1f6, #ffe2ea);
	background: -ms-linear-gradient(#fff1f6, #ffe2ea);
	background: -o-linear-gradient(#fff1f6, #ffe2ea);
	background: linear-gradient(#fff1f6, #ffe2ea);
	border-color: #ff9696;
}
.main.theme-pink .btn-moreinfo a {
	background: #ff9696;
}
.main.theme-pink .special-list01-box,
.main.theme-pink .special-list02-box {
	background-color: #ffebeb;
}

/* カラー設定:緑 */
.main.theme-green .cts-title {
	background: #6fb442;
}
.main.theme-green .special-list01 > li .header01 {
	border-color: #6fb442;
}
.main.theme-green .special-list01 > li > .btn-detail > a {
	background: #6fb442;
	background: -webkit-gradient(linear, 0 0, 0 bottom, from(#f5fcf3), to(#ecf9e8));
	background: -webkit-linear-gradient(#f5fcf3, #ecf9e8);
	background: -moz-linear-gradient(#f5fcf3, #ecf9e8);
	background: -ms-linear-gradient(#f5fcf3, #ecf9e8);
	background: -o-linear-gradient(#f5fcf3, #ecf9e8);
	background: linear-gradient(#f5fcf3, #ecf9e8);
	border-color: #6fb442;
}
.main.theme-green .btn-moreinfo a {
	background: #6fb442;
}
.main.theme-green .special-list01-box,
.main.theme-green .special-list02-box {
	background-color: #e6f5cd;
}

/* カラー設定:ブルー */
.main.theme-blue .cts-title {
	background: #00b7ee;
}
.main.theme-blue .special-list01 > li .header01 {
	border-color: #00b7ee;
}
.main.theme-blue .special-list01 > li > .btn-detail > a {
	background: #00b7ee;
	background: -webkit-gradient(linear, 0 0, 0 bottom, from(#f4f7fc), to(#e8eef9));
	background: -webkit-linear-gradient(#f4f7fc, #e8eef9);
	background: -moz-linear-gradient(#f4f7fc, #e8eef9);
	background: -ms-linear-gradient(#f4f7fc, #e8eef9);
	background: -o-linear-gradient(#f4f7fc, #e8eef9);
	background: linear-gradient(#f4f7fc, #e8eef9);
	border-color: #00b7ee;
}
.main.theme-blue .btn-moreinfo a {
	background: #00b7ee;
}
.main.theme-blue .special-list01-box,
.main.theme-blue .special-list02-box {
	background-color: #e0f1f6;
}

/* カラー設定:オレンジ */
.main.theme-orange .cts-title {
	background: #f39800;
}
.main.theme-orange .special-list01 > li .header01 {
	border-color: #f39800;
}
.main.theme-orange .special-list01 > li > .btn-detail > a {
	background: #f39800;
	background: -webkit-gradient(linear, 0 0, 0 bottom, from(#fff7f1), to(#fff0e2));
	background: -webkit-linear-gradient(#fff7f1, #fff0e2);
	background: -moz-linear-gradient(#fff7f1, #fff0e2);
	background: -ms-linear-gradient(#fff7f1, #fff0e2);
	background: -o-linear-gradient(#fff7f1, #fff0e2);
	background: linear-gradient(#fff7f1, #fff0e2);
	border-color: #f39800;
}
.main.theme-orange .btn-moreinfo a {
	background: #f39800;
}
.main.theme-orange .special-list01-box,
.main.theme-orange .special-list02-box {
	background-color: #f7f1d5;
}

/* カラー設定:紫 */
.main.theme-purple .cts-title {
	background: #ce7caa;
}
.main.theme-purple .special-list01 > li .header01 {
	border-color: #ce7caa;
}
.main.theme-purple .special-list01 > li > .btn-detail > a {
	background: #ce7caa;
	background: -webkit-gradient(linear, 0 0, 0 bottom, from(#faf1ff), to(#f7e2ff));
	background: -webkit-linear-gradient(#faf1ff, #f7e2ff);
	background: -moz-linear-gradient(#faf1ff, #f7e2ff);
	background: -ms-linear-gradient(#faf1ff, #f7e2ff);
	background: -o-linear-gradient(#faf1ff, #f7e2ff);
	background: linear-gradient(#faf1ff, #f7e2ff);
	border-color: #ce7caa;
}
.main.theme-purple .btn-moreinfo a {
	background: #ce7caa;
}
.main.theme-purple .special-list01-box,
.main.theme-purple .special-list02-box {
	background-color: #f7efd3;
}

.main.theme-purple .special-list01 > li .header01 {
	border-color: #ce7caa;
}

/* レシピ動画 */
.main.theme-purple .special-list01 > li > .btn-detail > a {
	background: #ce7caa;
	background: -webkit-gradient(linear, 0 0, 0 bottom, from(#faf1ff), to(#f7e2ff));
	background: -webkit-linear-gradient(#faf1ff, #f7e2ff);
	background: -moz-linear-gradient(#faf1ff, #f7e2ff);
	background: -ms-linear-gradient(#faf1ff, #f7e2ff);
	background: -o-linear-gradient(#faf1ff, #f7e2ff);
	background: linear-gradient(#faf1ff, #f7e2ff);
	border-color: #ce7caa;
}
.main.theme-purple .btn-moreinfo a {
	background: #ce7caa;
}
.main.theme-purple .special-list01-box,
.main.theme-purple .special-list02-box {
	background-color: #f7efd3;
}


.special-list01 > li .list-box01 .js-target-feature .inline-area{
	display:none;
}

.special-list01 > li .list-box01  .js-target-feature p {
	float: left;
	margin-right: 7px;
}
/* #cboxLoadedContent　はcolorboxで使われるID名です */
#cboxLoadedContent div .mv-area{
	background:#fff;
	height:320px;
}

#cboxLoadedContent div .mv-area .rcp-btn{
	border:1px solid #c31c29;
	border-radius:5px;
	padding:0 10px;
	margin:15px 15px 0;
	background: #fcf4f4; /* Old browsers */
	background: -moz-linear-gradient(top, #fcf4f4 0%, #f9e8e9 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #fcf4f4 0%,#f9e8e9 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #fcf4f4 0%,#f9e8e9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcf4f4', endColorstr='#f9e8e9',GradientType=0 ); /* IE6-9 */
}
/* YouTubeの画面サイズを保持するためです */
#cboxLoadedContent div .mv-area iframe{
	width:100% !important;
	height:232px !important;
}
#cboxLoadedContent div .mv-area .rcp-btn a{
	display:block;
	padding:15px;
	text-align:center;
	text-decoration:none;
	color:#434343;
	background: url(/sp/recipe/common/img/parts/ico_arrow_right02.png) no-repeat right center;
}
.special-list01 > li .list-box01  .js-target-feature p a{
	position:relative
}
.special-list01 > li .list-box01  .js-target-feature p a:after{
	position: absolute;
	content: "";
	width: 76px;
	height: 76px;
	top:35px;
	left:70px;
	cursor: pointer;
	background: url(/sp/recipe/common/img/icon-play.png) no-repeat;
	background-size:76px 76px;
	display:block;
}