@charset "utf-8";

/***************************************************
PC用および共通設定 974px～
***************************************************/
li.last{
	margin-right:0 !important;
}
.clearfix:after {
    content: '';
    display: block;
    clear: both;
}
.clear{
	clear:both;
}


#container{
	text-align:center;
	background:url("/enjoy/sweets/images/bg_sweets.jpg") repeat !important;
	width:100%;
}

#wrp_container{
	width:974px;
	color:#4F0012;
	margin:0 auto;
	background-color:#FFF;
	padding:0 0 0 0px;
	background:url("/enjoy/sweets/images/recipe/bg_sweets.jpg") repeat #FFFFFF;

}
/*左コンテンツ*/
#cnt_left{
	width:245px;
	float:left;
	height:100%;
	padding:20px 0 0 0;
	text-align:center;
}

.menu_left_sweets ul li a:hover img{
	opacity:1;
	-ms-filter: "alpha(opacity=100)";

} 
.wrp_menu_left_sweets{
	border:2px solid #624F3C;
	background-color:#FFFDF5;
	width:230px;
	margin:20px auto;
	padding:2px;
}
.menu_left_sweets{
	border:2px solid #B49C77;
	background-color:#FFFDF5;
	width:220px;
	padding-bottom:20px;
	margin:2px auto;
}
.wrp_menu_left_neptune{
	border:2px solid #624F3C;
	background-color:#ff9208;
	width:230px;
	margin:20px auto;
	padding:2px;
}

/*SP用*/
#img_sweets_sp,#wrp_menu_sp{
	display:none;
}
.sp{
	display:none;
}

/*右コンテンツ*/
#cnt_right{
	width:729px;
	float:left;
	padding:30px 24px 60px 20px;
	text-align:left;
	background-color:#FFFFFF;
}
#cnt_right a{
	color:#FF0000;
}
#tl_season{
	float:left;
	width:162px;
}

#btn_print{
	text-align:right;
	margin:5px 5px 0 0;
	width:247px;
	float:right;}



/*右コンテンツ内*/
#cnt_main{
	margin-bottom:5%;
}

/*右コンテンツ内　左*/
#cnt_l{
	width:400px;
	float:left;
	position:relative;

}
/*料理写真*/
#img_main_cnt{
	margin:20px 0px 20px 0;

}
#img_main_cnt img{
	width:400px;
	border-radius: 10px;        
	-webkit-border-radius: 10px;/* Safari,Google Chrome用 */  
	-moz-border-radius: 10px;   /* Firefox用 */  
}
.icon_new{
	position:absolute;
	top:20px;
	left:10px;
	width:85px;
	}
.icon_new img{
	width:100%;
}

/*材料*/


/*右コンテンツ内　右*/
/*お酒CMS*/
#cnt_r{
	width:285px;
	float:left;
}


/*タイトル画像＋テキスト*/
.tl_text{
	width:100%;
	margin-bottom:5%;
}
.tl_text p{
	padding:0 2%;
}

.tl{
	margin-bottom:5%;
}

/*原材料*/

#material_l span{
	text-align:right;
}
#material_r{
	float:right;
	text-align:right;
	vertical-align:bottom;
}
#material_r span{
	vertical-align:bottom;
}

table{
	width:685px;
	margin-bottom:8%;
}
table tr{
	width:685px;
}
table tr td{
	width:140px;
	width:168px\9;/*IE8*/
	padding:8px 14px;
}
table tr td.mater{
	width:211px;
	width:239px\9; /*IE8*/

}
table tr.top td{
	padding-bottom:2px;
	padding-left:0;

}


table tr.top{
	vertical-align:bottom;
	margin-bottom:2%;
}
table tr.title td{
	font-size:120%;
}
table tr.title{
	border-bottom:1px solid #4F0012;
	border-top:1px solid #4F0012;

}
table tr.column{
	border-bottom:1px dashed #4F0012;
}
table tr td{

}
table tr.total td{
	background-color:#4F0012;
	color:#FFFFFF;
	font-size:120%;
}
table tr td.right{
	text-align:right;
}
table tr td.cente{
	text-align:center;
}
table tr.bottom{
	margin-top:3%;
	border-top:1px solid #4F0012;
}


/*製法*/
.howto{
	width:100%;
	margin-bottom:8%;
	padding:0 0 0 0;
	border-bottom:1px solid #4F0012;}
#bg_finishing .howto{
	margin-bottom:4%;
}
.no{
	border-bottom:none;}

.tl_howto{
	border-bottom:1px solid #4F0012;
	padding:0 0 2px 0;
	margin-bottom:3%;}

.cook{
	padding:0 2%;
	width:100%;
}
.howto .last .info_cook{
	border-bottom:1px dotted #4F0012;
	padding:3% 0 3%;}
.step img{

	width:100%;
}
.step{
	float:left;
	margin:1% 4% 1% 1%;
	width:8%;}
.sub_img_cook{
	width:150px;
	margin:0 10px 0 0;
	float:left;
}
.info_cook{
	text-align:left;
	float:left;
	width:87%;
	padding:3% 0 0 0;
	margin-bottom:3%;
	border-top:1px dotted #4F0012;}


/*仕上げ*/
#bg_finishing{
	background-color:#E7D7CA;
	width:100%;
	border-radius: 5px;        
	-webkit-border-radius: 5px;/* Safari,Google Chrome用 */  
	-moz-border-radius: 5px;   /* Firefox用 */  
	padding:2.5%;

}
#wrp_finishing{
	border:1px solid #4F0012;
	box-shadow: 0 0 3px 2px rgba(79, 0, 18, 0.2);
	background-color:#F0EAE8;
	padding:1%;
}
#cnt_finishing{
	border:1px solid #4F0012;
	text-align:center;
	
}
#cnt_finishing img{
	margin-bottom:3%;
}
.txt_finishing{
	width:90%;
	text-align:left;
	margin:0 auto;
	margin-bottom:3%;
}
.txt_finishing_r{
	font-size:95%;
	text-align:right;
	margin-bottom:3%;
	width:90%;

}

/*メモ*/
#memo{
	padding:15px 20px;
	margin-right:10px;
	border:1px solid #9FC238;
	border-radius: 10px;        
	-webkit-border-radius: 10px;/* Safari,Google Chrome用 */  
	-moz-border-radius: 10px;   /* Firefox用 */  }


/**
 * JSONから自動生成される「合わせるのはこのお酒」
 */
#productInfoListBox {
  margin: 0 auto 0 ;
  padding: 0;
  -webkit-border-radius: 10px;/* Safari,Google Chrome用 */
  -moz-border-radius: 10px;   /* Firefox用 */
  position: relative;
  overflow: hidden;
}

#productInfoListTitle_PC {
  margin: 3% auto 0 auto;
  padding: 0;
  position: relative;
  overflow: hidden;
  width: 257px;
  height: 50px;
  display: block;
}

#productInfoListTitle_TBSP {
  margin: 3% auto 0 auto;
  padding: 0;
  position: relative;
  overflow: hidden;
  width: 600px;
  height: 68px;
  display: none;
}

ul.productInfoList {
  margin: 0 0 0 0px;
  padding: 5px 0;
  position: relative;
  overflow: hidden;
}

ul.productInfoList li {
  border: none;
  margin: 0 auto;
  padding: 0 0 2% 0;
  position: relative;
  width: 100%;
  background: none;
}

ul.productInfoList li a img.productImg {
  margin: 0;
  padding: 0;
  width: 45%;
  float: left;
  border-bottom: none;
}

ul.productInfoList li span.company {
  display: block;
  text-align: left;
  margin: 0 auto;
  padding: 4% 0 0 40%;
  width: 100%;
  font-size: 1.0em;
/*  font-weight: bold; */
	color:#4F0012;
}

ul.productInfoList li span.name {
  display: block;
  text-align: left;
  margin: 0 auto;
  padding: 0 0 0 40%;
  width: 100%;
  font-size: 1.1em;
/*  font-weight: bold; */
	color:#4F0012;
}



/***************************************************
タブレット用 768px～973px
***************************************************/

@media only screen and (max-width: 973px){

#wrp_container{
	width:100%;
	background:#FFF;
	padding:0 0 0 0;
	background:url("/enjoy/sweets/images/recipe/bg_sweets.jpg") repeat #FFFFFF;
/*	background-size:contain;*/

}

/*左コンテンツ*/
#cnt_left{
	width:25%;
	float:left;
}
.wrp_menu_left_sweets{
	border:2px solid #624F3C;
	background-color:#FFFDF5;
	width:93%;
	margin:8% auto;
	padding:1%;
}
.menu_left_sweets{
	border:2px solid #B49C77;
	background-color:#FFFDF5;
	width:99%;
	padding-bottom:8%;
	margin:1% auto;
}
.wrp_menu_left_neptune{
	border:2px solid #624F3C;
	background-color:#ff9208;
	width:93%;
	margin:8% auto;
	padding:1%;
}

	
/*右コンテンツ*/
#cnt_right{
	width:75%;
	float:left;
	padding:3% 2% 6% 2%;
	text-align:left;
}
#btn_print{/*印刷ボタン*/
	display:none;}
.tl_recipe{
	margin:3% 0 3% 0;}

#cnt_l{
	width:100%;}

/*料理写真*/
#img_main_cnt{
	margin:0 10% 2% 10%;
}
#img_main_cnt img{
	width:100%;
	border-radius: 10px;        
	-webkit-border-radius: 10px;/* Safari,Google Chrome用 */  
	-moz-border-radius: 10px;   /* Firefox用 */  
}

.icon_new{
	position:absolute;
	top:0;
	left:12%;
	width:15%;

	}


/*原材料*/
table{
	width:98%;
	margin-bottom:4%;
}

table tr{
	width:100%;
}

table tr td{
	width:18%;
	padding:2% 2.5%;
}

table tr td.mater{
	width:29%;

}


/*メモ*/
#memo{
	padding:2% 3%;
	margin-right:1%;}



/**
 * JSONから自動生成される「合わせるのはこのお酒」
 */
#cnt_r{
  margin: 0;
  padding: 0;
	width: 100%;
	float:left;
}

#productInfoListBox {
  width: 100%;
}

#productInfoListTitle_PC {
  display: none;
}

#productInfoListTitle_TBSP {
  margin: 0 auto;
  width: 60%;
  height: 60%;
  display: block;
}

ul.productInfoList {
  margin: 0 auto;
}

ul.productInfoList li {
  width: 50%;
}

ul.productInfoList li a img.productImg {
}

ul.productInfoList li span.company {
  padding: 5% 0 0 35%;
}

ul.productInfoList li span.name {
  padding: 0 0 0 35%;
}

}
/***************************************************
スマートフォン用 ～767px
***************************************************/
@media only screen and (max-width: 767px){

#container{
	text-align:center;
	background:#FFFFFF !important;
	width:100%;
}
#wrp_container{
	width:100%;
	background:#FFF;
	padding:0 3% 5% 3%;

}
#cnt_right{
	width:100%;
	padding:0;
	text-align:left;}


#cnt_left{
	display:none;}
#wrp_menu_sp,#img_sweets_sp{
	display:block;}

.sp{
	display:block;}
.pc{
	display:none;}

/*お酒のメニュー*/
#menu_osake_sp{
	margin:5% 0 0 0;}


/*料理写真*/
#img_main_cnt{
	margin:0 0 2% 0;
}
#img_main_cnt img{
	width:100%;
	border-radius: 10px;        
	-webkit-border-radius: 10px;/* Safari,Google Chrome用 */  
	-moz-border-radius: 10px;   /* Firefox用 */  
}
.icon_new{
	position:absolute;
	top:0;
	left:5%;
	}
.icon_new{
	width:20%;
}
/*料理テキスト*/
#info_main_cnt{
	padding:0 0 2% 0;}


/*製法*/
.step{

	margin:3% 7% 3% 3%;
	width:15%;}
.info_cook{
	width:75%;
}
.howto .last .info_cook{
	padding:3% 0 10%;}
/*材料*/
table tr.title td,table tr.total td{
    font-size: 12px;
}
tr.column td {
    font-size: 11px;
}
tr.top,tr.bottom{
	font-size:10px;
}

/**
 * JSONから自動生成される「合わせるのはこのお酒」
 */
#cnt_r{
  margin: 0;
  padding: 0;
	width: 100%;
	float:left;
}

#productInfoListBox {
  margin: 0;
  padding: 0;
  width: 100%;
}

#productInfoListTitle_PC {
  display: none;
}

#productInfoListTitle_TBSP {
  margin: 0 auto;
  padding: 0;
  width: 100%;
  height: 100%;
  display: block;
}

ul.productInfoList {
  margin: 0 auto;
  width: 100%;
}

ul.productInfoList li {
  width: 100%;
}

ul.productInfoList li a img.productImg {
  width: 45%;
}

ul.productInfoList li span.company {
  padding: 12.5% 5% 0 45%;
  font-size: 1.2em;
}

ul.productInfoList li span.name {
  padding: 0 5% 0 45%;
  font-size: 1.4em;
}

}