@charset "utf-8";

/* ****************************************************************************

　目次

-------------------------------------------------------------------------------

　00. base
　01. 
　02. ビールにぴったりなメニュー
　03. 子どもたちも楽しめるアイデアを
　04. ホームパーティーが楽しめるキッチン

******************************************************************************* */



/* ==

　00. base

=============================================================================== */
#main div:after{ content:''; display:block; clear:both; }

#main h2{ margin-bottom:10px; }
#main h3{ margin-bottom:10px; }

p em{ font-weight:bold; }
#main p.leadTxt{ padding:45px 0 50px; text-align:center; }
#main p.leadTxt.mobile{ padding:15px 0 30px; font-weight:bold; }


#main p.hdTxt{ margin-bottom:10px; }

#main div.note{ padding-top:15px; border-top:1px dotted #ccc; clear:both; }





/* メディアクエリー
------------------------------------------------------------------------------- */
@media only screen and (max-width: 1205px) {
}
@media only screen and (max-width: 600px) {
	#main p.leadTxt.mobile{ padding:20px 0 40px; text-align:left; }
}





/* ==

　01. 

=============================================================================== */
.cont01{ padding-bottom:80px; zoom:1; clear:both; }
.cont01 .mainimg{
	padding-bottom:50px;
	zoom:1;
	clear:both;
}

.cont01 .colW{ width:52%; float:left; }
.cont01 .colN{ width:44%; float:right; }

.cont01 .colN div{ width:48%; float:left; }
.cont01 .colN p{ width:48%; float:right; }
.cont01 .colN p em{ font-size:124%; color:#ec6a00; }


.ftr_expert{
	padding: 50px 0 0;
	background:url(../images/comfortableLife/img_line01.jpg) center top no-repeat;
	text-align:center;
}
.ftr_expert .wrap{
	display:inline-block;
	/display:inline;
	zoom:1;
}
.ftr_expert .wrap div{
	width:225px;
	text-align:left;
	display:table-cell;
	vertical-align: middle;
}
.ftr_expert .wrap p{
	width:245px;
	text-align:left;
	display:table-cell;
	vertical-align: middle;
}
.ftr_expert .wrap p em{ font-size:124%; color:#333; }



/* メディアクエリー
------------------------------------------------------------------------------- */
@media only screen and (max-width: 1205px) {
}
@media only screen and (max-width: 820px) {

	.cont01 .colW{ width:62%; }
	.cont01 .colN{ width:34%; }

	.cont01 .colN div{ width:auto; margin-bottom:10px; text-align:center; float:none; }
	.cont01 .colN p{ width:auto; float:none; }

}
@media only screen and (max-width: 600px) {
}
@media only screen and (max-width: 530px) {

	.cont01 .colW{ width:auto; margin-bottom:20px; float:none; }
	.cont01 .colN{ width:auto; float:none; }

	.ftr_expert .wrap div{
		width:auto;
		margin-bottom:15px;
		text-align:center;
		display:block;
	}
	.ftr_expert .wrap p{
		width:auto;
		padding:0 20px;
		text-align:left;
		display:block;
	}



}






/* ==

　02. ビールにぴったりなメニュー

=============================================================================== */
.ftr_menu{
	margin-bottom:40px;
	padding:7px 0 0;
	background:url(../images/comfortableLife/bg01.gif) left top no-repeat;
	zoom:1;
	clear:both;
}
.ftr_menu .tit{
	margin-bottom:35px;
	padding:20px 0 0 30px;
	background:url(../images/comfortableLife/bg02.gif) left top repeat-y;
}

.ftr_menu .col1{
	width:65%;
	float:left;
}
.ftr_menu .col2{
	width:32%;
	float:right;
}

.ftr_menu .col1 .menu01{ width:48%; float:left; }
.ftr_menu .col1 .menu02{ width:48%; float:right; }


#main .ftr_menu h3{
	font-size:20px;
	line-height:1.4;
	color:#ec6a00;
}
.ftr_menu h3 span{ font-size:14px; font-weight:normal; color:#333; font-weight:normal; }


.ftr_menu dt{
	padding-left:16px;
	background: url(../images/comfortableLife/ico_img01.gif) left 0.4em no-repeat;
	font-size:117%;
	color:#ec6a00;
}
#main .ftr_menu dd{ font-size:117%; }
#main .ftr_menu dd em{ font-weight:bold; }
.ftr_menu dd li{ margin-bottom:20px; }
.ftr_menu .menu03 dd li, .ftr_menu dd.howto li{ margin-bottom:0; }

.ftr_menu .col1 .menu02 dd, .ftr_menu .menu03 dd{ margin-bottom:20px; }


.selfcorner{
	margin-bottom:50px;
	padding:10px;
	background-color:#fff7f0;
	zoom:1;
	clear: both;
}
.selfcorner div{ width:32%; float:left; }
.selfcorner p{ width:64%; padding:2%; line-height:1.8; float:right; }
.selfcorner p em{ font-size:117%; font-weight:bold; }


/* メディアクエリー
------------------------------------------------------------------------------- */
@media only screen and (max-width: 1205px) {
}
@media only screen and (max-width: 820px) {

	.ftr_menu .col1{ width:auto; float:none; }
	.ftr_menu .col2{ width:auto; float:none; }

	.ftr_menu .col1 .menu01{ width:auto; margin-bottom:30px; padding-bottom:30px; border-bottom:1px dotted #ccc; float:none; }
	.ftr_menu .col1 .menu02{ width:auto; margin-bottom:30px; padding-bottom:10px; border-bottom:1px dotted #ccc; float:none; }
	.ftr_menu .col2 .menu03{ margin-bottom:30px; padding-bottom:30px; border-bottom:1px dotted #ccc; }

	.ftr_menu div .menu01 div.mb20.mobile{ display:block; text-align:center; }
	.ftr_menu div .menu01 h3{ text-align:center; }
	.ftr_menu div .menu01 div.mb20.tablet-desktop{ display:none; }

	.ftr_menu div .menu02 div.mb20{ text-align:center; }
	.ftr_menu div .menu02 h3{ text-align:center; }

	.ftr_menu div .menu03 div.mb20{ text-align:center; }
	.ftr_menu div .menu03 h3{ text-align:center; }

	.ftr_menu div .menu03 .subImg{ max-width:254px; margin:0 auto; }

	.selfcorner div{ width:42%; }
	.selfcorner p{ width:54%; }

}
@media only screen and (max-width: 620px) {

	.selfcorner div{ width:48%; }
	.selfcorner p{ width:44%; padding:2% 4%; line-height:1.4; }

}
@media only screen and (max-width: 530px) {

	.selfcorner div{ width:auto; text-align:center; float:none; }
	.selfcorner p{ width:auto; padding:2% 0; float:none; }

}






/* ==

　03. 子どもたちも楽しめるアイデアを

=============================================================================== */
.ftr_kids{
	margin-bottom:40px;
	padding:7px 0 0;
	background:url(../images/comfortableLife/bg01.gif) left top no-repeat;
	zoom:1;
	clear:both;
}
.ftr_kids .tit{
	margin-bottom:35px;
	padding:20px 0 0 30px;
	background:url(../images/comfortableLife/bg02.gif) left top repeat-y;
}

.ftr_kids .colN{ width:32%; float:left; }
.ftr_kids .colW{ width:66%; float:right; }

.ftr_kids .colW .col1{ width:48%; padding-top:5px; text-align:center; float:left; }
.ftr_kids .colW .col2{ width:48%; float:right; }

.ftr_kids dt{
	padding-left:16px;
	background: url(../images/comfortableLife/ico_img01.gif) left 0.4em no-repeat;
	font-size:117%;
	color:#ec6a00;
}
#main .ftr_kids dd{ margin-bottom:20px; font-size:117%; }



/* メディアクエリー
------------------------------------------------------------------------------- */
@media only screen and (max-width: 1205px) {
}
@media only screen and (max-width: 820px) {

	.ftr_kids .colN{ width:48%; }
	.ftr_kids .colW{ width:48%; }

	.ftr_kids .colN div.mb15{ padding:15px 0; text-align:center; }

	.ftr_kids .colW .col1{ width:auto; margin-bottom:10px; float:none; }
	.ftr_kids .colW .col2{ width:auto; float:none; }


}
@media only screen and (max-width: 600px) {
}
@media only screen and (max-width: 530px) {

	.ftr_kids .colN{ width:auto; margin-bottom:30px; padding-bottom:30px; border-bottom:1px dotted #ccc; float:none; }
	.ftr_kids .colW{ width:auto; float:none; }
	.ftr_kids .colN div.mb15{ padding:0; }

}




/* ==

　04. ホームパーティーが楽しめるキッチン

=============================================================================== */
.ftr_homeparty{
	margin-bottom:60px;
	padding:7px 0 0;
	background:url(../images/comfortableLife/bg05.png) left top no-repeat;
	zoom:1;
	clear:both;
}
#main .ftr_homeparty h2{ margin-bottom:20px; }


.ftr_homeparty .fnTileTarget{
	padding:0;
	background:url(../images/comfortableLife/bg04.gif) right top repeat-y;
	zoom:1;
	clear:both;
}
.ftr_homeparty .col1{
	width:25.5%;
	padding:3% 0 3% 3%;
	float:left;
}
.ftr_homeparty .col2{
	width:39%;
	padding:3% 3% 3% 3.5%;
	float:left;
}
.ftr_homeparty .col3{
	width:23%;
	padding:3% 3% 3% 0;
	float:right;
}
.ftr_homeparty .bnr{
	padding:17px 22px 27px;
	background:url(../images/comfortableLife/bg03.gif) left bottom no-repeat;
	text-align:center;
	clear:both;
}


.ftr_homeparty .bnr a{
	filter: alpha(opacity=100);
	-moz-opacity:1.0;
	opacity:1.0;
	display:block;
}
.ftr_homeparty .bnr a:hover{
	filter: alpha(opacity=70);
	-moz-opacity:0.7;
	opacity:0.7;
}





/*
.ftr_homeparty{
	margin-bottom:60px;
	padding:7px 0 0;
	background:url(../images/comfortableLife/bg03.gif) left top no-repeat;
	zoom:1;
	clear:both;
}

.ftr_homeparty .col1{
	width:25.5%;
	padding:3% 0 3% 3%;
	background: url(../images/comfortableLife/bg04.gif) left top repeat-y;
	float:left;
}
.ftr_homeparty .col2{
	width:39%;
	padding:3% 3.5%;
	float:left;
}
.ftr_homeparty .col3{
	width:22.5%;
	padding:3% 3% 3% 0;
	background: url(../images/comfortableLife/bg04.gif) right top repeat-y;
	float:right;
}
*/



/* メディアクエリー
------------------------------------------------------------------------------- */
@media only screen and (max-width: 1205px) {
}
@media only screen and (max-width: 820px) {

	.ftr_homeparty .fnTileTarget{
		padding:3% 3% 0;
	}
	.ftr_homeparty .col1{
		width:auto;
		height:auto !important;
		padding:0 0 3%;
		float:none;
	}
	.ftr_homeparty .col2{
		width:60%;
		height:auto !important;
		padding:0 0 3%;
	}
	.ftr_homeparty .col3{
		width:34%;
		height:auto !important;
		padding:0 0 3%;
	}
	.ftr_homeparty .bnr{ margin:0 -3%; }


}
@media only screen and (max-width: 600px) {

	.ftr_homeparty .fnTileTarget{
		padding:22px 17px 0;
	}
	.ftr_homeparty .col1{ padding:0 0 20px; }
	.ftr_homeparty .col2{
		width:auto;
		padding:0 0 20px;
		float:none;
	}
	.ftr_homeparty .col3{
		width:auto;
		padding:0 0 20px;
		float:none;
	}

	.ftr_homeparty .col2 div, .ftr_homeparty .col3 div{ text-align:center; }
	.ftr_homeparty .bnr{ margin:0 -17px; }

}


