@charset "utf-8";

@import "rayout2022.css";

.text_common{
	padding:10px;
	font-size: 1.4rem;
}


a{
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	text-decoration:none;
}

/*主菜、副菜の共通アイコン*/

.ico_recipe_staplefood{
	color:#FFF;
	text-align:center;
	width:40px;
	line-height:16px;
	background-color:#999;
	font-size:1.0rem;
	font-weight:bold;
	margin:0 5px 0 0;
}


.ico_recipe_main{
	color:#FFF;
	text-align:center;
	width:40px;
	line-height:16px;
	background-color:#E996BA;
	font-size:1.0rem;
	font-weight:bold;
	margin:0 5px 0 0;
}

.ico_recipe_staplefood_w2 img,
.ico_recipe_main_w2 img,
.ico_recipe_side_w2 img,
.ico_recipe_sweet_w2 img,
.ico_recipe_soup_w2 img,
.ico_recipe_lunchbox_w2 img{
	float:left;
}

.ico_recipe_staplefood_w2{
	color:#FFF;
	text-align:center;
	width:65px;
	line-height:22px;
	background-color:#999;
	font-size:1.2rem;
	font-weight:bold;
	margin:0 5px 0 5px;
	float:left;
}

.ico_recipe_main_w2{
	color:#FFF;
	text-align:center;
	width:65px;
	line-height:22px;
	background-color:#E996BA;
	font-size:1.2rem;
	font-weight:bold;
	margin:0 5px 0 5px;
	float:left;
}

.ico_recipe_side{
	color:#FFF;
	text-align:center;
	width:40px;
	line-height:16px;
	background-color:#D9AE00;
	font-size:1.0rem;
	font-weight:bold;
	margin:0 5px 0 0;
}

.ico_recipe_side_w2{
	color:#FFF;
	text-align:center;
	width:65px;
	line-height:22px;
	background-color:#D9AE00;
	font-size:1.2rem;
	font-weight:bold;
	margin:0 5px 0 5px;
	float:left;
}


.ico_recipe_soup{
	color:#FFF;
	text-align:center;
	width:40px;
	line-height:16px;
	background-color:#6DA0CC;
	font-size:1.0rem;
	font-weight:bold;
	margin:0 5px 0 0;
}

.ico_recipe_soup_w2{
	color:#FFF;
	text-align:center;
	width:65px;
	line-height:22px;
	background-color:#6DA0CC;
	font-size:1.2rem;
	font-weight:bold;
	margin:0 5px 0 5px;
	float:left;
}

.ico_recipe_sweet{
	color:#FFF;
	text-align:center;
	width:60px;
	line-height:16px;
	background-color:#C59DC9;
	font-size:1.0rem;
	font-weight:bold;
	margin:0 5px 0 0;
}

.ico_recipe_sweet_w2{
	color:#FFF;
	text-align:center;
	width:80px;
	line-height:22px;
	background-color:#C59DC9;
	font-size:1.2rem;
	font-weight:bold;
	margin:0 5px 0 5px;
	float:left;
}



.ico_recipe_lunchbox{
	color:#FFF;
	text-align:center;
	width:40px;
	line-height:16px;
	background-color:#e6a953;
	font-size:1.0rem;
	font-weight:bold;
	margin:0 5px 0 0;
}

.ico_recipe_lunchbox_w2{
	color:#FFF;
	text-align:center;
	width:65px;
	line-height:22px;
	background-color:#e6a953;
	font-size:1.2rem;
	font-weight:bold;
	margin:0 5px 0 5px;
	float:left;
}


	


/*コラム各コンテンツの共通アイコン*/

.ico_type_oshiete{
	color:#fff;
	text-align:center;
	border-radius:7px;
	min-width:70px;
	line-height:16px;
	background-color:#e4ac4e;
	font-size:1.0rem;
	margin:0 5px 0 0;
}

.ico_type_shokuji{
	color:#fff;
	text-align:center;
	border-radius:7px;
	min-width:70px;
	line-height:16px;
	background-color:#8ea3ba;
	font-size:1.0rem;
	margin:0 5px 0 0;
}

.ico_type_column{
	color:#fff;
	text-align:center;
	border-radius:7px;
	min-width:70px;
	line-height:16px;
	background-color:#dc98ad;
	font-size:1.0rem;
	margin:0 5px 0 0;
}

.section_normal{
	clear:both;
}

.section_normal h1{
	position: absolute;
	top: 35%;
	left: 21px;
	font-size: 1.4rem;
}

.select_box_style{
	font-size:1.6rem;
	min-width:150px;
	width:90%;
	padding:5px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #999;
	background: #afa489;
	margin:0;
	border-radius:6px;
	background: url(../images/ico_selectmenu.gif) 98% 50% no-repeat, linear-gradient(to bottom, #fff 0%,#fff 95%);
	
}


.select_box_style_s{
	font-size: 1.6rem;
    min-width: 100px;
    width: 100%;
    padding: 5px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #eeeeee;
    margin: 0;
    border-radius: 5px;
    font-size: 1.4rem;
    color: #80757d;
	position: relative;
}

.select_box_style_s::after {
	content: "";
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    margin: auto;
    border-style: solid;
    border-width: 6px 4px 0 4px;
    border-color: #aea59c transparent transparent transparent;
}

.select_box_style_s .form_select {
	width: 100%;
}

.form_input_txt {
	font-size: 1.6rem;
    min-width: 100px;
    width: 100%;
    padding: 5px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #eeeeee;
    margin: 0;
    border-radius: 5px;
    font-size: 1.4rem;
    color: #80757d;
	position: relative;
}

.form_input_txt2 {
	font-size: 1.6rem;
    min-width: 100px;
    width: 60%;
    padding: 5px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #eeeeee;
    margin: 0;
    border-radius: 5px;
    font-size: 1.4rem;
    color: #80757d;
	position: relative;
}


.dl_recipe{
	margin:0 5px 0px 0;
	padding:0;
}

.dl_recipe dl{
	float:left;
	margin:0 0px 0 15px;
	
}

.dl_recipe dt{
	font-size:1.2rem;
	padding:0 4px 0 0;
	text-align:center;
	float:left;
	margin:0px;
}

.dl_recipe dd{
	font-size:1.2rem;
	padding:0 10px 0 0;
	font-weight:bold;
	text-align:center;
	float:left;
}

.ul_top_newmenu{
	clear:both;
}


.ul_top_newmenu li{
	padding:2px 0 2px 0;
	clear:both;
	color:#a49a7e;
	font-size:1.4rem;
}

.ul_top_newmenu .ico_recipe_main,.ul_top_newmenu .ico_recipe_staplefood,.ul_top_newmenu .ico_recipe_side, .ul_top_newmenu .ico_recipe_soup{
	margin:3px 10px 2px 0px;
}

.ul_top_newmenu li a{
	line-height:1.7em;
	font-size:1.4rem;
}

#box_newrecipe_tit{
	margin:0 auto 0 auto;
	padding:0 0 15px;
	font-size: 1.4rem;
}

.text_setmeal{
	padding:0 0 10px 0;
	line-height:1.5em;
}

.m_tit{
	font-size:2rem;
	margin:20px 0 0;
	line-height:1em;
	text-align:center;
}

.m_tit2{
	text-align:center;
	font-size:1.2rem;
}

.slideshow{
	padding-top:5px;
}

.tit_fuki{
	color:#4F4336;
	font-size:1.4rem;
	font-weight:bold;
	border-radius:5px;
	padding:5px 0;
	margin:0 0 5px;
	text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    -webkit-box-flex: 1;
}

.slideshow li figcaption{
	margin: 0px 5px 15px 5px;
}

.fuki_rank{
	position: relative;
	background: #F5F0EB;
	width:50%;
	border-radius:8px;
	float:left;
	padding:10px;
	margin:0px 20px 10px 0;
	font-size:1.2rem;
	line-height:1.3em;
}

.fuki_rank:after {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(70, 208, 213, 0);
	border-left-color: #F5F0EB;
	border-width: 10px;
	margin-top: -10px;
}

.fuki_rank02{
	position: relative;
	background: #F5F0EB;
	width:50%;
	border-radius:8px;
	float:right;
	padding:10px;
	margin:0px 15px 10px 10px;
	font-size:1.2rem;
	line-height:1.3em;
}

.fuki_rank02:after {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(70, 208, 213, 0);
	border-left-color: #F5F0EB;
	border-width: 10px;
	margin-top: -10px;
}

.fuki_rank02:after {
	border-color: rgba(251, 214, 144, 0);
	border-right-color: #F5F0EB;
	border-width: 8px;
	margin-top: -8px;
}

.fuki_rank .text,
.fuki_rank02 .text {
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.star-box {
	display: flex;
	flex-direction: row;
    align-items: center;
	margin: 5px 0 0;
}

.star-box .star-item {
	color: #FCC000;
	font-size: 1.4rem;
}

.star-box .star-item::before {
	color: #FCC000;
	font-size: 1.4rem;
	margin: 0 2px;
}

.star-box .star-txt {
	color: #FCC000;
	font-size: 1.4rem;
	font-weight: bold;
	margin: 0 0 0 5px;
}

#box_infomation{
	border:2px solid #aea59c;
	margin:5px auto 5px auto;
	height:33px;
	padding:0;
	clear:both;
	border-radius:8px;
	width:100%;
}

#box_infomation dl{
  width:100%;
  margin:0px;
  padding:0;
}

#box_infomation dt{
  float:left;
  clear:left;
  width:60px;
  background-color:#aea59c;
  color:#fff;
  font-weight:bold;
  margin:0;
  line-height:30px;
  border-bottom-left-radius: 5px;
  border-top-left-radius: 5px;
  padding-left:5px;
}

#box_infomation dd {
  float:left;
  padding:5px 0 5px 10px;
  line-height:20px;
  color:#aea59c;
  font-weight:bold;
}

#box_infomation dd a{
	text-decoration:none;
	color:#aea59c;
}