@charset "UTF-8";

/* === Base Layout setting File === */

/* -------------------------------------------------- body */
body {
}

div#platform {
	background:#fff url(/common/images/2010/body_bg.gif) repeat-x left top;
	text-align:center;
}

ul#skipNavi {
/*	display: none;*/
position:relative;
}
ul#skipNavi li {
position:absolute;
top:0px;
left:0px;
}


/* -------------------------------------------------- header Area */
div#header {
	min-height: 43px;
	margin:auto;
	width:950px;
}

* html div#header {
	height: 43px;
}

/* -------------------------------------------------- globalNavi Area */
div#globalNavi {
	background: url(/common/images/2010/gnavi_bg.gif) repeat-x left top;
}

/* -------------------------------------------------- breadcrumbs Area */
p.breadcrumbs{
	margin:6px 0 0 10px;
	text-align:left;
}
p.breadcrumbs img{
	vertical-align:top;
}
p.breadcrumbs em{
	font-weight:bold;
	color:#333;
}
p.breadcrumbs a,
p.breadcrumbs a:link{
	color:#333;
}
p.breadcrumbs a:visited{
	color:#333;
}

/* -------------------------------------------------- subNavi Area */
div#subNavi {
	min-height: 22px;
	display:none;
}

* html div#subNavi {
	height: 22px;
}

/* -------------------------------------------------- Contents Area */
div#contentsArea {
	width:950px;
	margin:auto;
	text-align:center;
}

/* -------------------------------------------------- mainWrapper */
div.mainWrapper {
	width:750px;
	margin:auto;
	float:left;
}
body.mainWide div.mainWrapper {
	width:950px;
	margin:auto;
	float:left;
}

/* -------------------------------------------------- mainContents Area */
div#mainContents {
	float: right;
	width: 540px;
	text-align:left;
	padding-top:10px;
}
* html div#mainContents{margin-top:10px !important;}
*:first-child+html div#mainContents{margin-top:10px;}

body.mainWide div#mainContents {
	float: right;
	width: 740px;
}
body.wide div#mainContents {
	float: none;
	width: 950px;
}

body.mR200 div#mainContents {
	float: right;
	width: 540px;
	text-align:left;
	padding-top:10px;
	margin-right:200px;
	display:inline;
}


div.noFloat {
	float: none !important;
}
div.leftFloat {
	float: left !important;
}
div.rightFloat {
	float: right !important;
}


div#platform.typeS div#mainContents {
	width: 740px;
	margin: auto;
}
body.wide div#platform.typeS  div#mainContents {
	float: none;
	width: 950px;
}
body.wide  div.mainContents {
	width: 730px;
	margin:0 0 0 110px;
}

/* -------------------------------------------------- localnavi Area */
div#localNavi {
	float: left;
	width: 200px;
	text-align:left;
}


/* 2010 renew */
/* -------------------------------------------------- rightContents Area */
div.rightContents {
	float: right;
	width: 190px;
	margin-top:30px;
	text-align:center;
}
div.rightContents div.relateLink,
div.rightContents div.borderBox{
	margin-bottom:20px;
}
div.rightContents div.relateLink h3,
div.rightContents div.newProducts h3,
div.rightContents div.weekRecipe h3{
	text-align:left;
}
div.rightContents div.relateLink ul li{
	margin-bottom:20px;
}
div.rightContents div.newProducts ul li,
div.rightContents div.weekRecipe ul li,
div.rightContents div.tvcm ul li,
div.rightContents div.imageL ul li{
	border-bottom:1px solid #CCC;
	margin-bottom:10px;
	padding-bottom:10px;
}
div.rightContents ul li.last{
	border-bottom:none !important;
	margin-bottom:0 !important;
}

/*----------------------
　＊メモ
　　以下スタイルは本来は

　div.rightContents div.newProducts ul li span.itemImg,
  div.rightContents div.weekRecipe ul li span.itemImg{
	display:block;
	width:116px;
	border:1px solid #CCC;
	text-align:center;
	margin:0 auto 3px;
}
　　でした。
----------------------*/
div.rightContents div.newProducts ul li span.itemImg{
	display:block;
	width:116px;
	border:1px solid #CCC;
	text-align:center;
	margin:0 auto 3px;
}

/*----------------------
　TVCM　weekrecipe用
　ここから
----------------------*/

div.rightContents div.weekRecipe ul li span.itemImg{
	display:block;
	width:160px;
	border:1px solid #CCC;
	text-align:center;
	margin:0 auto 3px;
}

/*----------------------
　TVCM　weekrecipe用
　ここまで
----------------------*/

div.rightContents div.tvcm ul li span.itemImg{
	display:block;
	width:160px;
	border:1px solid #CCC;
	text-align:center;
	margin:0 auto 3px;
}
div.rightContents div.imageL ul li{
	clear:none;
	display:inline-block;
	width:168px;
}
div.rightContents div.imageL ul li span.itemImg{
	display:block;
	width:53px;
	border:1px solid #CCC;
	float:left;

	height:46px;
	text-align:center;
	line-height:42px;
}
div.rightContents div.imageL ul li span.itemImg a{
	display:block;
}
div.rightContents div.imageL ul li span.itemImg img{
	max-width:53px;
	max-height:44px;
}
div.rightContents div.newProducts ul li span.itemImg img{
	padding:0 5px;
	border-top:5px solid #FFF;
	border-bottom:5px solid #FFF;
}
/*▽2015.4.13追記----------------------------*/

div.rightContents div.imageL dl{
	clear:none;
	display:inline-block;
	width:168px;
	border-bottom:1px solid #CCC;
	margin-bottom:10px;
	padding-bottom:10px;
}
div.rightContents div.imageL dt{
	display:block;
	width:53px;
	border:1px solid #CCC;
	float:left;

	/*height:44px;*/
	text-align:center;
	line-height:42px;
}
div.rightContents div.imageL dt span.itemImg{
	zoom: 1;
}
div.rightContents div.imageL dt span.itemImg a{
	display:block;
	zoom: 1;
}
div.rightContents div.imageL dt span.itemImg img{
	max-width:53px;
	max-height:44px;
}
div.rightContents .imageL dd span.linkMark{
	background:url(/common/images/2010/marker-arrow.gif) no-repeat 5px 0.2em;
	padding-left:16px;
	display:block;
	text-align:left;
	margin-left:58px;
}

/*△2015.4.13追記----------------------------*/
div.rightContents div.weekRecipe ul li span.itemImg img{
}
div.rightContents ul li span.linkMark{
	background:url(/common/images/2010/marker-arrow.gif) no-repeat 5px 0.2em;
	padding-left:16px;
	display:block;
	text-align:left;
}

div.rightContents ul li span.external{
	background:none;
	padding-left:0;
}
	*html div.rightContents ul li span.external img{
		vertical-align:-0.1em;
	}
	*:first-child+html div.rightContents ul li span.external img{
		vertical-align:-0.1em;
	}



div.rightContents .imageL ul li span.linkMark{
	background:url(/common/images/2010/marker-arrow.gif) no-repeat 5px 0.2em;
	padding-left:16px;
	display:block;
	text-align:left;
	margin-left:58px;
}
div.rightContents div.newProducts p.list{
	text-align:right;
}
div.rightContents div.weekRecipe p.list{
	text-align:left;
}

div.rightContents div.newProducts p.list a{
	background:url(/common/images/2010/marker-arrow.gif) no-repeat left 0.15em;
	padding-left:10px;
}
div.rightContents div.weekRecipe p.list{
	background:url(/common/images/2010/marker-arrow.gif) no-repeat left 0.15em;
	padding-left:10px;
	text-indent:-10px;
}
div.rightContents div.weekRecipe p.list a{
	padding-left:10px;
}


div.rightContents div.campaign ul{
	border-bottom:1px solid #CCC;
	margin-bottom:10px;
}
div.rightContents div.campaign p.list{
	text-align:right;
}
div.rightContents div.campaign p.list a{
	background:url(/common/images/2010/marker-arrow.gif) no-repeat left 0.15em;
	padding-left:10px;
}

/* left column(same contents) */

div#localNavi div.borderBox {
	border:1px solid #CCC;
	background:#F5F5F5;
}

div#localNavi div.weekRecipe {
	width: 190px;
	text-align:center;
	margin:20px auto;
}
div#localNavi div.weekRecipe h3{
	text-align:left;
	padding-top:10px;
}
div#localNavi div.weekRecipe ul,
div#localNavi div.weekRecipe p,
div#localNavi div.weekRecipe h3{
	margin:0 10px 10px 10px;
}
div#localNavi div.weekRecipe ul{
	margin:0 10px 0 10px;
}
div#localNavi div.weekRecipe ul li{
	border-bottom:1px solid #CCC;
	margin-bottom:10px;
	padding-bottom:10px;
}
div#localNavi div.weekRecipe ul li span.itemImg{
	display:block;
	width:116px;
	border:1px solid #CCC;
	text-align:center;
	margin:0 auto 3px;
}
div#localNavi ul li span.linkMark{
	background:url(/common/images/2010/marker-arrow.gif) no-repeat 5px 0.2em;
	padding-left:16px;
	display:block;
	text-align:left;
}
div#localNavi div.weekRecipe p.list{
	text-align:left;
}
div#localNavi div.weekRecipe p.list{
	background:url(/common/images/2010/marker-arrow.gif) no-repeat left 0.15em;
	padding-left:10px;
	text-indent:-10px;
}
div#localNavi div.weekRecipe p.list a{
	padding-left:10px;
}

/* -------------------------------------------------- pageTop Area */
div#pageTop {
	clear: both;
}

/* -------------------------------------------------- footer Area */
div#footer {
	min-height: 30px;
	clear: both;
}

* html div#footer {
	height: 30px;
}

/* -------------------------------------------------- column */
div.locator { clear: both; }

div.column3A,
div.column3B,
div.column4A,
div.column4B,
div.column4C,
div.column5,
div.column1A,
div.minorColumnA,
div.minorColumnB,
div.minorColumnC,
div.minorColumnD,
div.minorColumnE,
div.minorColumnF,
div.columnTVCM,
div.column260,
div.column480 { float: left; }

div.column3A { width: 180px; }
div.column3B { width: 360px; }
div.column4A { width: 135px; }
div.column4B { width: 270px; }
div.column4C { width: 405px; }
div.column1A { width: 680px; }

body.wide div.column5 { width: 190px; }


body.mainWide div.column4A { width: 185px; }
body.mainWide div#mainContents div.column4A h2 { margin:0 5px 10px; }

div.boxedItem div.column3A { width: 33.3%; }
div.boxedItem div.column3B { width: 66.6%; }
div.boxedItem div.column4A { width: 24.9%; }
div.boxedItem div.column4B { width: 49.9%; }
div.boxedItem div.column4C { width: 74.9%; }

div#platform.typeS div.column3A { width: 246px; }
div#platform.typeS div.column3B { width: 494px; }
div#platform.typeS div.column4A { width: 185px; }
div#platform.typeS div.column4B { width: 370px; }
div#platform.typeS div.column4C { width: 555px; }

div#platform.typeS div.boxedItem div.column3A { width: 33.3%; }
div#platform.typeS div.boxedItem div.column3B { width: 66.6%; }
div#platform.typeS div.boxedItem div.column4A { width: 24.9%; }
div#platform.typeS div.boxedItem div.column4B { width: 49.9%; }
div#platform.typeS div.boxedItem div.column4C { width: 74.9%; }

div.minorColumnA { width: 49.9%; }
div.minorColumnB { width: 29.9%; }
div.minorColumnC { width: 69.9%; }
div.minorColumnD { width: 39.9%; }
div.minorColumnE { width: 59.9%; }
div.minorColumnF { width: 33.3%; }

div.column260 { width: 260px; }
div.column480 { width: 480px; }


/* nonMgn */
div.minorColumnA p.nonMgn{
	margin:0 !important;
}
.nonMgn{margin:0 !important;}
.mLR{margin-left:auto !important;margin-right:auto !important;float:none !important;}
.mL15{margin:0 0 10px 15px !important;}
.mL10{margin:0 0 10px 10px !important;}
.mR10{margin:0 10px 10px 0 !important;}
.mB20{margin:0 10px 20px 10px !important;}
.mB30{margin:0 10px 30px 10px !important;}
.mB10{margin:0 10px 10px 0 !important;}
.pB0{padding-bottom:0 !important;}
.pT0{padding-top:0 !important;}
.mB0{margin-bottom:0 !important;}

.txtAR{ text-align:right; }

div#platform.typeS div.columnTVCM {
	width: 266px;
	padding-left: 52px;
	padding-right: 52px;
}
* html div#platform.typeS div.columnTVCM {
	width: 370px;
}

/* -------------------------------------------------- margin */
div#mainContents h1 {
	margin: 20px 0;
}

div#mainContents h2,
div#mainContents h3,
div#mainContents h4 {
	margin: 20px 10px 10px;
}
div.rightContents h2{
	margin: 20px 0 10px;
}

div.rightContents h3{
	margin: 0 0 10px;
}


/* 見出しの前にロケータがある場合 */
div#mainContents div.locator h2:first-child,
div#mainContents div.locator h3:first-child,
div#mainContents div.locator h4:first-child,
div#mainContents div.locator + h2,
div#mainContents div.locator + h3,
div#mainContents div.locator + h4 {
	margin-top: 10px;
}

/* 見出し要素の後ろにカラムがある場合 */
div#mainContents h1 + div.locator h2:first-child,
div#mainContents h2 + div.locator h3:first-child {
	margin-top: 0;
}

/* 見出しが連続する場合 */
div#mainContents h2 + h3,
div#mainContents h3 + h4 {
	margin-top: 0;
}

/* 見出しと詳細リンクの組み合わせ */
div#mainContents hr + p.learnMore {
	margin-top: 0;
}

/* jQuery */
* html div#mainContents h2.siblingA,
* html div#mainContents h3.siblingA,
* html div#mainContents h3.firstChild,
* html div#mainContents h4.firstChild {
	margin-top: 10px;
}

* html div#mainContents h2.siblingB,
* html div#mainContents h3.siblingB,
* html div#mainContents h4.siblingB,
* html div#mainContents p.siblingB {
	margin-top: 0;
}
/* jQuery */

div#mainContents p,
div#mainContents ul,
div#mainContents ol,
div#mainContents dl,
div#mainContents table,
div#mainContents hr {
	margin: 0 10px 10px 10px;
}
div.rightContents p,
div.rightContents ul,
div.rightContents ol,
div.rightContents dl,
div.rightContents table,
div.rightContents hr {
	margin: 0 10px 10px 10px;
}

div#mainContents dl dd p,
div#mainContents dl dd ul {
	margin-left: 0;
}

/* for print */
p#closeBtn {
	cursor: pointer;
	color: #0066CC;
	text-align: center;
}

/* -------------------------------------------------- clearfixes */
div#globalNavi ul:after,
div#subNavi ul:after,
div#locator:after,
div#footer:after {
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
	content: ".";
	font-size: 0;
	line-height: 0;
}

div#globalNavi ul,
div#subNavi ul,
div#locator,
div#footer {
	display: inline-table;
	min-height: 1%;
}

/* for macIE \*/
* html div#globalNavi ul,
* html div#subNavi ul,
* html div#locator,
* html div#footer {
	height: 1%;
}

div#globalNavi ul,
div#subNavi ul,
div#locator,
div#footer {
	display: block;
}
/* end of for macIE */


/* -------------------------------------------------- anquate form */

iframe {
	width:100%;
	height:410px;
	border:1px solid #999999;
	margin:0 0 15px 0;
	padding:0px;
	overflow:auto;
}

.btnArea{
	display:block;
	text-align:right;
	margin:10px 10px 0 0;
}

.btnArea a{
	margin-bottom:0px;
	padding-bottom:0px;
	line-height:1em;
}


.enqueteBtn p{
	width:303px;
	background:#F3F3F3;
	float:right;
	text-align:left;
	padding:8px 10px 6px !important;
	margin:20px 0 10px !important;
}
*html .btnArea p{
	width:323px;
}

.btnArea input.btn01,
.btnArea input.btn02{
	width: 303px;
	height: 25px;
	border:0px;
	line-height:1;
	cursor:pointer;
	margin-bottom:5px;
}

.btnArea input.btn01{ background:url(/common/images/btn-web-question.gif) no-repeat center; }
.btnArea input.btn02{ background:url(/common/images/btn-web-question2.gif) no-repeat center; }

.btnArea input.btn01:hover{ background:url(/common/images/btn-web-question_on.gif) no-repeat center; }
.btnArea input.btn02:hover{ background:url(/common/images/btn-web-question2_on.gif) no-repeat center; }

.btnArea span.btn01,
.btnArea span.btn02{
	font-size:85%;
	margin-top:5px;
}
.btnArea:after{
	clear: both;
	height: 0;
	visibility: hidden;
	font-size: 0;
	line-height: 0;
	display: block;
	content: ".";
}
.btnArea { clear:both; display: inline-block; }
.btnArea { clear:both; display: block; }
/* EOF */


/*----------------------------------------------
オンラインショップ　リニューアル
　右カラムをなくしたのでオンラインショップの
　CSSは全て以下に格納します
----------------------------------------------*/

div#platform.typeS div#mainContentsOL{
	width:950px;
	margin:auto;
}

div#contentsLeft{
	width:300px;
	float:left;
	margin: 0px 15px 0px 10px;
	border:#cacaca solid 1px;
	display:inline;
	overflow: hidden;
	padding-bottom:20px;
	height: auto !important;
}

div#contentsLeft ul#leftBt{
	clear:both;
	margin-top:16px;
	margin-left:16px;
	margin-bottom:10px;
}

div#contentsLeft ul#leftBt li{
	list-style:none;
	margin-right:5px;
	display:inline;
}

dl.main{
	margin:0px 16px 0px 16px;
}

dl.main dt{
	margin-bottom:17px;
}

div.topics{
clear: both;
padding: 0 11px 3px 8px;
font-size: 90%;
font-weight: bold;
line-height: 1.5;
background: url(/common/images/2010/heading2_bg_l.gif) no-repeat bottom right;
text-align: left;
margin:15px 16px 15px 16px;
}

ul.link li{
	margin:0px 16px 0px 16px;
	vertical-align:bottom;
	padding:0px 0px 10px 0px;
}

div#mainContentsOL div#contentsLeft div#banner01{
	margin-left:16px;
	margin-top: 10px;
}

div#contentsCenter{
	width:300px;
	float:left;
	margin-right:15px;
	border:#cacaca solid 1px;
	display:inline;
	overflow: hidden;
	padding-bottom:20px;
	height: auto !important;

}

div#contentsCenter ul#centerBt{
	clear:both;
	margin-top:16px;
	margin-left:16px;
	margin-bottom:10px;
}

div#contentCenter ul#centerBt li{
	list-style:none;
	margin-right:16px;
}

div#mainContentsOL div#contentsCenter div#banner02{
	margin-left:16px;
	margin-top: 10px;
}

div#contentsRight{
	width:300px;
	float:left;
	border:#cacaca solid 1px;
	display:inline;
	overflow: hidden;
	padding-bottom:20px;
	height: auto !important;

}

div#contentsRight ul#rightBt{
	clear: both;
	margin-top: 16px;
	margin-left: 16px;
	margin-bottom: 10px;
}

div#contentsRight ul#rightBt li{
	list-style:none;
	margin-right:5px;
	display:inline;
}

div#mainContentsOL div#contentsRight div#banner03{
	text-align: center;
	margin-top: 10px;

}

div#mainContentsOL h1 {
margin: 20px 0;
}

div#mainContentsOL {
text-align: left;
}

div#mainContentsOL div#contentsCenter ul.link li span.linkMark {
background: url(/common/images/2010/marker-arrow.gif) no-repeat 0 0.2em;
padding-left: 11px;
display: block;
text-align: left;
}

/*cmのiframe用
---------------------------*/
.tvcmIframe {
	width: auto;
	height: auto;
	margin-bottom: 0;
	border: none;
}
.disNone { display: none !important; }