@charser "utf-8";

/* ClearFix */
.clearfix { zoom: 1; }
.clearfix:after {
	content: "";
	display: block;
	clear: both; }

.clear {
	clear: both;
	}

body {      color: #795c2f; }
a,
a:link {    color: #e86400; }
a:visited { color: #e86400; }
a:hover,
a:active {  color: #f87410; text-decoration: underline; }

img { max-width: 100%; }

body {
	background: url("images/body_bg.png") repeat left top;
	font-size: 14px;
	line-height: 1.5;
	}

#header {
	background: #fff url("images/header_bg.png") repeat-x center top;
	}
	#header .header-box {
		height: 110px;
		background: url("images/header_container_bg.png") no-repeat center top;
		}
	#header .header-box .logo {
		/*padding-top: 20px;*/
		}
		#header .header-box .logo a {
			display: block;
			width: 266px; height: 0; padding-top: 100px; overflow: hidden;
			}
	#header .header-box .top {
		padding-top: 15px;
		}
		#header .header-box .top a {
			float: right;
			width: 267px; height: 0; padding-top: 79px; overflow: hidden;
			background: url("images/header_top.png") no-repeat right top;
			}
		#header .header-box .top a:hover {
			background: url("images/header_top_hover.png") no-repeat right top;
			}

	#header .menu {
		background: #eb6100;
		}
		.site-nav,
		.site-nav-sub {
			margin: 0; padding: 0 0 7px 0;
			list-style: none;
			}
			.site-nav li,
			.site-nav-sub li {
				display: inline;
				}
				.site-nav li a,
				.site-nav-sub li a {
					display: block; float: left;
					margin: 0 10px 0 0; padding-left: 14px;
					background: url("images/header_menu_arrow_a.png") no-repeat left center;
					color: #fff;
					}
		.site-nav-sub {
			float: right;
			}
			.site-nav-sub li {
				display: inline;
				}
				.site-nav-sub li a {
					margin: 0 0 0 10px; padding-left: 16px;
					background: url("images/header_menu_arrow_b.png") no-repeat left center;
					}

#footer {
	margin: 20px 0 0 0; padding: 20px 0 0 0;
	background: url("images/footer_bg.png") repeat-x center top;
	color: #fff;
	}
	#footer .container {
		padding: 10px 0 40px 0;
		background: #eb6100;
		}
		#footer .footer_logo {
			float: left;
			margin: 0 10px 0 0;
			}
			#footer .footer_logo img {
				box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
				}
		#footer .scrollup {
			text-align: right;
			}

#sp-menu {
	margin-top: 20px; padding-top: 10px;
	border-top: 2px solid #999;
	}

/* ページ
================================================== */
h1 { font-size: 20px; line-height: 1.5; } h1 small { font-size: 16px; }
h2 { font-size: 18px; line-height: 1.5; } h2 small { font-size: 14px; }
h3 { font-size: 16px; line-height: 1.5; } h3 small { font-size: 14px; }

.page-notice, #error {
	margin: 6px 0; padding: 4px 6px;
	background: #fef5f9;
	border-top: 1px solid #f8cfe1;
	border-left: 1px solid #f8cfe1;
	border-radius: 4px;
	color: #555;
	}
	.page-notice span {
		color: #f33;
		font-weight: bold;
		}

.page-header {
	margin: 0 0 15px 0; padding-bottom: 0;
	border-bottom: 1px solid #cfb183;
	}
	.page-header h1 {
		margin: 0;
		/*font-size: 24px;*/
		}

.table-bordered {
	border-color: #e7d8c0 #e7d8c0 #e7d8c0;
	}
.table-bordered th,
.table-bordered td {
	border-top: 1px solid #e7d8c0;
	border-left: 1px solid #e7d8c0;
	}
.table th,
.table td {
	border-top: 1px solid #e7d8c0;
	line-height: 1.5;
	}

.pagination > li > a, .pager > li > a {
	/*border-color: #cfb183;*/
	border: none;
	color: #fff;
	box-shadow: none;
	background: #ff7b1f;
	background: -moz-linear-gradient(top,  #ff7b1f 0%, #eb6100 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff7b1f), color-stop(100%,#eb6100));
	background: -webkit-linear-gradient(top,  #ff7b1f 0%,#eb6100 100%);
	background: -o-linear-gradient(top,  #ff7b1f 0%,#eb6100 100%);
	background: -ms-linear-gradient(top,  #ff7b1f 0%,#eb6100 100%);
	background: linear-gradient(to bottom,  #ff7b1f 0%,#eb6100 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7b1f', endColorstr='#eb6100',GradientType=0 );
	}
.pagination > li > a:hover, .pager > li > a:hover {
	/*box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) inset;*/
	box-shadow: none;
	background: #eb6100;
  color: #963e00;
	}
.pagination > li > a, .pagination > li > span {
	/*border-color: #cfb183;*/
	border: none;
	border-left: 1px solid #ff8f41;
	border-right: 1px solid #da5a00;
	color: #fff;
	}
.pagination > li > a:hover, .pagination > li > a.active, .pagination > li > span.active {
	border-left: 1px solid #eb6100;
	border-right: 1px solid #eb6100;
	background: #eb6100;
  color: #963e00;
}
	
.breadcrumb {
	margin: 0; padding: 7px 0;
	border: none;
	background: none;
	}
	.breadcrumb .divider,
	.breadcrumb .active {
		color: #795c2f;
		}

.update {
	display: none;
	/*
	font-size: 12px;
	text-align: right;
	*/
	}

/* トップページ
================================================== */

#searchform {
	margin: 0;
	}

#recipe_search {
	margin: 0 0 15px 0; padding: 10px 10px 5px 10px;
	border-radius: 4px;
	background: #efedde;
	}
	#recipe_search .search_block {
		margin: 0 0 5px 0; padding: 10px 10px 0 10px;
		background: #fff;
		}
	#recipe_search .search_block h3 {
		margin: 0;
		}
	button.search_button {
		/*
		width: 82px; height: 0; padding-top: 29px; overflow: hidden;
		background: #eb6100 url("images/form_search_button.png") no-repeat left top;
		*/
		background: none;
		border: none;
		transition: 0.2s;
		}
	button.search_button:hover {
		/*background: #eb6100 url("images/form_search_button_hover.png") no-repeat left top;*/
		opacity: 0.8;
		}

	.public_total {
		margin-bottom: 10px; padding: 1px 5px;
		background-color: #f6eade;
	}

	.recipe-area,
	.recipe-genre,
	.recipe-foodstuff {
		position: relative;
		margin: 0 0 15px 0; padding: 5px 10px 10px 10px;
		background: #fff;
		}
	.recipe-area::after,
	.recipe-genre::after,
	.recipe-foodstuff::after {
		content: " ";
		position: absolute; right: 0; top: -12px;
		z-index: 1;
		width: 25px;
		height: 8px;
		background: rgba(234, 95, 0, 0.25);
		margin: 3px 0 0 30px;
		/* Rotate */
		-webkit-transform: rotate(35deg);
		-moz-transform: rotate(35deg);
		-ms-transform: rotate(35deg);
		-o-transform: rotate(35deg);
		transform: rotate(35deg);
		/* Rotate Origin */
		-webkit-transform-origin: 0 100%;
		-moz-transform-origin: 0 100%;
		-ms-transform-origin: 0 100%;
		-o-transform-origin: 0 100%;
		transform-origin: 0 100%;
		}

	.recipe-area ul,
	.recipe-genre ul {
		margin-left: 0; padding-left: 0;
		}
		.recipe-area ul li,
		.recipe-genre ul li {
			display: inline;
			}
			.recipe-area ul li a {
				float: left;
				width: 23%;
				margin: 0 5px;
				color: #795c2f;
				}
				.recipe-area ul li a span.flag {
					margin-right: 4px;
					}
			.recipe-genre ul li a {
				float: left;
				width: 23%;
				margin: 0 5px; padding-left: 12px;
				background: url("images/arrow_tri_green.png") no-repeat left 0.2em;
				color: #795c2f;
				}

	.recipe-foodstuff .foodstuff {
		margin-bottom: 5px; padding: 5px;
		background: #fffbd0 url("images/foodstuff_bg.png") no-repeat 5px 5px;
		}
		.foodstuff .yasai {
			padding-left: 90px; min-height: 110px; height: auto !important; height: 110px;
			background: url("images/foodstuff_bg_yasai.png") no-repeat left center;
			}
		.foodstuff .oniku {
			padding-left: 90px; min-height: 110px; height: auto !important; height: 110px;
			background: url("images/foodstuff_bg_oniku.png") no-repeat left center;
			}
		.foodstuff .gyokai {
			padding-left: 90px; min-height: 110px; height: auto !important; height: 110px;
			background: url("images/foodstuff_bg_gyokai.png") no-repeat left center;
			}
		.foodstuff .gohan {
			padding-left: 90px; min-height: 110px; height: auto !important; height: 110px;
			background: url("images/foodstuff_bg_gohan.png") no-repeat left center;
			}
		.foodstuff .pasta {
			padding-left: 90px; min-height: 110px; height: auto !important; height: 110px;
			background: url("images/foodstuff_bg_pasta.png") no-repeat left center;
			}
		.foodstuff .men {
			padding-left: 90px; min-height: 110px; height: auto !important; height: 110px;
			background: url("images/foodstuff_bg_men.png") no-repeat left center;
			}
	.foodstuff h3 {
		margin: 3px 0 10px 0; padding: 0;
		}
	.foodstuff ul {
		margin: 0; padding: 0;
		list-style: none;
		}
		.foodstuff ul li {
			display: inline;
			}
			.foodstuff ul li a {
				float: left;
				margin: 0 10px 0 0; padding-left: 12px;
				background: url("images/arrow_tri_green.png") no-repeat left 0.2em;
				color: #795c2f; text-decoration: underline;
				}

.latest {
	margin: 0 0 10px 0; padding: 0;
	border-bottom: 1px dashed #cfb183;
}
	.latest h1 {
		padding-left: 16px;
		background: url("images/arrow_orange.png") no-repeat left center;
		color: #e86400;
		font-size: 16px;
		font-weight: bold;
	}
	.latest .item {
		position: relative;
		margin-bottom: 10px;
		padding: 6px;
		border: none;
		background: #fff;
		box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
	}
	.latest img {
	}
	.latest .date {
		position: absolute; right: 10px; top: 10px;
		display: inline-block;
		padding: 0 4px;
		background-color: #eb6100;
		color: #fff;
		font-size: 12px;
	}
	/*.latest .flag {
		position: absolute; left: 10px; top: 10px;
	}*/
	.latest .title {
		margin: 4px 0 0 0;
		font-size: 14px;
	}
		.latest .title a {
			/*padding-left: 14px;
			background: url("images/arrow_green.png") no-repeat left top;*/
			color: #75a315;
			font-weight: bold;
		}
	.latest p {
		font-size: 12px;
	}

.recommend {
	margin: 0 0 10px 0; padding: 0;
	border-bottom: 1px dashed #cfb183;
	}
	.recommend img {
		}
	.recommend h2 {
		margin: 4px 0 0 0;
		font-size: 14px;
		}
		.recommend h2 a {
			padding-left: 14px;
			background: url("images/arrow_green.png") no-repeat left top;
			color: #75a315;
			font-weight: bold;
			}
	.recommend p {
		font-size: 12px;
		}

.pickup_side {
	}
	.pickup_side ul {
		margin: 0; padding: 5px 10px;
		background: #fff;
		border-radius: 4px;
		list-style: none;
		}
		.pickup_side ul li {
			margin: 3px 0 0 0; padding: 0px 0px 3px 0;
			border-bottom: 1px dashed #cfb183; /* 795c2f */
			}
		.pickup_side ul li:last-child {
			border-bottom: none;
			}
		.pickup_side ul li a {
			color: #795c2f;
			}
		.pickup_side ul li a.thumb {
			display: table-cell; vertical-align: middle;
			}
		.pickup_side ul li a.title {
			display: table-cell; vertical-align: middle;
			padding-left: 16px;
			background: url("images/arrow_tri_orange.png") no-repeat 4px center;
			font-size: 12px;
			}

.pickup_info {
	margin: 10px; padding-bottom: 20px;
	}
	.pickup_info ul {
		margin: 0; padding: 0;
		list-style: none;
		}
		.pickup_info ul li {
			padding-left: 14px;
			background: url("images/arrow_tri_green.png") no-repeat left 0.2em;
			color: #75a315;
			}
			.pickup_info ul li div {
				display: inline;
				margin-right: 0.5em;
				}
			.pickup_info ul li a {
				color: #795c2f;
				text-decoration: underline;
				}

.rss-headline {
	margin: 1em 0;
	/*background-color: rgba(255, 255, 255, 0.2);*/
	background: #fff;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25) inset;
	}
	.rss-headline h1 {
		margin: 0 10px; padding: 10px 0 5px 16px;
		background: url("images/arrow_orange.png") no-repeat left center;
		color: #e86400;
		font-size: 16px;
		font-weight: bold;
		}
	.rss-headline .content {
		height: 320px; overflow: auto;
		padding: 0 10px;
		}
		
		ul.headline {
			margin: 0 0 2em 0; padding: 0;
			list-style: none;
			}
		ul.headline li {
			margin: 0.5em 0; padding: 0 0 0.5em 14px;
			border-bottom: 1px dashed #cfb183;
			background: url("images/arrow_tri_green.png") no-repeat left 0.2em;
			}
			ul.headline li .meta {
				font-size: 12px;
				}
				ul.headline li .meta span.update {
					display: inline;
					margin-right: 0.5em;
					color: #75a315;
					}
			ul.headline li .entry a {
				/*color: #795c2f;*/
				}
		ul.rss_info {
			display: none;
			}

/* 検索結果
================================================== */

.result-message {
	margin-bottom: 1em;
	}

.thumbnails {
	padding: 0;
	list-style: none;
}
.thumbnail {
	position: relative;
	padding: 6px;
	border: none;
	background: #fff;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
	}
	.thumbnail h3 {
		margin: 5px 0 0 0;
		font-size: 14px;
		}
		.thumbnail h3 .flag {
			}
			.thumbnail h3 .flag img {
				margin-top: 3px;
				vertical-align: text-top;
				}
	.thumbnail a {
		color: #795c2f;
		}

/* 詳細
================================================== */

#recipe,
#info {
	margin: 10px 0 10px 0; padding: 15px 10px 10px 10px;
	border-radius: 4px;
	background: #fff;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
	}

	#recipe h1,
	#info h1 {
		margin-bottom: 4px; padding-left: 30px;
		background: url("images/recipe_title_bg.png") no-repeat left center;
		}

	#recipe h2 {
		padding-left: 16px;
		background: url("images/arrow_orange.png") no-repeat left center;
		color: #e86400;
		}

	img.photo_main,
	img.photo_foodstuff {
		width: 276px;
		margin: 0 0 5px 0;
		}

	img.photo_main,
	img.photo_foodstuff,
	img.photo_step {
		border: 2px solid #fff;
		box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
		}

	.step-comment1,
	.step-comment2 {
		float: left;
		}
	.step-photo1,
	.step-photo2 {
		float: right;
		white-space: nowrap;
		text-align: right;
		}
	.step-comment1 { width: 74%; } .step-photo1 {   width: 25%; }
	.step-comment2 { width: 49%; } .step-photo2 {   width: 50%; }

		img.photo_step {
			width: 120px;
			margin: 0 0 5px 5px;
			}
		span.step {
			padding: 2px 9px;
			border-radius: 14px;
			background: #f7e4a3;
			color: #e86400;
			font-size: 14px;
			text-shadow: none;
			}

iframe.youtube {
	width: 600px; height: 338px;
	}

th ul, td ul,
th ol, td ol {
	margin-bottom: 0;
	}
	.sphere {
		margin: 0; padding: 0;
		list-style: none;
		}
		.sphere li {
			padding-left: 10px;
			background: url("images/arrow_tri_beige.png") no-repeat 2px center;
			}

.pickup_genre,
.pickup_country {
	}
	.pickup_genre h1,
	.pickup_country h1 {
		padding-left: 26px; line-height: 30px;
		background: url("images/recipe_title_bg.png") no-repeat left center;
		color: #e86400;
		font-size: 18px;
		}

.pub-date {
	margin-bottom: 20px; padding-top: 5px;
	border-top: 1px dotted #cfb183;
	text-align: right;
}

/* Information
================================================== */

ul.info_list {
	margin: 0; padding: 0;
	list-style: none;
	}
ul.info_list li {
	margin: 0 0 10px 0; padding: 0 0 10px 18px;
	border-bottom: 1px dashed #cfb183; /* 795c2f */
	background: url("images/arrow_tri_green.png") no-repeat 4px 0.2em;
	}
ul.info_list li:last_child {
	border-bottom: none;
	}
	.info_list li .date {
		display: inline;
		margin-right: 0.5em;
		color: #75a315;
		}
	.info_list li .title {
		display: inline;
		font-weight: bold;
		}
	.info_list li .desc {
		margin: 0.5em 0 0 0;
		font-size: 12px;
		}

.page_meta {
	margin: 0 1em;
	text-align: right;
	}
.page_content {
	margin: 1em 1em 4em 1em;
	}
	.photo_info {
		float: right;
		margin: 0 0 10px 10px;
		}

/* Social Plugins (Facebook, twitter)
================================================== */
.header-share-button {
	text-align: right;
}
iframe.twitter-share-button {
	width: 100px !important;
}

#fb_likebox,
.fb-like-box {
	margin: 1.5em 0 1em 0;
	}
	#fb_likebox iframe,
	.fb-like-box {
		background: #fff;
		}

.social-button {
	margin: 0 0 10px 0; padding: 0;
	border-radius: 4px;
	/*border-top: 1px solid #e7d8c0; border-left: 1px solid #e7d8c0;*/
	}
	.fb-like,
	.twitter-share-button {
		margin-right: 5px;
		vertical-align: top;
		}

.fb-comments {
	background: #fff;
	}
	
/* media query
================================================== */

/* Landscape phones and down */
@media (max-width: 480px) {
	#header .header-box {
		height: 110px;
		background: url("images/header_container_bg_phone.png") no-repeat center top;
		}
		.header-share-button {
			margin-bottom: 5px;
			text-align: left;
		}
	#footer {
		padding-top: 10px;
		text-align: center;
		}
		#footer .container {
			padding: 5px 0;
			}
		.site-nav-sub {
			float: none;
			}
			.site-nav-sub li a {
				margin: 0 10px 0 0;
				}
		#footer .footer_logo {
			float: none;
			margin: 0 auto 5px auto;
			}
		#footer a {
			color: #fff;
			}

	.thumbnail {
		padding: 3px;
	}

	img.photo_main,
	img.photo_foodstuff {
		width: 100%;
		margin: 0 auto 1em auto;
		border: none;
		}
	img.photo_step {
		width: 100px;
		}
}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
	body {
		margin: 0; padding: 0;
		}
	.container {
		/*margin: 0 5px;*/
		}
	#header .header-box {
		height: 110px;
		background: url("images/header_container_bg_phone.png") no-repeat center top;
		}
	#footer {
		padding-top: 10px;
		}
		#footer .container {
			padding: 10px 0;
			}
	
	.recipe-area ul li a {
    	width: 45%;
		}
	.recipe-genre ul li a {
    	width: 44%;
    	margin: 0;
		}

	div.photo_main,
	div.photo_foodstuff {
		text-align: center;
		}
		
	iframe.youtube {
		width: 280px; height: 158px;
		}
		
	.step-comment1,
	.step-comment2 {
		float: none;
		width: auto;
		margin: 0 0 0.5em 0;
		}
	.step-photo1,
	.step-photo2 {
		float: none;
		width: auto;
		margin: 0 0 0.5em 0;
		white-space: nowrap;
		text-align: left;
		}
}

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
	.container { max-width: 970px; }

	#header .header-box {
		height: 110px;
		background: url("images/header_container_bg_tablet.png") no-repeat center top;
		}
		
	.recipe-area ul li a {
    	width: 45%;
		}
	.recipe-genre ul li a {
    	width: 44%;
    	margin: 0;
		}
	
	iframe.youtube {
		width: 456px; height: 257px;
		}
		
	.step-comment1,
	.step-comment2 {
		width: 65%;
		}
	.step-photo1,
	.step-photo2 {
		width: 34%;
		white-space: normal;
		}
}

/* Large desktop */
@media (min-width: 1200px) {
	.container { width: 970px; }
	#header .header-bg {
		background-color: #3b6c35;
	}
}
