@charset "utf-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style:normal;
	font-weight: normal;
/*	font-size: 100%;*/
	vertical-align: baseline;
	color:#332b25;
	box-sizing: border-box;
}

#recipe_Wrap {
    margin: 0px;
    padding: 0px;
font-family:  Roboto, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 18px;
    line-height: 180%;
    background-color: #ffffff;
	color:#313131;
 overflow: hidden;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
section {clear: both;}

html{
    overflow-y: scroll;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

input, textarea {
	margin: 0;
	padding: 0;
}

ol, ul{
    list-style:none;
}

table{
    border-collapse: collapse; 
    border-spacing:0;
}

caption, th{
    text-align: left;
}

a:focus {
	outline:none;
}

.clearfix:after {
	content: "."; 
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix {
	min-height: 1px;
}

* html .clearfix {
	height: 1px;
	/*¥*//*/
	height: auto;
	overflow: hidden;
	/**/
}
.both{
	clear:both;
}

.inline_block {  
	display: inline-block;  
	*display: inline;  
	*zoom: 1;  
}


table {	width:100%;}


a img:hover {
	filter: alpha(opacity=75);
	-moz-opacity:0.75;
	opacity:0.75;
}

img{ vertical-align:bottom;}

a:hover img {
 opacity: 0.7;
 filter: alpha(opacity=70);
 -moz-opacity: 0.7;
 	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.5s;
}
.eqNv a:hover {color:#f51072;}

.tc{ text-align:center;}
.tr{ text-align:right;}
.tl{ text-align:left;}

.fl {float:left;}
.fr {float:right;}
.cl {clear:both;}

.mr5{ margin-right:5px;}
.mr10{ margin-right:10px;}
.mr11{ margin-right:11px;}
.mr12{ margin-right:12px;}
.mr13{ margin-right:13px;}
.mr14{ margin-right:14px;}
.mr15{ margin-right:15px;}
.mr20{ margin-right:20px;}
.mr25{ margin-right:25px;}
.mr40{ margin-right:40px;}

.mt5{ margin-top:5px;}
.mt10{ margin-top:10px;}
.mt15{ margin-top:15px;}
.mt20{ margin-top:20px;}
.mt30{ margin-top:30px;}
.mt40{ margin-top:40px;}
.mt50{ margin-top:50px;}

.mt100{ margin-top:100px;}

.mb5{ margin-bottom:5px;}
.mb10{ margin-bottom:10px;}
.mb12{ margin-bottom:12px;}
.mb15{ margin-bottom:15px;}
.mb20{ margin-bottom:20px;}
.mb30{ margin-bottom:30px;}
.mb50{ margin-bottom:50px;}
.mb60{ margin-bottom:60px;}


.ml5{ margin-left:5px;}
.ml10{ margin-left:10px;}
.ml20{ margin-left:20px;}
.ml25{ margin-left:25px;}
.ml30{ margin-left:30px;}

img {vertical-align:bottom;}
.tc {text-align: center; display: inline;margin: 0 40px;}
.tc span{font-size: .8em;font-weight: bold;line-height: 1.4em;color: #fff;}

.inner {width:1000px;margin-left:auto;margin-right:auto;position: relative;}
.hidden {opacity:0;}
.block {display: block;opacity:100;}

.txtS {font-size:12px;letter-spacing: 0 !important;}
.txtSS {font-size:12px !important;line-height: 15px !important;}

/**************--------------------
BTN
----------------*****************/

.btn_wrap {text-align: center;box-sizing:border-box;}
.btn_l {width:420px;font-size: 1.2em; text-decoration: none; padding:10px; background:#ED58A2;font-weight: bold;color:#FFF !important;border-radius:3px;display: inline-block;box-sizing:border-box;line-height:1em;text-align: center;border:solid 2px #ED58A2;}

.btn_l.col_01 {background:#8DBD2E;border:solid 2px #8DBD2E;}
.btn_l.col_01:hover {background: #FFF;color:#8DBD2E !important;}

.btn_l.col_03 {background:#FFCB48;border:solid 2px #FFCB48;}
.btn_l.col_03:hover {background: #FFF;color:#FFCB48 !important;}

.btn_l.col_02_02 {background:#ED58A2;border:solid 2px #ED58A2;}
.btn_l.col_02_02:hover {background: #FFF;color:#ED58A2 !important;}

.btn_l2 {width:420px;font-size: 1.2em; text-decoration: none; padding:10px; background:#FFEB3B;font-weight: bold;color:#FFF !important;border-radius:3px;display: inline-block;box-sizing:border-box;line-height:1em;text-align: center;border:solid 2px #FFEB3B;}
.btn_f {width:420px;font-size: 1.2em; text-decoration: none; padding:10px; background:#8DBD2E;font-weight: bold;color:#FFF !important;border-radius:3px;display: inline-block;box-sizing:border-box;line-height:1em;text-align: center;border:solid 2px #8DBD2E;}
.btn_f:hover {background: #FFF;color:#8DBD2E !important;}
.btn_l2.col_02 {background:#FFCB48;border:solid 2px #FFCB48;}
.btn_l2.col_02:hover {background: #FFF;color:#FFCB48 !important;}
.btn_l3 {width:420px;font-size: 1.2em; text-decoration: none; padding:10px; background:#ED58A2;font-weight: bold;color:#FFF !important;border-radius:3px;display: inline-block;box-sizing:border-box;line-height:1em;text-align: center;border:solid 2px #ED58A2;}
.btn_l3.col_03 {background:#ED58A2;border:solid 2px #ED58A2;}
.btn_l3.col_03 span{font-size: .8em;font-weight: bold;line-height: 1.6em;color: #fff;}
.btn_l3.col_03:hover {background: #FFF;color:#ED58A2 !important;}

.btn_f:hover span {background: #FFF;color:#8DBD2E !important;}
.btn_l2.col_02:hover span {background: #FFF;color:#FFCB48 !important;}
.btn_l3.col_03:hover span {background: #FFF;color:#ED58A2 !important;}
/**************--------------------
TOP
----------------*****************/
#header {padding:6px 0;}
#header .inner {display:flex;justify-content:flex-start;align-items: center;position: relative;}

.mainvisual {padding: 40px 0 ;background: url("/lp/2005_recipe_soy/mv.jpg") no-repeat left top #F7F6FC;
min-width: 1100px;}
.mainvisual > .inner {position: relative;text-align: left;width:1000px;}
.mainvisual > .inner .mv_ttl {margin-bottom: 20px;}
.mv_txt {
  background: rgba(255,255,255,0.90);
  display: inline-block;
  padding:20px;
  -webkit-box-shadow: 4px 4px 9px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 4px 4px 9px 0px rgba(0,0,0,0.2);
box-shadow: 4px 4px 9px 0px rgba(0,0,0,0.2);
}
.mv_overimg {
  position: absolute;
  left:564px;
  top:-60px;
}


section {padding: 60px 0;}

.cont01 {background:#FFF6ea;}
.flx-jbc {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.cont01_ttl {
  color:#ED58A2;
  font-weight: bold;
  font-size: 36px;
  border-bottom:dashed 1px #ED58A2;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
.point_list {counter-reset: my-counter;}
.point_list li {
  margin-bottom: 10px;
  padding-left: 30px;
  position: relative;
}
.point_list li:before{
  content: counter(my-counter);
  counter-increment: my-counter;
  background-color:#ED58A2;
  color: #FFF;
  display: block;
  float: left;
  line-height: 22px;
  margin-left: -30px;
  margin-top: 5px;
  text-align: center;
  height: 22px;
  width: 22px;
  border-radius: 50%;
}
.point_list li .txt_p {
  font-weight: bold;
  color:#ED58A2;
  background: linear-gradient(transparent 60%, #FFFA89 60%);
}

.ttl-01 {
  position: relative;
  background:  #DFFFDF;
  box-shadow: 0px 0px 0px 5px #DFFFDF;
  border: dashed 2px white;
  padding: 0.2em 0.5em;
  color: #453535;
  font-size: 30px;
  font-weight: bold;
  margin-bottom: 15px;
}
.ttl-01 span {font-size: .8em;font-weight: bold;}
.ttl-01:after {
  position: absolute;
  content: '';
  left: -7px;
  top: -7px;
  border-width: 0 0 15px 15px;
  border-style: solid;
  border-color: #fff #fff #AADB90;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);
}

.ttl-01.col_01 {background:#DFFFDF;box-shadow: 0 0 0 5px #DFFFDF;}
.ttl-01.col_01::after {border-color: #fff #fff #AADB90;}

.ttl-01.col_02 {background:#FFE0DF;box-shadow: 0 0 0 5px #FFE0DF;}
.ttl-01.col_02::after {border-color: #fff #fff #EDC3C1;}

.ttl-01.col_03 {background:#FFEDAF;box-shadow: 0 0 0 5px #FFEDAF;}
.ttl-01.col_03::after {border-color: #fff #fff #E8E39F;}

.txt_comming {background: #EEE;color:#606060;text-align: center;font-weight: bold;padding:60px;}


.recipe_list {
  display: flex;
  justify-content: space-between;
}
.recipe_list li {
  width:32%;
  border:solid 1px #EEE;
  border-radius: 5px;
  padding:14px;
  -webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.2);
box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.2);
  margin-bottom: 25px;
}
.recipe_list li img {width:100%;}
.recipe_list li p {font-weight: bold;
margin-top: 5px;}
.recipe_list li p span {font-size: .8em;font-weight: bold;display: block;line-height: 1.4em;margin-right: 1em;}

/*個別ページ*/
#header.sub_header .inner {display:flex;justify-content:space-between;align-items: center;position: relative;}
#header a {text-decoration: none;}
a .mv_subttl {color: #5E463E;font-weight: bold;display: flex;align-items: center;font-size: 26px;text-decoration: none !importantS;}
.mv_subttl span {color:#FFF;font-size: 14px;background:#ED58A2;padding:0 20px;border-radius: 30px; margin-right: 10px;line-height: 24px;}
.mainvisual_s {padding: 30px 0 ;background: url("/lp/2005_recipe_soy/mv.jpg") no-repeat left center #F7F6FC;
background-size: contain;
min-width: 600px;}


.ttl-02 {
  position: relative;
  background:  #DFFFDF;
  box-shadow: 0px 0px 0px 5px #DFFFDF;
  border: dashed 2px white;
  padding: 0.4em 1em;
  color: #453535;
  font-size: 36px;
  font-weight: bold;
  margin-bottom: 15px;
}
.ttl-02 span {font-size: .6em;font-weight: bold;display: block;margin-bottom: 5px;}
.ttl-02:after {
  position: absolute;
  content: '';
  left: -7px;
  top: -7px;
  border-width: 0 0 15px 15px;
  border-style: solid;
  border-color: #fff #fff #AADB90;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);
}

.ttl-02.col_01 {background:#DFFFDF;box-shadow: 0 0 0 5px #DFFFDF;}
.ttl-02.col_01::after {border-color: #fff #fff #AADB90;}


.mv_txt2 {
  background: rgba(255,255,255,0.90);
 display: inline-block;
  padding:20px;
  -webkit-box-shadow: 4px 4px 9px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 4px 4px 9px 0px rgba(0,0,0,0.2);
box-shadow: 4px 4px 9px 0px rgba(0,0,0,0.2);
}

.ttl-02.col_02 {background:#FFE0DF;box-shadow: 0 0 0 5px #FFE0DF;}
.ttl-02.col_02::after {border-color: #fff #fff #EDC3C1;}

.ttl-02.col_03 {background:#FFEDAF;box-shadow: 0 0 0 5px #FFEDAF;}
.ttl-02.col_03::after {border-color: #fff #fff #E8E39F;}

.mainvisual_s .img_list {position: absolute;display: flex;right:-50px;top:-10px;}
.mainvisual_s .img_list li {position: relative;display: block;height: 170px;width: 170px;background-size: cover;border-radius: 50%;margin-left: -10px;background-position: center;
}
.mainvisual_s .img_list li::after {
  position: absolute;
  content: '';
left: -6px;
    top: -6px;
    width: 174px;
    height: 174px;
  border-radius: 50%;
  border:dotted 4px #AADB90;
}
.mainvisual_s .img_list li:nth-of-type(2n) {
  margin-top: 100px;
}

.mainvisual_s .img_list2 {position: absolute;display: flex;right:-85px;top:-10px;}
.mainvisual_s .img_list2 li {position: relative;display: block;height: 150px;width: 150px;background-size: cover;border-radius: 50%;margin-left: -10px;background-position: center;
}
.mainvisual_s .img_list2 li::after {
  position: absolute;
  content: '';
left: -6px;
    top: -6px;
    width: 154px;
    height: 154px;
  border-radius: 50%;
  border:dotted 4px #EDC3C1;
}
.mainvisual_s .img_list2 li:nth-of-type(2n) {
  margin-top: 100px;
}

.mainvisual_s .img_list3 {position: absolute;display: flex;right:-85px;top:-10px;}
.mainvisual_s .img_list3 li {position: relative;display: block;height: 140px;width: 140px;background-size: cover;border-radius: 50%;margin-left: -10px;background-position: center;
}
.mainvisual_s .img_list3 li::after {
  position: absolute;
  content: '';
left: -6px;
    top: -6px;
    width: 144px;
    height: 144px;
  border-radius: 50%;
  border:dotted 4px #E8E39F;
}
.mainvisual_s .img_list3 li:nth-of-type(2n) {
  margin-top: 100px;
}

.s_cont01 .catch {padding:15px 0 0;font-weight: bold;}

.recipe_wrap:nth-last-of-type(2n) {
  background: #FFF6ea;
}
.recipe_ttl {
  color:#5E463E;
  border-bottom:dashed 2px #5E463E;
  padding-bottom: 5px;
  margin-bottom: 20px;
  font-size: 24px;
  font-weight: bold;
}
.recipe_ttl span {display: inline-block;font-weight: bold;margin-right: 1em;font-size: .8em;line-height: 1.4;}
.recipe_ttl02,.recipe_material dt {
  margin: 20px 0 8px;
  color:#5E463E;
  font-size: 22px;
  font-weight: bold;
}
.recipe_wrap .flx-jbc .img {
  background: #FFF;
  padding: 10px;
  border-radius:3px;
-webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.2);
box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.2);
}
.recipe_wrap .flx-jbc .txt_box {
  width:420px;
}
.recipe_material dd {
  padding-left: 1em;
  text-indent: -1em;
}
.recipe_material dd::before {
  content: "・";
}
.material_block_ttl {
  margin: 20px 0 0;
  color:#5E463E;
  font-size: 20px;
  font-weight: bold;
}
.recipe_material dd.material_block_ttl::before {
  content: "";
}
.making {counter-reset: making-counter;margin-left: 30px;}
.making li {
  margin-bottom:6px;
  padding-left: 26px;
  position: relative;
}
.making li:before{
  content: counter(making-counter);
  counter-increment: making-counter;
  background-color:#51AC1F;
  color: #FFF;
  display: block;
  float: left;
  line-height: 20px;
  margin-left: -30px;
  margin-top: 5px;
  text-align: center;
  height: 20px;
  width: 20px;
  border-radius: 50%;
}


.making2 {counter-reset: making-counter;margin-left: 30px;}
.making2 li {
  margin-bottom:6px;
  padding-left: 26px;
  position: relative;
}
.making2 li:before{
  content: counter(making-counter);
  counter-increment: making-counter;
  background-color:#ED58A2;
  color: #FFF;
  display: block;
  float: left;
  line-height: 20px;
  margin-left: -30px;
  margin-top: 5px;
  text-align: center;
  height: 20px;
  width: 20px;
  border-radius: 50%;
}

.making3 {counter-reset: making-counter;margin-left: 30px;}
.making3 li {
  margin-bottom:6px;
  padding-left: 26px;
  position: relative;
}
.making3 li:before{
  content: counter(making-counter);
  counter-increment: making-counter;
  background-color:#FFCB48;
  color: #FFF;
  display: block;
  float: left;
  line-height: 20px;
  margin-left: -30px;
  margin-top: 5px;
  text-align: center;
  height: 20px;
  width: 20px;
  border-radius: 50%;
}


/* footer */
footer {background:#ffffff;padding-top: 40px;}
ul#fotterlink {width:100%;text-align:center;padding:10px 0 5px;}
ul#fotterlink li {
 display:inline-block;
 font-size:12px;
  padding:0 1em;
}

.foot_nav{
	width: 1000px;
	margin: 0 auto;
	text-align: center;
}
.link_wrap{
	height: 70px;
}
.btn_all {width:420px; font-size: 1.2em; text-decoration: none; padding:10px 0; margin: 0 auto;background:#FFCB48;font-weight: bold;color:#FFF !important;border-radius:3px;box-sizing:border-box;line-height:1em;vertical-align: center;border:solid 2px #FFCB48;display: list-item;height: 70px;}
.btn_all:hover {background: #FFF;color:#FFCB48 !important;}

.copy {color:#fff;padding:5px;text-align: center;background:#67B700;font-size:12px;line-height:1em;}