@font-face {
	font-family: 'icomoon';
	src:url('fonts/icomoon.eot');
	src:url('fonts/icomoon.eot?#iefix-vfdd75') format('embedded-opentype'),
		url('fonts/icomoon.woff') format('woff'),
		url('fonts/icomoon.ttf') format('truetype'),
		url('fonts/icomoon.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
* { margin:0; padding:0; font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
a { text-decoration:none; color:rgba(55,55,55,1.00); }

body { background:url(/gold/recipe/images/bg.jpg) }

header { background:rgba(255,255,255,1.00); width:320px; margin:0 auto 1em; }
header #header_inner { width:320px; margin:0 auto; }
header #header_inner h1 { clear:both; width:100%; text-align:center; }
header nav {
	text-align: center;
	background:#FFFFFF;
}
header nav ul {
	margin: 0;

	list-style-type: none;
}
header nav ul li {
	display: block;
	font-size:12px;
}
header nav ul li:first-child {
	margin-left: 0;
}
header nav ul li a { display:block; padding:0.6em; border-bottom:rgba(255,255,255,1.00) 2px solid;}
header nav ul li a span { font-size:2em; margin-right:0.2em;}
header nav ul li a.home:hover { border-bottom:rgba(32,111,0,1.00) 2px solid; }
header nav ul li a.recipe:hover { border-bottom:rgba(255,118,0,1.00) 2px solid; }
header nav ul li a.column:hover { border-bottom:rgba(91,165,225,1.00) 2px solid; }
header nav ul li a.home span { color:rgba(32,111,0,1.00); }
header nav ul li a.recipe span { color:rgba(255,118,0,1.00); }
header nav ul li a.column span { color:rgba(91,165,225,1.00); }
header nav ul li ul {
	display: none;
}

div.Breadcrumb {
display:none;
width: 320px;
clear:both;
background:rgba(255,255,255,0.4);
}
div.Breadcrumb ul {
padding: 11px 0 11px 0;
width: 320px;
margin: 0 auto;
}
.cFix {
min-height: 1px;
}
div.Breadcrumb ul li {
display: inline;
float: left;
font-size: 12px;
color: #333;
padding:4px; 
}
div.Breadcrumb ul li.now { background:rgba(255,255,255,0.6); padding:2px 6px; border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;  }
.cFix:after {
content: ".";
display: block;
clear: both;
height: 0;
visibility: hidden;
}
footer { background:rgba(23,83,14,1.00); padding:3em 0; }
footer:after { content: ""; display: block; clear: both; height: 1px; overflow: hidden; }
footer div.inner { width:320px; margin:0 auto; font-size:12px; }
footer div.inner div.item { width:240px; margin:0 0 0 60px; float:left; }
footer div.inner div.item ul li { list-style:none; margin-bottom:1em; }
footer div.inner div.item ul li.big { font-size:14px; } 
footer div.inner div.item ul li a { color:rgba(255,255,255,1.00); }
footer div.inner div.item ul li a:hover { color:rgba(232,255,0,1.00); }
#screen { width:320px; position:relative; margin:0 auto; }
#screen #pick_up { 
display:none;
	width: 300px;
	padding: 10px;
	background: rgba(255,255,255,1.0);
	border-radius: 3px;
}
#screen #pick_up img { display:none; }
#screen:hover #pick_up { opacity:0.9; }
#screen #pick_up h3 { margin:1em 0; }
#screen #pick_up div.tip { width:70%; height:60px;}
#screen #pick_up div.tip div.f_left { float:left; margin:5px;  }
#screen #pick_up div.midashi01 {
 /* サイズ指定 */        
 width:60px;
 height:60px;
 /* 背景色 */
 background-color:#FF7F1D;
 /* 角を丸くする */
 border-radius: 50%;
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;
}
#screen #pick_up div.midashi02 {
 /* サイズ指定 */        
 width:60px;
 height:60px;
 /* 背景色 */
 background-color:rgba(109,205,126,1.00);
 /* 角を丸くする */
 border-radius: 50%;
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;
}
#screen #pick_up div.midashi03 {
 /* サイズ指定 */        
 width:60px;
 height:60px;
 /* 背景色 */
 background-color:rgba(130,188,225,1.00);
 /* 角を丸くする */
 border-radius: 50%;
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;
}
#screen #pick_up .midashi01,#screen #pick_up .midashi02,#screen #pick_up .midashi03 { /* 真ん中にまで文字を下ろす */
padding:0;
}
 
#screen #pick_up .midashi01 p,#screen #pick_up .midashi02 p,#screen #pick_up .midashi03 p {
 text-align: center; /* 中央寄せ */
 color: #fff; /* 文字を白色に */
 margin-top: -30px; /* h1とpの余白をリセット */
 font-size:12px; line-height:1.0em;
}
 
#screen #pick_up .midashi01 p span,#screen #pick_up .midashi02 p span,#screen #pick_up .midashi03 p span { font-size:12px; display:block; }
#recipe_content { width:320px; margin:0 auto 20px; background:rgba(255,255,255,1.00);}

#recipe_content #concept { width:90%; margin:10px auto; padding:3px; background:rgba(255,255,255,1.00);
position:relative;
box-sizing:border-box;
/* border-radius */
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;

background:url(/gold/recipe/images/concept.jpg) center no-repeat; background-color:rgba(255,255,255,1.00); height:140px; }
#pick_recipe a figure { width:100%; overflow: hidden;  }
#pick_recipe a figure img { width:100%; }
ul li { list-style:none; }

ul#recipe_list { width:100%; clear:both; padding:60px 0; background:url(/gold/recipe/images/x.png) repeat-x; }
ul#recipe_list:after { content: ""; display: block; clear: both; height: 1px; overflow: hidden; }
ul#recipe_list li { width:46%; float:left; margin:5px 5px 5px 7px; padding:3px; background:rgba(255,255,255,1.00);
position:relative;
box-sizing:border-box;
/* border-radius */
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;

/* box-shadow */
box-shadow:rgba(215, 215, 215, 0.6) 0px 0px 2px 2px;
-webkit-box-shadow:rgba(215, 215, 215, 0.6) 0px 0px 2px 2px;
-moz-box-shadow:rgba(215, 215, 215, 0.6) 0px 0px 2px 2px; cursor:pointer; opacity:1.0; }
/*
ul#recipe_list li:hover { opacity:0.8; }
*/
ul#recipe_list li img {
-webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
ul#recipe_list li:hover img {    -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1); }
ul#recipe_list li a { display:block; }
ul#recipe_list li a figure { width:100%; overflow: hidden; }
ul#recipe_list li a p { font-size:12px; padding:0 1em; margin:1em 0 2em; }
ul#recipe_list li a p.sentence {
height: 36px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
ul#recipe_list li a h4 { padding:0 1em; font-size:12px; height:30px; margin-top:1em; }
ul#recipe_list li a div.tip { width:115px; height:50px;}
ul#recipe_list li a div.tip div.f_left { float:left; margin:2px;  }
ul#recipe_list li a div.midashi {
	position:absolute;
	top:-3px;
	left:-3px;
 /* サイズ指定 */        
 width:50px;
 height:50px;
 /* 背景色 */
 background-color:#FF7F1D;
 /* 角を丸くする */
 border-radius: 50%;
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;
}
ul#recipe_list li a .midashi { /* 真ん中にまで文字を下ろす */
padding:0;
}
 
ul#recipe_list li a .midashi p {
 text-align: center; /* 中央寄せ */
 color: #fff; /* 文字を白色に */
 margin-top: -35px; /* h1とpの余白をリセット */
}
 
/* あとは文字サイズや太字を指定 */
ul#recipe_list li a .midashi p {font-size:12px; line-height:1.0em;}
ul#recipe_list li a .midashi p span { font-size:10px; display:block; }

ul#recipe_list li a div.midashi01 {
 /* サイズ指定 */        
 width:50px;
 height:50px;
 /* 背景色 */
 background-color:#FF7F1D;
 /* 角を丸くする */
 border-radius: 50%;
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;
}
ul#recipe_list li a div.midashi02 {
 /* サイズ指定 */        
 width:50px;
 height:50px;
 /* 背景色 */
 background-color:rgba(109,205,126,1.00);
 /* 角を丸くする */
 border-radius: 50%;
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;
}
ul#recipe_list li a div.midashi03 {
 /* サイズ指定 */        
 width:50px;
 height:50px;
 /* 背景色 */
 background-color:rgba(130,188,225,1.00);
 /* 角を丸くする */
 border-radius: 50%;
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;
}
ul#recipe_list li a .midashi01,ul#recipe_list li a .midashi02,ul#recipe_list li a .midashi03 { /* 真ん中にまで文字を下ろす */
padding:0;
}
 
ul#recipe_list li a .midashi01 p,ul#recipe_list li a .midashi02 p,ul#recipe_list li a .midashi03 p {
 text-align: center; /* 中央寄せ */
 color: #fff; /* 文字を白色に */
 margin-top: -31px; /* h1とpの余白をリセット */
 font-size:10px; line-height:1.0em;
}
 
ul#recipe_list li a .midashi01 p span,ul#recipe_list li a .midashi02 p span,ul#recipe_list li a .midashi03 p span { font-size:10px; display:block; }

ul.categ { width:320px; margin:1em auto; height:60px; padding-top:2em; background:url(../images/cate_bg.png) top center no-repeat; clear:both; }
ul.categ li { width:60px; margin:0 10px; float:left;}
ul.categ li a { 
display:block;
width:60px;
 height:60px;
outline: none;
position: relative;
z-index: 2;}
ul.categ li a.main {  background: transparent url(/gold/recipe/images/main.png) no-repeat top left;
text-indent: -9000px; }
ul.categ li a.meat {  background: transparent url(/gold/recipe/images/meat2.png) no-repeat top left;
text-indent: -9000px; }
ul.categ li a.salad {  background: transparent url(/gold/recipe/images/salad.png) no-repeat top left;
text-indent: -9000px; }
ul.categ li a.dessert {  background:transparent url(/gold/recipe/images/dessert.png) no-repeat top left;
text-indent: -9000px; }
ul.categ li a span{
width: 50px;
	height: auto;
	line-height: 20px;
	padding: 10px;
	left: 50%;
	margin-left: -40px;

	font-style: italic;
	font-size: 12px;
	color:rgba(57,10,11,1.00);
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
	text-align: center;
	border: 3px solid #FFC638;
	background: rgba(255,255,255,0.9);
	text-indent: 0px;
	border-radius: 10px;
	position: absolute;
	pointer-events: none;
	bottom: 100px;
	opacity: 0;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition: all 0.1s ease-in-out;
	-o-transition: all 0.1s ease-in-out;
	-ms-transition: all 0.1s ease-in-out;
	transition: all 0.1s ease-in-out;
}
ul.categ li a span:before,
ul.categ li a span:after{
	content: '';
	position: absolute;
	bottom: -15px;
	left: 50%;
	margin-left: -9px;
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid rgba(0,0,0,0.1);
}
ul.categ li a span:after{
	bottom: -12px;
	margin-left: -10px;
	border-top: 10px solid #FFC638;
}
ul.categ li a:hover span{
	opacity: 0.9;
	bottom: 60px;
}

ul.categ_next { width:320px; margin:1em auto; height:60px; padding-top:2em; background:url(../images/cate_bg.png) top center no-repeat; clear:both; }
ul.categ_next li { width:60px; margin:0 10px; float:left;}
ul.categ_next li a { 
display:block;
width:60px;
 height:60px;
outline: none;
position: relative;
z-index: 2;}
ul.categ_next li a.main {  background: transparent url(/gold/recipe/images/main.png) no-repeat top left;
text-indent: -9000px; }
ul.categ_next li a.meat {  background: transparent url(/gold/recipe/images/meat2.png) no-repeat top left;
text-indent: -9000px; }
ul.categ_next li a.salad {  background: transparent url(/gold/recipe/images/salad.png) no-repeat top left;
text-indent: -9000px; }
ul.categ_next li a.dessert {  background:transparent url(/gold/recipe/images/dessert.png) no-repeat top left;
text-indent: -9000px; }
ul.categ_next li a span{
width: 50px;
	height: auto;
	line-height: 20px;
	padding: 10px;
	left: 50%;
	margin-left: -40px;

	font-style: italic;
	font-size: 12px;
	color:rgba(57,10,11,1.00);
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
	text-align: center;
	border: 3px solid #FFC638;
	background: rgba(255,255,255,0.9);
	text-indent: 0px;
	border-radius: 10px;
	position: absolute;
	pointer-events: none;
	bottom: 100px;
	opacity: 0;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition: all 0.1s ease-in-out;
	-o-transition: all 0.1s ease-in-out;
	-ms-transition: all 0.1s ease-in-out;
	transition: all 0.1s ease-in-out;
}
ul.categ_next li a span:before,
ul.categ_next li a span:after{
	content: '';
	position: absolute;
	bottom: -15px;
	left: 50%;
	margin-left: -9px;
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid rgba(0,0,0,0.1);
}
ul.categ_next li a span:after{
	bottom: -12px;
	margin-left: -10px;
	border-top: 10px solid #FFC638;
}
ul.categ_next li a:hover span{
	opacity: 0.9;
	bottom: 60px;
}

.search {
	width:300px;
	margin:0 auto 30px;
}

.gsib_a {
 padding: 0 !important;
}

.gsc-search-button-v2 {
 margin-top:0 !important;
}

.circle {
	width:60px;
	margin:0 auto;
	padding:0 0 80px 0;
}

.circle a {
	width: 60px;
	margin:0 auto;
	color: #fff;
	height: 60px;
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	background-color: #faa0c0;/* 円の色 */
	border-radius: 60px;
	-moz-border-radius: 60px;
	-webkit-border-radius: 60px;
	font-weight: bold;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
}

.circle a:hover {
	-webkit-transform: scale( 1.5 );
	-moz-transform: scale( 1.5 );
}
