@charset "utf-8";
/* ===============================================
  [1]chef-recipe
  [2]recipe_detail
=============================================== */

@media screen and (max-width: 767px) {

	/*------------------------------------------------
	  [1]chef
	------------------------------------------------*/
	
	/* recipe
	------------------------------------------------*/
	
	.recipe {
		padding: 0;
		border: none;
		background: none;
		border-radius: 0;
	}
	.recipe .ttlwrap {
		padding: 5px 10px 10px;
		border-bottom: none;
		background: #F7F5EF;
	}
	.recipe .ttlwrap .ttl {
		float: none;
		margin: 0;
		padding: 5px 0 5px 30px;
		border-bottom: 2px solid #F29826;
		background: url(/library/foodservice/chef/img/ic_ttl.png) no-repeat 5px center;
		font-size: 130%;
	}
	.recipe ul {
		overflow: hidden;
	}
	.recipe ul li {
		width: 50%;
		float: left;
		margin: 0;
		padding: 3%;
		border: none;
	}
	.recipe .img,
	.recipe .article {
		float:none;
		width: 100%;
	}
	.recipe .img {
		padding: 0;
		text-align: center;
	}
	.recipe .article .ttl a {
		padding: 10px 0 0 15px;
		background: url(/library/common/img/icn_arrow01.gif) no-repeat left 13px;
		font-size: 90%;
		font-weight: normal;
		text-decoration: underline;
	}
	.recipePager {
		position: relative;
		max-width: 450px;
		min-height: 30px;
		margin: 15px 0 0;
		padding: 0 70px;
		border: none;
		background: none;
	}
	.recipePager .prev,
	.recipePager .next {
		position: absolute;
		top: 50%;
		margin: -14px 0 0 0;
	}
	.recipePager .prev {
		left: 0;
	}
	.recipePager .next {
		right: 0;
	}
	.recipePager .prev a,
	.recipePager .next a {
		display: block;
		overflow: hidden;
		width: 65px;
		height: 28px;
		text-indent: 100%;
		white-space: nowrap;	
	}
	.recipePager .prev a {
		background: url(/library/common/img/btn_prev.png) no-repeat left top;
		background-size: cover;
	}
	.recipePager .next a {
		background: url(/library/common/img/btn_next.png) no-repeat left top;
		background-size: cover;
	}
	.recipePager ul li {
		margin: 2px;
	}
	.recipePager ul li a {
		padding: 3px 5px;
	}

	/*------------------------------------------------
	  [2]recipe_detail
	------------------------------------------------*/

	.recipeDetailLeft,
	.recipeDetailRight {
		float: none!important;
		width: 100%!important;
	}

	/* chefDetailSlider
	------------------------------------------------*/

	.recipeDetailSlider {
		width: 250px;
		margin: 0 auto 5px;
	}
	.recipeDetailSlider .flex-control-nav {
		margin: 5px 0 0;
	}
	.recipeDetailSlider .flex-control-nav li {
		display:inline-block;
		margin: 0 5px;
	}
	.recipeDetailSlider .flex-control-nav li a {
		width: 8px;
		height: 8px;
	}

	/* textDetailArticle
	------------------------------------------------*/

	.recipeDetailRight {
    	padding: 0;
	}
	.recipeDetailArticle .comment {
		margin: 0 0 15px;
	}
	.recipeDetailArticle .comment .ttl {
		float: none;
		margin: 0;
	}
	.recipeDetailArticle .chef {
		background: none;
	}
	.recipeDetailArticle .chef .img {
		max-width: 110px;
		padding: 0 10px 0 0;
	}
	.recipeDetailArticle .chef .article {
		float: none;
		padding: 0;
	}
	.recipeDetailArticle .chef .name {
		margin: 30px 0 0;
		font-size: 110%;
	}
	.recipeDetailArticle .chef .btn {
		clear: both;
		width: 40%;
		margin: 0;
		padding: 15px 0 0;
		border: none;
		background: none;
	}
	.recipeDetailArticle .chef .btn:hover {
		border: none;
	}
	.recipeDetailArticle .chef .btn a {
		display: block;
		padding: 10px 20px 10px 10px;
		border: 2px solid #664422;
		color: #664422;
		background: none;
		font-weight: bold;
		text-align: center;
		border-radius: 5px;
	}

	/* recipeDetailLabel
	------------------------------------------------*/

	.recipeDetailLabel {
		margin: 0 0 10px;
	}
	.recipeDetailLabel ul li {
		float: left;
		margin: 0 5px 5px 0;
		padding: 5px 8px;
	}


	/* recipePrice
	------------------------------------------------*/

	.recipePrice {
		margin: 0 0 20px;
		padding: 0;
		border: 1px solid #D6D6B4;
	}
	.recipePrice .ttl {
		margin: 0;
		padding: 10px;
		border-bottom: 1px solid #D6D6B4;
		background: #F9F7EF;
	}
	.recipePrice p {
		padding: 10px;
	}

	/* recipeDetailContent
	------------------------------------------------*/

	.recipeDetailContent {
		margin: 0;
	}
	.recipeDetailContent .recipeDetailContentLeft,
	.recipeDetailContent .recipeDetailContentRight {
		float: none!important;
		width: 100%!important;
		margin: 0 0 20px;
		padding: 0;
	}
	.recipeDetailMaterial table {
		margin: 0!important;
	}
	.recipeDetailMaterial table th {
		border-bottom: 1px solid #D6D7B5;
		background: #F9F7EF;
		font-weight: normal;
		text-align: center;
	}

	/* recipeDetailStep
	------------------------------------------------*/

	.recipeDetailStep {
		padding: 10px 5px 0px;
	}
	.recipeDetailStep ol li {
		margin: 0 0 10px;
	}

/* recipeChef
   recipeItem
------------------------------------------------*/
	.recipeChef,
	.recipeItem {
		padding: 0;
		border: none;
		background: none;
		border-radius: 0;
	}
	.recipeItem {
		margin: 0 0 20px;
	}
	.recipeChef ul li,
	.recipeItem ul li {
		float: left;
		width: 50%;
		padding: 0 4%;
	}
	.recipeChef ul li a,
	.recipeItem ul li a {
		border: none;
		text-decoration: underline;
	}
	.recipeChef ul li a:hover,
	.recipeItem ul li a:hover {
		border: none;
	}
	.recipeChef ul li a span.img,
	.recipeItem ul li a span.img {
		margin: 0;
	}
	.recipeChef ul li a span.ttl,
	.recipeItem ul li a span.ttl {
		padding: 10px 0 0 13px;
		border: none;
		background: url(/library/common/img/icn_arrow01.gif) no-repeat 0px 15px;
	}

}