@charset "UTF-8";

/* -------------------------------------------------
producer
------------------------------------------------- */

/* -------------------------------------------------
producer common
------------------------------------------------- */
.producer .mw720px{
  max-width: 720px;
  margin: 0 auto;
}


@media (min-width:768px) { /* tab pc */

}

@media (min-width:768px) and (max-width: 959px) { /* tab */

	
}

/* month ttl ,producer fix */
.content .producer .month-ttl-box {
  border-bottom: 2px solid #c4492f;
}


/* series ttl */
.producer{
}

.producer .series-ttl-box{
	padding: 3em 5% 0;
	text-align: center;
}

.producer .series-ttl-box .h1-box{
	max-width: 720px;
	margin: 0 auto;
}

.producer .series-ttl-box .h1-box h1{
	font-size: 1em;
	background-image: url(../img/producer_series_ttl01.png);
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: center;
	
	padding-top: calc(( 170 / 720 ) * 100% - 1.7em );
	
	text-indent: -999em;
}

.producer .lead-box{
	text-align: left;
	padding-top: 4em;
	margin-bottom: 4em;
}

@media (min-width:768px) { /* tab pc */
	div.producer .series-ttl-box{
		padding: 6em 5% 0;
	}
	
	div.producer .pagettl-box{
		padding-top: 1em;
		margin-bottom: 8em;
	}
	
	div.producer .lead-box{
		padding-top: 7em;
		margin-bottom: 5em;
	}

}

@media (min-width:960px) { /* pc */

}

/* key visual */
.producer .kv-box{
	padding: 0 5%;
	margin-bottom: 5em;
}

.producer .kv-box .ttl-box{
	max-width: 500px;
	margin: 0 auto 2em;
}

.producer .kv-box .ttl-box h2{
	background-color:transparent;
	border: none;
	
	font-size: 1em;
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: center;
	
	padding-top: calc(( 100 / 500 ) * 100% - 1.2em );
	
	text-indent: -999em;
}

.producer01 .kv-box .ttl-box h2{
	background-image: url(../img/producer01_kv_ttl01.png);
}

.producer02 .kv-box .ttl-box h2{
	background-image: url(../img/producer02_kv_ttl01.png);
}

.producer .kv-box .img-box .note-box{
	padding-top: 1em;
}

@media (min-width:768px) { /* tab pc */
	div.producer .kv-box{
		margin-bottom: 8em;
	}
	div.producer .kv-box .ttl-box {
    margin-bottom: 4em;
	}
}

/* sec1 */
.producer .sec1{
	padding:0 5%;
	margin-bottom: 8em;
}

/* ○○づくりの達人 */
.producer .sec1 .sec-ttl-box{
	max-width: 720px;
	margin: 0 auto 2em;
}

.producer .sec1 .sec-ttl-box h3{
	background-color:transparent;
	border: none;
	
	font-size: 1em;
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: center;
	
	padding-top: calc(( 100 / 720 ) * 100% - 1.2em );
	
	text-indent: -999em;
}

.producer01 .sec1 .sec-ttl-box h3{
	background-image: url(../img/producer01_sec1_ttl01.png);
}

.producer02 .sec1 .sec-ttl-box h3{
	background-image: url(../img/producer02_sec1_ttl01.png);
}


.producer .sec1 .sub-ttl-box{
	margin-bottom: 4em;
	text-align: center;
}

.producer .sec1 .sub-ttl-box p{
	display: inline-block;
	border-bottom: 3px solid #000;
	font-size: 200.00%; /* 32px */
	font-weight: bold;
	
	line-height: 1.4;
}

.producer .sec1 .sub-ttl-box .noen{
	padding: 0;
	font-size: 0.8em;
}

@media (min-width:768px) { /* tab pc */	
	div.producer .sec1 .sec-ttl-box {
    margin-bottom: 4em;
	}
	div.producer .sec1 .sub-ttl-box p{
		font-size: 275.00%; /* 44px */
	}
}

.producer .sec1 .catch-box{
	text-align: center;
	margin-bottom: 3em;
}

/* sec1 img01 */
.producer .sec1 .img-box01{
	margin-bottom: 3em;
}
.producer .sec1 .img-box01 .txt-box{
	padding-top: 1em;
}

/* sec1 img02 */
.producer .sec1 .img-box02{
	margin-bottom: 4em;
}
.producer .sec1 .img-box02 .img-box{
	text-align: center;
	
	float:left;
	width:50%;
}
.producer .sec1 .img-box02 .txt-box .fukidashi-box{
	text-align: right;
	
	float:right;
	width:48%;
}

.producer .sec1 .img-box02 .txt-box .txt{
	clear: both;
	padding-top: 1em;
}

@media (min-width:768px) { /* tab pc */	
	div.producer .sec1 .img-box02{
		display: table;
		width: auto;
		
		margin-bottom: 8em;
	}
	div.producer .sec1 .img-box02 .img-box,
	div.producer .sec1 .img-box02 .txt-box{
		display: table-cell;
		vertical-align: bottom;
	}
	
	div.producer .sec1 .img-box02 .img-box{
		width:60%;
		float:none;
	}
	div.producer .sec1 .img-box02 .txt-box{
		padding-left: 1em;
	}
	div.producer .sec1 .img-box02 .txt-box .fukidashi-box{
		float: none;
		width:auto;
		margin-bottom: 1em;
	}
}

/* recipe */
.producer .recipe-box{
	background-image: url("../img/producer01_sec2_bg01.png");
	padding-bottom: 8em;
	margin-bottom: 8em;
	
	position: relative;
	top:0;
	left:0;
	z-index: 1;
}

.producer .recipe-box:before,
.producer .recipe-box:after,
.producer .recipe-box .ico-box:before,
.producer .recipe-box .ico-box:after{
	content: " ";
	
	width: 0;
	height: 0;
	border-style: solid;
	
	position: absolute;
	z-index: 1;
}

.producer .recipe-box:before{
	top:0;
	left:0;
	border-width: 32px 32px 0 0;
	border-color: #c4492f transparent transparent transparent;
}
.producer .recipe-box:after{
	top:0;
	right:0;
	border-width: 0 32px 32px 0;
	border-color: transparent #c4492f transparent transparent;
}
.producer .recipe-box .ico-box:before{
	bottom:0;
	left: 0;
	border-width: 32px 0 0 32px;
	border-color: transparent transparent transparent #c4492f;
}
.producer .recipe-box .ico-box:after{
	bottom:0;
	right: 0;
	border-width: 0 0 32px 32px;
	border-color: transparent transparent #c4492f transparent;
}

.producer .recipe-box .ico-box{
	padding: 0 5%;
}

/* 達人レシピタイトル */
.producer .recipe-box .sec-ttl-box{
	max-width: 472px;
	margin: 0 auto 2em;
}

.producer .recipe-box .sec-ttl-box h2{
	background-color:transparent;
	border: none;
	
	font-size: 1em;
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: top center;
	
	padding-top: calc(( 170 / 472 ) * 100% - 1.2em );
	
	text-indent: -999em;

	background-image: url(../img/producer_sec2_ttl01.png);
}

.producer .recipe-box .menu-box{
	margin: 0 auto 4em;
}

.producer .recipe-box .menu-box .menu-ttl-box{
	padding: 2em 0;
	line-height: 1.4;
}

.producer .recipe-box .menu-box .menu-ttl-box h3{
	font-size: 1.5em;
	text-align: center;
	border:none;
}

.producer .recipe-box .menu-box .note-box{
	margin-bottom: 4em;
}

.producer .recipe-box .menu-box .note-box .note-box-center{
	text-align: center;
}

.producer .recipe-box .menu-box .material-box{
	max-width: 640px;
	margin: 0 auto 4em;
	border-bottom: 3px solid #c4492f;
}

.producer .recipe-box .menu-box .material-box .ttl-box{
	text-align: center;
	overflow: hidden;
	font-size: 1.2em;
}

.producer .recipe-box .menu-box .material-box .ttl-box p{
	color:#c4492f;
	display: inline-block;
	padding: 0 .5em;
	font-weight: bold;
	
	position: relative;
	top:0;
	left:0;
	z-index: 1;
}

.producer .recipe-box .menu-box .material-box .ttl-box p:before,
.producer .recipe-box .menu-box .material-box .ttl-box p:after{
	content: " ";
	display: block;
	width: 200%;
	height: 3px;
	background-color: #c4492f;
	
	position: absolute;
	top:calc(50% - 2px);
}

.producer .recipe-box .menu-box .material-box .ttl-box p:before{
	right: 100%;
}
.producer .recipe-box .menu-box .material-box .ttl-box p:after{
	left: 100%;
}

.producer .recipe-box .material-box .list-box{
	text-align: center;
	
	padding: 1em;
	font-size: 1.142857em;
}

.producer .recipe-box .material-box .list-box .table-box{
	text-align: left;
}

.producer .recipe-box .material-box .list-box .table-box .tr .td,
.producer .recipe-box .material-box .list-box .table-box .tr .td .inner{
	display: inline;
}

.producer .recipe-box .material-box .list-box .table-box .tr .item{
	font-weight: bold;
	text-indent: -1em;
}

.producer .recipe-box .material-box .list-box .table-box .tr .item .inner:before{
	content: "●";
	color:#c4492f;
}
.producer .recipe-box .material-box .list-box .table-box .tr .item .inner:after{
	content: "：";
}

.producer .recipe-box .material-box .list-box .note{
	margin-top: 1em;
}

@media (min-width:768px) { /* tab pc */	
	div.producer .recipe-box .menu-box .material-box .ttl-box{
		font-size: 1.4em;
	}
	
	div.producer .recipe-box .material-box .list-box .table-box{
		display: table;
		margin: 0 auto;
	}
	
	div.producer .recipe-box .material-box .list-box .table-box .tr{
		display: table-row;
	}
	div.producer .recipe-box .material-box .list-box .table-box .tr .td{
		display: table-cell;
	}
	div.producer .recipe-box .material-box .list-box .table-box .tr .item {
		text-indent: 0;
	}
	div.producer .recipe-box .material-box .list-box .table-box .tr .item .inner{
		width:22em;
		white-space: nowrap;
		padding-right: 1em;
		overflow: hidden;
		display: block;
	}
	
	div.producer .recipe-box .material-box .list-box .table-box .tr .item .inner:after{
		content: "……………………………………………………………………";
	}
}

/* material no ico */
div.producer .recipe-box .material-box .list-box .table-box div.no_ico .item .inner:before{
	content: "";
	display: none;
}
div.producer .recipe-box .material-box .list-box .table-box div.no_ico .item .inner:after{
	content: "";
	display: none;
}

/* material td-penetrate */
div.producer .recipe-box .material-box .list-box .table-box .tr .td-penetrate{
}

div.producer .recipe-box .material-box .list-box .table-box .tr .td-penetrate .inner:after{
	content: "";
	display: none;
}

@media (min-width:768px) { /* tab pc */	
	div.producer .recipe-box .material-box .list-box .table-box .tr .td-penetrate .inner{
		overflow: visible;
		position: relative;
		top:0;
		left:0;
		height: 1.8em;
		
		width: auto;
	}
	div.producer .recipe-box .material-box .list-box .table-box .tr .td-penetrate .inner .penetrate-item{
		position: absolute;
		top:0;
		left: 1em;
	}
}


/*
.producer .recipe-box .menu-box .material-box .table-box{
	text-align: center;
	padding: 1em 0;
	font-weight: normal;
	font-size: 1.2em;
}

.producer .recipe-box .menu-box .material-box .table-box .table{
	display: table;
	text-align: left;
	margin: 0 auto;
	padding: 0.5em;
}

.producer .recipe-box .menu-box .material-box .table-box .table .tr{
	display: table-row;
}

.producer .recipe-box .menu-box .material-box .table-box .table .tr .td{
	display: table-cell;
}
.producer .recipe-box .menu-box .material-box .table-box .table .name{
	padding-right: 0.5em;
}
.producer .recipe-box .menu-box .material-box .table-box .table .name:before{
	content:"● ";
	color:#c4492f;
}

.producer .recipe-box .menu-box .material-box .table-box .table .seasoning-group{
	position: relative;
	margin-top: 0.5em;
}

.producer .recipe-box .menu-box .material-box .table-box .table .seasoning-group .gname{
	width: 60px;
}

.producer .recipe-box .menu-box .material-box .table-box .table .seasoning-group:before{
	content: "";
	position: absolute;
	top: 8px;
	left: 35px;
	width: 20px;
	height: 125px;
	border: 2px solid;
	border-right: none;
}
*/

@media (min-width:768px) { /* tab pc */	
	div.producer .recipe-box .menu-box .menu-ttl-box h3{
		font-size: 2.2em;
	}
}

/* recipie process */
.producer .recipe-box .process-box{
	margin-bottom: 8em;
}

.producer .recipe-box .process-box ul li{
	padding: 0;
	background: none;
	margin-bottom: 2em;
}

.producer .recipe-box .process-box ul li .img-box{
	margin-bottom: 1em;
}

.producer .recipe-box .process-box ul li .num-box{
	border:2px solid #000;
	display: block;
	width:3em;
	height: 3em;
	text-align: center;
	line-height: 3em;
	border-radius: 50%;
	font-weight: bold;
	
	margin-bottom: .5em;
}
.producer .recipe-box .process-box ul li .num-box .inner{
	font-size: 1.5em;
}

@media (min-width:768px) { /* tab pc */	
	div.producer .recipe-box .process-box ul li{
		display: table;
		width: 100%;
	}
	
	div.producer .recipe-box .process-box ul li .img-box{
		display: table-cell;
		width: 50%;
	}
	
	div.producer .recipe-box .process-box ul li .txt-box{
		display: table-cell;
		padding-left: 1em;
		vertical-align: middle;
	}
}

/* recipie point */
.producer .recipe-box .point-box{
	margin-bottom: 8em;
	
	position: relative;
	top:0;
	left:0;
	z-index: 1;
}

.producer .recipe-box .point-box:before{
	content:" ";
	position: absolute;
	z-index: 1;
	top:20%;
	right:79.5%;
	margin-top: -10px;
	
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 12px 20px 12px 0;
	border-color: transparent #fff transparent transparent;
}

.producer .recipe-box .point-box .inner{
	display: table;
	width:100%;
}

.producer .recipe-box .point-box .img-box{
	display: table-cell;
	width:20%;
	padding-right: 1.5em;
}

.producer .recipe-box .point-box .img-box img{
	border-radius: 50%;
}

.producer .recipe-box .point-box .txt-box{
	display: table-cell;
	vertical-align: middle;
	
	padding: 1.5em;
	background-color:#fff;
	border-radius: 1.5em;
}

.producer .recipe-box .point-box .txt-box .ttl-box{
	color:#c4492f;
	font-size: 1.4em;
	margin-bottom: .5em;
}

.producer .recipe-box .point-box .txt-box .ttl-box h4{
	display: inline-block;
	border-bottom: 6px solid #c4492f;
	border-left:none;
}

@media (min-width:768px) { /* tab pc */	
	div.producer .recipe-box .point-box:before{
		top:50%;
		right:65.9%;
		margin-top: -10px;
	}
	div.producer .recipe-box .point-box .img-box{
		width:34%;
	}
	.producer .recipe-box .point-box .img-box.img-box-long-txt{
		padding-top: 3em;
	}
	div.producer .recipe-box .point-box .txt-box{
		padding: 3em;
		border-radius: 3em;
	}
}

@media (max-width:414px) { /* small sp */
	div.producer .recipe-box .point-box:before{
		top:1.8em;
	}
}


/* recipie foodloss */
.producer .recipe-box .foodloss-box{
	max-width: 500px;
	margin:0 auto;
	padding: 1.5em;
	border-top:3px solid #c4492f;
	border-bottom:3px solid #c4492f;
	background-color:#fff;
	color:#c4492f;
}

.producer .recipe-box .foodloss-box .ttl-box{
	text-align: center;
	padding: 0 10%;
	margin-bottom: 2em;
	font-weight: bold;
}

@media (min-width:768px) { /* tab pc */	
	div.producer .recipe-box .foodloss-box{
		padding: 3em;
	}
}

/* series */
.producer .mid-line-ttl-box{
	text-align: center;
	margin-bottom: 2em;
	overflow: hidden;
}

.producer .mid-line-ttl-box h2{
	display: inline-block;
	padding: 0 .8em;
	
	position: relative;
	top:0;
	left:0;
	z-index: 1;
	
	background: none;
	letter-spacing: .1em;
}

.producer .mid-line-ttl-box h2:before,
.producer .mid-line-ttl-box h2:after{
	content: " ";
	display: block;
	width: 200%;
	height: 3px;
	background-color: #000;
	
	position: absolute;
	top:calc(50% - 2px);
}

.producer .mid-line-ttl-box h2:before{
	right: 100%;
}
.producer .mid-line-ttl-box h2:after{
	left: 100%;
}

.producer .series-box{
	margin-bottom: 8em;
}
.producer .series-box02{
	margin-bottom: 2em;
}

.producer .series-box ul{
	display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
	
	-ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.producer .series-box ul li{
	display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
	
	width:50%;
	
	background:none;
	padding: 0;
	
	margin-bottom: 1em;
}

.content .producer .series-box ul li a{
	display: block;
	width: 100%;
	padding: 92% 1em 0;
	
	text-align: center;
	color:#c4492f;
	text-decoration: none;
	font-weight: bold;
	
	background-repeat: no-repeat;
	background-position:top center;
	background-size: 100% auto;
}

.producer .series-box ul{
	margin-bottom: 2em;
}

.producer .series-box ul .pref{
	font-size: 1.5em;
}

.producer .series-box ul li.li01 a{
	background-image:url("../img/producer01_series_img01.jpg");
}

.producer .series-box ul li.li02 a{
	background-image:url("../img/producer01_series_img02.jpg");
}

.producer .series-box ul li.li03 a{
	background-image:url("../img/producer01_series_img03.jpg");
}

.producer .series-box ul li.li04 a{
	background-image:url("../img/producer01_series_img04.jpg");
}

.content .producer .series-box ul li a img{
	margin-bottom: .5em;
}


.producer .series-box .btn-box{
	padding: 0 5%;
	text-align: center;
}


@media (min-width:768px) { /* tab pc */	
	.content div.producer .series-box ul li a:hover{
		text-decoration: underline;
	}
	
	div.producer .series-box ul li{
		-webkit-box-flex:1;
		-ms-flex:1%;
		flex:1;
		
	}
}

/* share */
/*
.producer .share-box{
	margin-bottom: 4em;
}

.producer .share-box .inner{
	padding: 0 10px;
}

.producer .share-box ul{
	display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
	
	width:100%;
}

.producer .share-box ul li{
	background:none;
	padding: 0;
}

.producer .share-box ul li.img-box{
	padding-right: 1em;
	width:70%;
}

@media (min-width:768px) { /* tab pc */	/*
	div.producer .share-box ul li.img-box{
		width:auto;
	}
}

*/

/* -------------------------------------------------
max-width: 960px
------------------------------------------------- */

/* -------------------------------------------------
max-width: 768px
------------------------------------------------- */