


/* =========================================================
		ryouen recipe
========================================================= */
#dia_fv .main_fv.recipe {
    background-image: url(../../img/ryouen/recipe/recipe_fv.jpg);
}
	

.re_title{
	margin: 45px auto 20px;
	width: 256px;
	text-align: center;
	
	
	
}

.re_copy1{
	font-size: 15px;
	line-height: 1.8;
	letter-spacing: 1.5px;
	text-align: center;
	margin-bottom: 45px;
	
	
	
}

a:hover .product{
 opacity: .5;
-webkit-opacity: .5;
-moz-opacity: .5;
filter: alpha(opacity=50);	/* IE lt 8 */
-ms-filter: "alpha(opacity=50)"; /* IE 8 */
-webkit-transition: opacity 1s ease-out;
-moz-transition: opacity 1s ease-out;
-ms-transition: opacity 1s ease-out;
transition: opacity 1s ease-out;
    }
/* =========================================================
		ryouen recipe1
========================================================= */



#recon1{
	width: 980px;
	margin: 0 auto 120px;
	
	
	
}

#recon1 ul.clearfix.re_list {
    display: flex;
    flex-wrap: wrap;
}

#recon1 .re_list li{
	width: 286px;
	border-right: 1px dotted #ccc;
	padding-right: 30px;
	padding-left: 30px;
	margin-bottom: 46px;
	/* float: left; */
	/*height: 437px;*/
}

#recon1 .re_list li:nth-child(3n+1) {
    padding-left: 0;
}
#recon1 .re_list li:nth-child(3n), #recon1 .re_list li:last-child {
    padding-right: 0;
    border-right: none;
}
#recon1 .re_list h3{
	font-size: 16px;
	padding: 20px 0 10px;
	color: #002e73;
	font-weight: 500;
	line-height: 1.5;
	
}
#recon1 .re_list .recopy1{
	font-size: 14px;
	padding: 0 0 8px;

	
}
#recon1 .recipe_name{
	height: 125px;
	
	
	
}

/* #recon1 .re_list .product {
    height: 100px;
    overflow: hidden;
} */

.re_list .product .re_protitle::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 5px;
    height: 5px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    border-top: solid 1px #505050;
    border-right: solid 1px #505050;
    pointer-events: none;
}

.re_list .product .re_protitle {
  line-height: 1.4;
color: #505050;
position: relative;
width: 53%;
display: inline-block;
vertical-align: middle;
padding-left: 16px;
margin-right: 4.5%;
}
.re_list .product .re_product{
 width: 35%;
	display: inline-block;
vertical-align: middle;
}


#product_menu{
	width: 290px;
margin: 0 0 35px;
	letter-spacing: 0.5px;
	
	
	
}


/* =========================================================
		recipe select
========================================================= */


/* =========================================================
		recipe detail
========================================================= */
#recon2{
	width: 980px;
	margin: 0 auto 120px;
	
	
	
}

.itemcon_abcrecipe2 h3{
	font-size: 25px;
}



.recipe_image{
	margin: 30px 0 55px;
	
	
	
	
}


.recipe_image .recipe_pic{
	float: left;
	margin-right: 60px;

	
	
	
}

.recipe_image .recipe_pic img {
	width: 400px;
}


.recipe_image .re_detail1{
	float: left;
	width: 480px;
	
	
}


.recipe_image .re_detail1 h2{
	font-size: 26px;
	font-weight: normal;
	margin-bottom: 15px;
	color: #002e73;
	font-weight: 500;
	
	
}

.recipe_image .re_detail1 .copy1{
	
	margin-bottom: 50px;
	
	
	
}

.recipe_image .re_detail1 .re_product{
	border: 1px #ccc solid;
	padding: 15px 10px;
	width: 230px;
	display: inline-block;
	border-radius: 5px;
	
	
}

.re_product img {
    height: 125px;
    object-fit: contain;
}

.re_pic1 img {
    max-height: 195px;
    object-fit: contain;
}

.recipe_image .re_detail1 .re_product2{
	padding: 0px 10px 15px;
	width: 204px;
	display: inline-block;
	border-radius: 5px;
	
	
}

.recipe_image .re_product h3{
	background: url(../../img/ryouen/recipe/re_icon1.png) no-repeat #fff;
  
background-size: 24px;
background-position: 4px 8px;
padding: 5px 10px 10px 33px;

display: table;
text-align: center;
margin: -32px auto 0;
font-weight: 500;
color: #002e73;
font-size: 15px;
	
	
}

.recipe_image .re_product2 h3{
padding: 5px 10px 10px 33px;
display: table;
text-align: center;
margin: -32px auto 0;
font-weight: 500;
color: #002e73;
font-size: 15px;
	
	
}

.recipe_image .re_detail1 .re_product2 .item {
	display: flex;
	justify-content: center;
}

.re_product2.item .wh {
	width: 68px;
}

.recipe_image .re_product .item_pro dt{
	float: left;
	width: 40%;
	
	
	
}

.recipe_image .re_product2 .item_pro dt{
	float: left;
	width: 40%;
	
	
	
}
.recipe_image .re_product .item_pro dd{
	float: left;
	width: 60%;
	padding-top: 27px;
	
	color: #555;
	
}

/* =========================================================
		recipe select
========================================================= */




  

@font-face{font-family:"IonIcons";src:url("//code.ionicframework.com/ionicons/2.0.1/fonts/ionicons.eot?v=2.0.1");src:url("//code.ionicframework.com/ionicons/2.0.1/fonts/ionicons.eot?v=2.0.1#iefix") format("embedded-opentype"),url("//code.ionicframework.com/ionicons/2.0.1/fonts/ionicons.ttf?v=2.0.1") format("truetype"),url("//code.ionicframework.com/ionicons/2.0.1/fonts/ionicons.woff?v=2.0.1") format("woff"),url("//code.ionicframework.com/ionicons/2.0.1/fonts/ionicons.svg?v=2.0.1#Ionicons") format("svg");font-weight:normal;font-style:normal}


#product_menu {
    position: relative;
}
#product_menu:before {
    z-index: 1;
    position: absolute;
    right: 15px;
    top: 0;
    content: "\f123";
    font-family: "IonIcons";
    line-height: 43px;
    color: #7F878C;
    pointer-events: none;
}
select{
    outline:none;
    -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    background: none transparent;
    vertical-align: middle;
    font-size: inherit;
    color: inherit;
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    height: 40px;
    padding: 8px 12px;
    border:1px solid #ddd;
    color:#828c9a;
    width:100%;
    border-radius:3px;
}
select option{
  background-color: #fff;
  color: #333;
}
select::-ms-expand {
  display: none;
}
select:-moz-focusring { 
  color: transparent; 
  text-shadow: 0 0 0 #828c9a;
}



/* =========================================================
		recipe detail2
========================================================= */
.recipe_way{
	margin-bottom: 40px;
	
	
	
}

.recipe_way .material{
	width: 470px;
	float: left;
	
	
	
	
}





.recipe_way .material h3{
	border: 1px solid #ccc;
	padding: 10px 20px 10px 52px;
	font-size:18px;
	font-weight: 500;
	
	background: url(../../img/ryouen/recipe/re_icon3.png) no-repeat;
  
background-size: 29px;
background-position: 16px center;
color: #002e73;
	margin-bottom: 20px;
	
	
	
	
}


.recipe_way .material dl{
	padding-bottom:15px;
	margin-bottom: 15px;
	border-bottom:1px dotted #ccc;
	font-size:14px;
	
}


.recipe_way .material dt{
	float: left;
	padding-left: 10px;
	
	
}
.recipe_way .material dt a {
   color: #FF0004;
	text-decoration: none;
}

.recipe_way .material dt a:hover{
  
	text-decoration: underline;
}
.recipe_way .material dt span{
	color: #FF0004;
	
	
}
.recipe_way .material dd{
	float: right;
	padding-right: 10px;
	
}






.recipe_way .howto{
	width: 470px;
	float: right;
	
	
	
	
}


.recipe_way .howto h3{
	border: 1px solid #ccc;
	padding: 10px 20px 10px 52px;
	font-size:18px;
	font-weight: 500;
	
	background: url(../../img/ryouen/recipe/re_icon2.png) no-repeat;
  
background-size: 29px;
background-position: 16px center;
color: #002e73;
	margin-bottom: 20px;
	
	
	
	
}

.recipe_way .howto li{
font-size: 14px;
line-height: 1.6;
position: relative;
padding-left: 35px;
	border-bottom:1px dotted #ccc;
	padding-bottom:20px;
	margin-bottom: 20px;
	
}
.recipe_way .howto li span{
display: inline-block;
font-size: 13px;
background: #002e73;
width: 25px;
height: 25px;
border-radius: 50%;
line-height: 22px;
text-align: center;
color: #fff;
position: absolute;
top: 3px;
left: 0;
	font-weight: bold;
	
	
	
	
}