@charset "utf-8";

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

title : ナスラックKitchen
scope : レシピ一覧
last modify :
2015/04/04 262_ichinose

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

#breadcrumb {
	width:1024px;
	margin:0 auto;
	border-top:2px solid #eb7986;
	padding:10px 15px;
}

#breadcrumb p img {
	vertical-align: baseline;
	padding: 0 15px;
}

.content {
    width: 950px;
    margin: auto;
    padding: 30px 0 0;
}

.ttl_box {
	width:950px;
	margin:0 auto;
}

.ttl_box h1 {
	position:relative;
	background:#eb7986;
	width:915px;
	height:58px;
	line-height:58px;
	color:#fff;
	font-size:23px;
	padding-left:35px;
	float:left;
}

.ttl_box h1:before {
	position:absolute;
	top:19px;
	left:19px;
	content:" ";
	display:inline-block;
	width:5px;
	height:20px;
	background:#fff;
}

.ttl_box .ttl_btn {
	width:205px;
	float:left;
}

p.lead_txt {
    width: 700px;
    padding: 15px 125px 20px;
}

hr {
	width:948px;
	height:1px;
	border:none;
	border-top:1px solid #e7e7df;
}

hr.area_separate {
	width:700px;
	height:1px;
	border:none;
	border-top:1px solid #e7e7df;
}

hr.area_separate2 {
	width:700px;
	height:1px;
	border:none;
	border-top:1px solid #e7e7df;
	margin: 0 auto 35px;
}


/*------画像拡大----------*/

.PopBoxImageLarge
{
	border:2px solid #eb7986;
	background-color: #FFFFFF;
	padding: 2px;
	cursor:url("/js/lib/popBoxImg/magminus.cur"), pointer;
}
/*---------------------------------
  .health_brock
---------------------------------*/
.health_brock {
	width: 840px;
	margin: 0 auto;
	overflow: hidden;
	border: 2px solid #1f8817;
	/* border-radius */
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
}

.health_brock {
	width: 840px;
	margin: 0 auto 30px auto;
	overflow: hidden;
	border: 2px solid #1f8817;
	/* border-radius */
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	background: url("../image/bg_helth_point.png") 0 0 repeat-y;
	display: table;
}

.health_img {
  width: 146px;
	display: table-cell;
  overflow: hidden;
	text-align: center;
	vertical-align: middle;
}

.health_point {
	display: table-cell;
	padding: 19px 20px 19px 10px;
}

.health_point dt {
	font-size: 20px;
	color: #1f8817;
	font-weight: bold;
	background: url("../image/bg_health_line.png") left bottom repeat-x;
	padding: 0 10px 14px 10px;
	line-height: 1.2;
}

.health_point dd {
	background: url("../image/ico_stear.png") 10px 10px no-repeat;
	padding: 10px 0 0 35px;
}

/*---------------------------------
  #summary
---------------------------------*/
#summary {
	width:440px;
	float:left;
	margin-left:17px;
}

#summary figure {
	position: relative;
}

#summary figcaption {
	position: absolute;
	top: 7px;
	left: 4px;
}

#summary .time_cal {
	width:440px;
	font-size:15px;
}

#summary .time_cal p {
	background:#fff2f3;
	width:215px;
	height:34px;
	line-height:34px;
	text-align:center;
	float:left;
	margin:10px 0 0;
	font-weight:bold;
}

#summary .time_cal p:nth-of-type(1) {
	margin-right:10px;
}

#summary .time_cal p span {
	font-size:18px;
}

.contributor_data {
	display: table;
	width: 100%;
}

.contributor_data dt {
	display: inline-block;
	padding: 0 10px 0 0;
}

.contributor_data dd {
	display: inline-block;
	padding: 0 15px 0 0;
	line-height: 1.8;
	font-size: 14px;
	color: #eb7986;
	margin: -10px 0 20px 0;
}

.qr_zone {
	width: 438px;
	height: 104px;
	background: url(../image/qr_mobile.png) 0 0 no-repeat;
}

.qr_zone span {
	display: block;
	width: 74px;
	height: 74px;
	border: 1px solid #eb7986;
	padding: 5px;
	margin: 9px 0 9px 342px;
}



/*---------------------------------
  #material
---------------------------------*/
#material {
	width:436px;
	float:right;
	margin-right:34px;

}

#material h2 {
	background:url(../image/bg_ttl_btm.png) repeat-x bottom;
	padding-bottom:10px;
	margin-bottom:10px;
}

#material h2 img {
	vertical-align:baseline;
	margin:0 20px 0 15px;
}

#material h2 span {
	font-weight:normal;
	float:right;
	margin-right:5px;
}

#material ul li {
	border-bottom:1px solid #eee;
	margin-left:10px;
	line-height:33px;
	padding:0 10px 0 5px;
}

#material ul li span {
	float:right;
}

#material ul li.spice {
	border:none;
	padding:5px 20px 0 5px;
	line-height:1.5;
}

#material ul li.ttl_spice{
    color:green;
	font-weight:bold;
	padding:20px 20px 0 5px;


}

/*---------------------------------
  #member
---------------------------------*/
#members {
	width:449px;
	float:right;
	margin:35px 20px 60px;
}

#members dl {
	margin-bottom:52px;
}

#members dl dt {
	text-align:center;
	margin-bottom:10px;
}

#members dl dd {
	border:2px solid #eb7986;
	background:#fff;
	padding:5px;
	font-size:18px;
	display:table;
}

#members dl dd p {
	height:136px;
	background:#eb7986;
	color:#fff;
	padding:15px;
	display:table-cell;
	vertical-align:middle;
	letter-spacing: -0.04em;
}

#members .myrecipe_mb {
	background:url(../image/bg_myrecipe.png);
	width:447px;
	height:201px;
}

#members .myrecipe_mb p.stl {
	color:#f92527;
	text-align:center;
	padding:20px 0 0 60px;
	font-weight:bold;
	font-size:17px;
}

#members .myrecipe_mb p.ttl {
	text-align:right;
	padding:15px;
}

#members .myrecipe_mb p.desc {
  font-size:15px;
	color:#000;
	padding:0 20px;
	line-height:1.4;
}

#members .myrecipe_mb:hover {
	opacity:0.8;
}

/*---------------------------------
  #prepare
---------------------------------*/
#prepare {
	clear:both;
	width:840px;
	margin:30px auto;
}

#prepare dl {
	background:#fff2f3;
	padding-bottom:20px;
}

#prepare dl dt {
	background:url(../image/list_mrk_l.png) no-repeat left center;
	margin-left:20px;
	padding:10px 0 10px 20px;
}

#prepare dl dd {
	background:url(../image/list_mrk_s.png) no-repeat left 9px;
	margin-left:40px;
	padding:0 50px 3px 15px;
}

#prepare p.keyword {
	margin:10px 5px;
}

#prepare p.keyword span {
	font-weight:bold;
	color:#cd3e3a;
	margin-right:10px;
}

/*---------------------------------
  #howtomake
---------------------------------*/
#howtomake {
	width:918px;
	margin: 30px auto;
}

#howtomake h2 {
	background:url(../image/bg_ttl_btm.png) repeat-x bottom;
	padding-bottom:10px;
	margin-bottom:20px;
	overflow: hidden;
	display: table;
	width: 915px;
}

#howtomake h2 img {
	margin:0 20px 0 15px;
}

#howtomake h2 span {
	display: table-cell;
	vertical-align: middle;
	width: 300px;
}

#howtomake h2 .movie_zone {
	width: 620px;
	text-align: right;
	padding: 0 30px 0 0;
}

#howtomake ol {
	margin-bottom:30px;
}

#howtomake ol li {
	width:429px;
	float:left;
	list-style:none;
	margin:0 0 20px 20px;
	padding-top:27px;
}

#howtomake .step_zone {
	width:400px;
	float:left;
  padding: 10px 10px 0 0;
}

#howtomake ol li p.no_img {
	width:409px;
}

#howtomake ol li span {
	display:inline-block;
	position:relative;
	width:189px;
	float:right;
	margin:0 0 5px 10px;
}

#howtomake ol li figure {
	display:inline-block;
	position:relative;
	width:189px;
	float:right;
	margin:0 0 5px 10px;
}

#howtomake ol li figcaption {
	text-align: center;
	margin: 10px 0 0 0;
}

#howtomake ol li img {
	cursor:url("/js/lib/popBoxImg/magplus.cur"), pointer;
}

#howtomake ol li span:after {
	content:url(../image/mrk_exp.png);
	position:absolute;
	right:0;
	bottom:0;
	width: 20px;
	height: 20px;
	pointer-events: none;
}

#howtomake ol li:nth-of-type(1) {
	background:url(../image/mrk_list_1.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(2) {
	background:url(../image/mrk_list_2.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(3) {
	background:url(../image/mrk_list_3.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(4) {
	background:url(../image/mrk_list_4.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(5) {
	background:url(../image/mrk_list_5.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(6) {
	background:url(../image/mrk_list_6.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(7) {
	background:url(../image/mrk_list_7.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(8) {
	background:url(../image/mrk_list_8.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(9) {
	background:url(../image/mrk_list_9.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(10) {
	background:url(../image/mrk_list_10.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(11) {
	background:url(../image/mrk_list_11.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(12) {
	background:url(../image/mrk_list_12.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(13) {
	background:url(../image/mrk_list_13.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(14) {
	background:url(../image/mrk_list_14.png) no-repeat left top;
}

#howtomake ol li:nth-of-type(15) {
	background:url(../image/mrk_list_15.png) no-repeat left top;
}

#howtomake .make_point {
	position:relative;
	width:731px;
	min-height:174px;
	background:url(../image/bg_point.png);
	margin:0 auto 15px;
	overflow:hidden;
}

#howtomake .make_point figure {
	width:195px;
	float:left;
}

#howtomake .make_point figure img {
	margin:15px 0 0 49px;
}

#howtomake .make_point figure img.nas {
	margin:9px 0 0 50px;
}

#howtomake .make_point figure img.label {
	position:absolute;
	top:-3px;
	left:-3px;
	margin:0;
}

#howtomake .make_point p {
	width:520px;
	float:right;
}

#howtomake .make_point p.desc {
	min-height:100px;
	margin:15px 15px 10px 0;
}

#howtomake .make_point p.prof {
	text-align:right;
	margin: 10px 15px 10px 0;
	font-size : 17px !important;
}

#howtomake p.print {
	text-align:center;
}

/*---------------------------------
  #keyword
---------------------------------*/
#keyword {
	margin: 0 auto;
	overflow: hidden;
	width: 731px;
}

#keyword p {
	float: left;
	position: relative;
  background: #FF9FA7;
  padding: 0 0.5em;
  line-height: 1.7em;
  text-align:center;
  color:#FFFFFF;
  font-size: 20px;
  width: 5em;
}

#keyword p:after{
	border: solid transparent;
  content:'';
  height:0;
  width:0;
  pointer-events:none;
  position:absolute;
  border-color: rgba(255, 159, 167, 0);
  border-top-width: 0.85em;
  border-bottom-width: 0.85em;
  border-left-width: 0.6em;
  border-right-width: 0.6em;
  margin-top: -0.85em;
  border-left-color:#FF9FA7;
  left:  99.7%;
  top: 50%;
}

#keyword ul {
	float: right;
	margin-top: 0.3em;
	width: 580px;
}

#keyword ul li {
	display: inline-block;
	position: relative;
}

#keyword ul li:after {
	content: "、";
	display: inline-block;
	margin: 0 0.3em;
}

#keyword ul li:last-child:after {
	display: none;
}

/*---------------------------------
  #qr
---------------------------------*/
#qr {
	border: 1px solid #EB7986;
	margin: 55px auto 30px;
	overflow: hidden;
	width: 731px;
}

#qr h2 {
	background: #EB7986;
	color: #fff;
	display: block;
	font-size: 23px;
	font-weight: bold;
	line-height: 1.3em;
	margin: 0;
	padding: 0.3em 0.5em 0.3em 2.5em;
	position: relative;
	text-indent: -0.7em;
	width: auto;
}

#qr h2:before {
	background: url(../image/ico-qr-recipibook.png) center center no-repeat;
  background-size: 1.25em;
  bottom: 0;
  content: "";
  display: block;
  left: 0.5em;
  position: absolute;
  top: 0;
  width: 1.25em;
}

#qr h2 span {
	display: inline;
	font-size: 23px;
	width: auto;
}

#qr .inner {
	padding: 0.5em 1em;
	overflow: hidden;
}

#qr .inner p.lead {
	float: left;
	margin-top: 0.5em;
	text-align: justify;
	width: 300px;
}

#qr .inner .box_img {
	align-items: center;
	display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  justify-content: space-between;
  float: right;
  width: 370px;
}

#qr .inner .box_img img {
	width: 100%;
}

#qr .inner .box_img figure:first-of-type {
	position: relative;
	width: 135px;
}

#qr .inner .box_img figure:first-of-type span {
	display: block;
	top: 25px;
	left: 14px;
	overflow: hidden;
	position: absolute;
	width: 48px;
}

#qr .inner .box_img .arrow {
	display: block;
	width: 40px;
}

#qr .inner .box_img figure:last-of-type {
	position: relative;
	width: 63px;
}

#qr .inner .box_img figure:last-of-type span {
	display: block;
	top: 39px;
	left: 6px;
	overflow: hidden;
	position: absolute;
	width: 51px;
}

#qr .inner .box_img .img_qr {
	width: 90px;
}

#qr .inner .box_img .img_qr span {
	border: 1px solid #2292D3;
	display: block;
	padding: 0.5em;
}

#qr .inner .box_img .img_qr p {
	font-size: 15px;
	line-height: 1.3em;
	margin-top: 0.3em;
	text-align: center;
}


/*---------------------------------
  #recommend
---------------------------------*/
#recommend {
	width:914px;
	margin:30px auto;
}

#recommend dt {
	margin:0 0 15px 3px;
}

#recommend dd {
	position:relative;
	width:288px;
	border:1px solid #eb7986;
	float:left;
	margin:0 22px 22px 0;
}

#recommend dd figure img {
	position:relative;
	width:288px;
	height:216px;
}

#recommend dd:nth-of-type(3) {
	margin-right:0;
}

#recommend dd a {
	display:block;
}


#recommend dd.new figure:before {
	content:url(../image/mrk_new.png);
	width:110px;
	height:33px;
	position:absolute;
	top:0;
	left:0;
}

#recommend dd.mb figure:after {
	content:url(../image/mrk_member.png);
	width:58px;
	height:60px;
	position:absolute;
	top:3px;
	right:3px;
}

#recommend dd.mb {
	border:1px solid #998036;
}

#recommend dd p[class^="recipe_ttl"] {
	height:50px;
	padding:8px 30px 0;
	text-align:center;
	color:#0332ff;
	font-weight:bold;
	line-height:1.3;
}

#recommend dd p.recipe_ttl_2 {
	text-align:left;
}

#recommend dd .recipe_dtl {
	height:38px;
	line-height:38px;
	padding-left:10px;
	background:url(../image/btm_arrow.png) no-repeat right bottom;
	color:#000;
}

#recommend dd.mb .recipe_dtl {
	background:url(../image/btm_arrow_mb.png) no-repeat right bottom;
}

#recommend dd .recipe_dtl span.min {
	font-size:20px;
	font-weight:bold;
	color:#d34858;
}

#recommend dd .recipe_dtl span.cal {
	font-weight:bold;
}


/*---------------------------------
  .myrecipe
---------------------------------*/
.myrecipe {
	width:617px;
	margin:0 auto 30px;
}

.myrecipe p {
	text-align:center;
	color:#f92527;
	font-weight:bold;
	margin-bottom:5px;
}

.myrecipe figure {
	font-size:15px;
}

.myrecipe figure figcaption {
	padding:10px 12px;
	line-height:1.3;
}

/*---------------------------------
  .ad_area
---------------------------------*/
.ad_area {
	width:950px;
	margin:0 auto;
}

.ad_area div {
	float:left;
	margin-right:25px;
}

.ad_area div:nth-of-type(3) {
	margin:0;
}

/* 離乳食・幼児食の注意点 */
#howtomake .attention_box {
	width: 701px;
	margin: 30px auto 40px;
	padding: 10px 15px;
	background: url(/renew/recipe/image/bg_attention_middle.png) 0 0 no-repeat;
}

#howtomake .attention_box dd {
	width: 520px;
	margin: 15px 0 0 10px;
	font-size: 16px;
	line-height: 1.5;
  text-align: justify;
  text-justify: inter-ideograph;
}

/* ---------------------------------------------------------
    レシピ印刷用ボタンの下のバナー
--------------------------------------------------------- */
.flag_space {
  width: 600px;
  margin: 30px auto 55px;
}

.flag_space a {
	display: block;
}

.flag_space img:hover {
  opacity: 0.7;
}

.flag_space img {
  width: 600px!important;
	height: 103px!important;
}

.footer_bnr {
  display: flex;
  margin: 0 auto 2.5em;
  width: 816px;
}

.footer_bnr li figure a img {
  display: block;
  margin: 0 16px;
  width: 240px;
}

.footer_bnr li figure a img:hover {
  opacity: 0.8;
}