@charset "utf-8";

/* ****************************************************************************

　目次

-------------------------------------------------------------------------------

　00. base
　01. 
　02. 


******************************************************************************* */



/* ==

　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.link dl{
	background-color:#f0f0e1;
	zoom:1;
	clear:both;
}
#main div.link dd{ margin-top:-3em; padding:9px 10px 9px 140px; font-size:117%; }
#main div.link dd a{
	padding-left:12px;
	background:url(/common/images/renew2009/arrow.gif) left 0.6em no-repeat;
	font-weight:bold;
	display:block;
}








/* メディアクエリー
------------------------------------------------------------------------------- */
@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; }
	#main div.link dd{ margin-top:-2.5em; padding:7px 10px 6px 140px; }

}









/* ==

　01. 

=============================================================================== */

div.btn_recipe{
	padding:15px 0;
	background-color:#fef8e9;
	text-align:center;
	zoom:1;
	clear:both;
}
div.btn_recipe p{ padding:0 15px; font-size:125%; line-height:1.8; display:inline; }


.ftr_menu div.btn_recipe{
	padding-bottom:0;
	border-top:1px dotted #ccc;
	background-color:transparent;
}


div.btn_recipe a{
	filter: alpha(opacity=100);
	-moz-opacity:1.0;
	opacity:1.0;
	display:inline-block;
	zoom:1;
}
div.btn_recipe a:hover{
	filter: alpha(opacity=70);
	-moz-opacity:0.7;
	opacity:0.7;
}
div.btn_recipe a img{ vertical-align:middle; }


#main .cont01{ margin:0 0 30px; zoom:1; clear:both; }



/* メディアクエリー
------------------------------------------------------------------------------- */
@media only screen and (max-width: 1205px) {
}
@media only screen and (max-width: 600px) {
	div.btn_recipe p{ margin:0 0 10px; line-height:1.3; display:block; }
}
@media only screen and (max-width: 400px) {
}







/* ==

　02. 

=============================================================================== */
.ftr_idea{
	margin:0 0 50px;
	padding-top:30px;
	border-top:1px dotted #ccc;
	zoom:1;
	clear:both;
}
.ftr_idea em{ font-weight:bold; }
.ftr_idea div h4{ margin:0 0 10px; }

.ftr_idea .col1{ width:46%; margin-right:4%; float:left; }
.ftr_idea .col2{ width:50%; float:left; }

#main .ftr_idea .col2 .colBlock01 .col1{ width:46%; margin-bottom:15px; /margin-right:3.75%; }
#main .ftr_idea .col2 .colBlock01 .col2{ width:50%; margin-bottom:15px; }


.ftr_idea p em{ color:#005fa6; }



/* メディアクエリー
------------------------------------------------------------------------------- */
@media only screen and (max-width: 1205px) {
}
@media only screen and (max-width: 730px) {
	.ftr_idea .col1{ width:auto; margin-bottom:20px; margin-right:0; float:none; }
	.ftr_idea .col2{ width:auto; float:none; }
	
	#main .ftr_idea .col2 .colBlock01 .col2 p img{ margin:20px 0; }
	#main .ftr_idea .col2 .colBlock01 .col1 p img{ width:auto; max-height:256px; }
	
	
}
@media only screen and (max-width: 640px) {

	#main .ftr_idea .col2 .colBlock01 .col1{ width:auto; margin-right:0; float:none; }
	#main .ftr_idea .col2 .colBlock01 .col2{ width:auto; float:none; }
	
	#main .ftr_idea .col2 .colBlock01 .col1,
	#main .ftr_idea .col2 .colBlock01 .col2{ padding-top:20px; border-top:1px dotted #eee; }

	#main .ftr_idea .col2 .colBlock01 .col2 p img{ margin:0; }
	#main .ftr_idea .col2 .colBlock01 .col1 p img{ max-height:initial; max-height:auto; }
}








/* ==

　03. 

=============================================================================== */
.ftr_menu{
	padding:18px;
	border:1px solid #999;
	zoom:1;
	position:relative;
	clear:both;
}

#main .ftr_menu h3{ margin:-19px 0 20px -19px; }


.ftr_menu p em{ color:#005fa6; }


#main .ftr_menu .colBlock01.menu01 .col1{ width:56%; margin:0 3% 20px 0; }
#main .ftr_menu .colBlock01.menu01 .col2{ width:41%; margin:-50px 0 20px; }

#main .ftr_menu .colBlock01.menu02 .col1{ width:75%; margin:0 2% 20px 0; }
#main .ftr_menu .colBlock01.menu02 .col2{ width:23%; margin:0 0 20px; }


#main .ftr_menu .colBlock01.menu01 .col1 p.img{ width:61%; margin-right:4%; float:left; }
#main .ftr_menu .colBlock01.menu01 .col1 p.txt{ width:35%; float:left; }

#main .ftr_menu .colBlock01.menu01 .col2 p.img{ width:54%; margin-right:4%; float:left; }
#main .ftr_menu .colBlock01.menu01 .col2 p.txt{ width:42%; float:left; }


#main .ftr_menu .colBlock01.menu02 .col1 p.img{ width:66%; margin-right:4%; float:left; }
#main .ftr_menu .colBlock01.menu02 .col1 p.txt{ width:30%; float:left; }

#main .ftr_menu .colBlock01.menu02 .col2 p.img{ margin-bottom:10px; }





/* メディアクエリー
------------------------------------------------------------------------------- */
@media only screen and (max-width: 1205px) {
}
@media only screen and (max-width: 730px) {

	#main .ftr_menu .colBlock01.menu01 .col1, #main .ftr_menu .colBlock01.menu01 .col2,
	#main .ftr_menu .colBlock01.menu02 .col1, #main .ftr_menu .colBlock01.menu02 .col2{ width:auto; margin:0 0 20px; float:none; }

	#main .ftr_menu .colBlock01.menu01 .col1 p.img, #main .ftr_menu .colBlock01.menu01 .col2 p.img,
	#main .ftr_menu .colBlock01.menu02 .col1 p.img, #main .ftr_menu .colBlock01.menu02 .col2 p.img{ width:50%; margin-right:4%; text-align:center; float:left; }
	#main .ftr_menu .colBlock01.menu01 .col1 p.txt, #main .ftr_menu .colBlock01.menu01 .col2 p.txt,
	#main .ftr_menu .colBlock01.menu02 .col1 p.txt, #main .ftr_menu .colBlock01.menu02 .col2 p.txt{ width:46%; float:left; }
	
	#main .ftr_menu .colBlock01.menu01 .col1,
	#main .ftr_menu .colBlock01.menu01 .col2,
	#main .ftr_menu .colBlock01.menu02 .col1{ padding-bottom:20px; border-bottom:1px dotted #eee; }

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

	#main .ftr_menu .colBlock01.menu01 .col1 p.img, #main .ftr_menu .colBlock01.menu01 .col2 p.img,
	#main .ftr_menu .colBlock01.menu02 .col1 p.img, #main .ftr_menu .colBlock01.menu02 .col2 p.img{ width:auto; margin-bottom:10px; margin-right:0; text-align:center; float:none; }
	#main .ftr_menu .colBlock01.menu01 .col1 p.txt, #main .ftr_menu .colBlock01.menu01 .col2 p.txt,
	#main .ftr_menu .colBlock01.menu02 .col1 p.txt, #main .ftr_menu .colBlock01.menu02 .col2 p.txt{ width:auto; float:none; }

}








/* ==

　04. 

=============================================================================== */
.ftr_expert{
	width:730px;
	margin:0 auto;
	padding-top:30px;
	text-align:center;
	zoom:1;
	position:relative;
	clear:both;
}

.ftr_expert div.colImg{
	width:42.5%;
	margin-right:7%;
	text-align:left;
	float:left;
}
.ftr_expert div.colTxt{
	width:50.5%;
	margin-top:75px;
	text-align:left;
	float:left;
}







/* メディアクエリー
------------------------------------------------------------------------------- */
@media only screen and (max-width: 1205px) {
}
@media only screen and (max-width: 840px) {
}
@media only screen and (max-width: 785px) {
	.ftr_expert{
		width:auto;
	}
}
@media only screen and (max-width: 640px) {
	.ftr_expert div.colImg{
		width:auto;
		margin:0 10px 15px 0;
		text-align:center;
		float:none;
	}
	.ftr_expert div.colTxt{
		width:auto;
		margin-top:0;
		float:none;
	}
}
@media only screen and (max-width: 600px) {
}









/* ==

　21. 

=============================================================================== */
.recipeBlock{
	margin:0 0 30px;
	padding-top:30px;
	border-top:1px dotted #ccc;
	zoom:1;
	clear:both;
}

#main .recipeBlock .colBlock01 .col1{ width:48%; margin-right:4%; float:left; }
#main .recipeBlock .colBlock01 .col2{ width:48%; float:left; }

#main .recipeBlock.recipe02 .colBlock01 .col1{ width:38%; }
#main .recipeBlock.recipe02 .colBlock01 .col2{ width:58%; }

#main .recipeBlock.recipe04 .colBlock01 .col1{ width:41%; }
#main .recipeBlock.recipe04 .colBlock01 .col2{ width:55%; /width:54%; }



#main .recipeBlock h3,
#main .recipeBlock.recipe01 h4{
	margin-bottom:0;
	padding-left:10px;
	background:url(../images/comfortableLife/recipe/ico_img01.gif) left 0.5em no-repeat;
	font-size:125%;
	color:#00529e;
	font-weight:bold;
}
#main .recipeBlock h3 span{
	font-size:90%;
	font-weight:normal;
	display:inline;
}


#main .recipeBlock.recipe01 h3{
	min-height:30px;
	margin-bottom:10px;
	padding-left:40px;
	background:url(../images/comfortableLife/recipe/ico_img02.gif) left top no-repeat;
	font-size:150%;
}
#main .recipeBlock.recipe01 h4 span{
	font-size:90%;
	font-weight:normal;
	display:inline;
}


#main .recipeBlock.recipe03 .txt_caption{
	width:720px;
	margin:0 auto 20px;
	font-size:100%;
	text-align:right;
}


#main .recipeBlock p.note{
	margin-left:1em;
	text-indent:-1em;
}


#main .recipeBlock dt{ font-size:117%; }

#main .recipeBlock div ul li{
	margin:0;
	font-size:117%;
}
#main .recipeBlock div ol li{
	margin:0 0 0.75em 1.5em;
	text-indent:-1.5em;
	font-size:117%;
}



#main .txtLink{
	margin:30px 0 0;
	padding:30px 0 0;
	border-top:1px dotted #ccc;
	text-align:center;
	zoom:1;
	clear:both;
}
#main .txtLink p a{
	padding-left:28px;
	background:url(../images/comfortableLife/recipe/ico_arw01.gif) left 0.25em no-repeat;
	font-size:117%;
	font-weight:bold;
	display:inline-block;
	zoom:1;
}






/* メディアクエリー
------------------------------------------------------------------------------- */
@media only screen and (max-width: 1205px) {
}
@media only screen and (max-width: 800px) {
	#main .recipeBlock.recipe03 .txt_caption{ width:auto; }
}
@media only screen and (max-width: 680px) {
	#main .recipeBlock.recipe01 .colBlock01 .col1{ width:auto; margin:0 0 20px; padding-bottom:20px; border-bottom:1px dotted #ccdcec; float:none; }
	#main .recipeBlock.recipe01 .colBlock01 .col2{ width:auto; float:none; }

	#main .recipeBlock.recipe03 .colBlock01 .col1{ width:auto; margin:0 0 20px; float:none; }
	#main .recipeBlock.recipe03 .colBlock01 .col2{ width:auto; float:none; }
}
@media only screen and (max-width: 600px) {
	#main .recipeBlock.recipe02 .colBlock01 .col1{ width:70%; margin:0 auto 15px; text-align:center; float:none; }
	#main .recipeBlock.recipe02 .colBlock01 .col2{ width:auto; float:none; }

	#main .recipeBlock.recipe04 .colBlock01 .col1{ width:70%; margin:0 auto 15px; text-align:center; float:none; }
	#main .recipeBlock.recipe04 .colBlock01 .col2{ width:auto; float:none; }
}







/* ==

　22. 

=============================================================================== */
.drinkBlock{
	padding:10px;
	background:url(../images/comfortableLife/recipe/bg_drink.gif);
	position:relative;
	zoom:1;
	clear:both;
}
.drinkBlock div{
	padding:20px;
	background-color:#fff;
	zoom:1;
	clear:both;
}
.drinkBlock div div{
	padding:0;
	background-image:none;
	background-color:transparent;
}


.drinkBlock div.ribbon{
	width:24px;
	height:69px;
	background:url(../images/comfortableLife/recipe/ico_drink_img01.png) left top no-repeat;
	position:absolute;
	top:0;
	left:30px;
}

#main .drinkBlock h2{ padding:5px 0 15px 35px; }
#main .drinkBlock h3{
	padding:10px 0 5px 40px;
	background:url(../images/comfortableLife/recipe/ico_drink_img02.gif) left 0.5em no-repeat;
	font-size:150%;
	line-height:1.8;
	color:#00529e;
}
#main .drinkBlock h4{
	margin-bottom:0;
	padding-left:10px;
	background:url(../images/comfortableLife/recipe/ico_img01.gif) left 0.5em no-repeat;
	font-size:125%;
	color:#00529e;
	font-weight:bold;
}


.drinkBlock div .colTxt{
	width:67.5%;
	margin-right:4%;
	/margin-right:3.5%;
	float:left;
	clear:none;
}
.drinkBlock div .colImg{
	width:28.5%;
	float:left;
	clear:none;
}


.drinkBlock div .colTxt ol li{
	margin:0 0 0.75em 1.5em;
	text-indent:-1.5em;
	font-size:117%;
}




.drinkBlock .drink01{
	margin-bottom:30px;
	padding-bottom:30px;
	border-bottom:1px dotted #7fa8ce;
}










/* メディアクエリー
------------------------------------------------------------------------------- */
@media only screen and (max-width: 1205px) {
}
@media only screen and (max-width: 840px) {
}
@media only screen and (max-width: 600px) {
	.drinkBlock div .colTxt{
		width:auto;
		margin-right:0;
		margin-bottom:15px;
		float:none;
		clear:both;
	}
	.drinkBlock div .colImg{
		width:auto;
		text-align:center;
		float:none;
		clear:both;
	}

}