@charset "Shift_JIS"; /*
============================== CONTENTS ==============================

			1: 全体構成レイアウト
			2: ナビゲーション
					メインメニュー
					サブメニュー
					フッターメニュー
			3: html要素
					TOPページ
					共通要素
			4: リンクの設定
					基本リンク
					ナビリンク
			5: 独自共通要素
					フォントカラー
					フォントサイズ
					マージン・インデント
					その他
			6: 独自要素
					その他
			7: アクセシビリティ
			8: 不具合回避

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



/*
===== 1: 全体構成レイアウト =============================================
*/

body {
	background-color: #FFFFFF;
	color: #333333;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", sans-serif;
	font-size: 90%;
	margin: 0;
	padding: 0;
	text-align: center;
}


/*── レイアウト ──*/

#container { margin: 0 auto; padding: 0 1px; text-align: left; width: 574px; }

#wrapper {
	background-image: none;
	padding: 0;
	width: 574px;
}

#main { float: left; margin: 0; padding: 0 0 0 10px; text-align: left; width: 544px; }
#side { float: left; margin: 0; padding: 0 10px 20px 20px; text-align: left; width: 535px; }

#main2 { float: left; margin: 0; padding: 0 10px 20px 0; text-align: left; width: 574px; }
#sideMenu { width: 0; overflow: hidden; position: absolute; display:none;}


/*── ヘッダー ──*/

#header { margin: 0 auto 10px; padding: 0; width: 574px; height: 87px; background: url(../img/common/head_back.jpg) no-repeat; }

#logo { float: left; margin: 0 0 8px; padding: 0 0 0 10px; }
#seo {
	float: left;
	margin: 5px 0 0;
	padding: 2px 0 0 10px;
	height: 16px;
	width: 450px;
	font-size: 10px;
	line-height: 1em;
}
#print { width: 0; overflow: hidden; position: absolute; }
#mojiSize { float: right; margin: 8px 5px 7px 0; height: 42px; width: 101px; width: 0; overflow: hidden; position: absolute; }
#inquiry { float: right; margin: 8px 0 0; padding: 0 9px 0 0; }

#pan { font-size: small; line-height: 1em; margin: 0 0 4px 10px; padding: 0; }
#pan a { color: #333333; }

.homeBackP { background-position: 0 187px; position: absolute; }

/*── フッター ──*/

#footer {
	margin: 0 auto;
	padding: 5px 0 30px;
	width: 574px;
	text-align: right;
	border-top: 1px solid #CCCCCC;
}


/*
===== 2: ナビゲーション =============================================
*/

/*── メインメニュー ──*/

#menu{ width: 0; overflow: hidden; position: absolute; }


.pullMenu { position: relative; font-size: 12px; width: 574px; text-align: left; margin: 0; padding: 0; line-height: 1.8em; }
.pullMenu * { margin: 0; padding: 0; list-style: none; display: block; }
.pullMenu a { padding: 3px 2px; /*あまり大きな値は指定しない方が良い*/
	width: 127px; height: 32px; text-decoration: none; }
.pullMenu a:link { color: #333333; }
.pullMenu a:visited { color: #333333; }
.pullMenu a:hover{ color: #FFFFFF; background: none; text-indent: -9999px; }
.pullMenu a:active { color: #FFFFFF; }

.pullMenu li { height: 38px; line-height: 1.4em; text-indent: -9999px; }
.pullMenu li.off01 { width: 127px; float: left; background: url(../img/common/menu01.jpg) no-repeat; position: relative; overflow: hidden; }
.pullMenu li.off02 { width:127px; float:left; background: url(../img/common/menu02.jpg) no-repeat; position:relative; overflow:hidden; }
.pullMenu li.off03 { width:127px; float:left; background: url(../img/common/menu03.jpg) no-repeat; position:relative; overflow:hidden; }
.pullMenu li.off04 { width: 127px; float: left; background: url(../img/common/menu04.jpg) no-repeat; position: relative; overflow: hidden; }
.pullMenu li.off05 { width: 127px; float: left; background: url(../img/common/menu05.jpg) no-repeat; position: relative; overflow: hidden; }
.pullMenu li.off06 { width: 130px; float: left; background: url(../img/common/menu06.jpg) no-repeat; position: relative; overflow: hidden; }
.pullMenu li.on { width: 127px; float: left; background: none; text-indent: -9999px; overflow: hidden; }


/*── プルダウンメニュー ──*/

.sub {
	margin: 0 0 0 1px;
	position: relative;
	text-align: left;
	width: 125px;
	border-right: 1px solid #193563;
	border-bottom: 1px solid #193563;
	border-left: 1px solid #193563;
}
.sub li { background-color: #FFFFFF; text-indent: 0; height: 23px; }
.sub li.off2 { position: relative; overflow: hidden; }
.sub li.on2{ overflow: hidden; }

.sub a { padding: 4px 0 0 15px; /*あまり大きな値にしない*/
  width: 110px; /*削除不可*/
  height: 19px; /*削除不可*/
}
.sub a:link,
.sub a:visited { background: #FFFFFF url(../img/common/submenu_back01.gif) no-repeat; color: #000000; text-decoration: none; }
.sub a:hover,
.sub a:active { background: url(../img/common/submenu_back02.gif) no-repeat; color: #FFFFFF; text-decoration: none; text-indent: 0; }

.sub li a.red:link,
.sub li a.red:visited,
.sub li a.red:active,
.sub li a.red:hover { color: #CC0000; }


/*── サブメニュー ──*/

#smenu { clear: right; margin: 0; padding: 0; }
#smenu ul { margin: 0; padding: 0; }
#smenu ul li { float: left; font-size: small; text-indent: -9999px; margin: 0 5px 0 0; line-height: 1.2em; }


/*── サイドメニュー ──*/

#sideMenu ul {  overflow: hidden; position: absolute; }
#sideMenu li { margin: 0; padding: 0; }
#sideMenu li a:link,
#sideMenu li a:visited { width: 0; overflow: hidden; position: absolute;
	display: block;
	background: none;
	height: 0;
	width: 0;
	padding: 
}
#sideMenu li a:hover,
#sideMenu li a:active { background: none; }


/*── フッターメニュー ──*/

#fmenu { width: 0; overflow: hidden; position: absolute; }
#fmenu ul { margin: 0; padding: 0; }
#fmenu ul li {
	float: left;
	font-size: small;
	background:url(../img/common/smenu_point.gif) no-repeat 0 2px;
	text-indent: -10px;
	margin: 0 5px 0 0;
	line-height: 1.2em;
}


/*
===== 3: html要素 =============================================
*/

/*── TOPページ ──*/

h2.homeBox { background: url(../img/common/h4B_back.gif) no-repeat; height: 22px; font-size: 14px; padding: 4px 0 0 29px; line-height: 1.6em; }
h2.stitle { background: url(../img/common/h4_back.gif) no-repeat; height: 24px; font-size: 14px; line-height: 1.6em; margin: 0 0 10px; padding: 4px 0 0 29px; }


/*── 共通 ──*/

h1 { margin: 0; padding: 0; }
h2 { margin: 0; padding: 0; }
h2.title { margin: 0 0 10px 0; height: 50px; width: 570px; text-indent: -9999px; }
h3 { font-size: larger; line-height: 1.6em; padding: 0; margin: 0 0 15px 0; }
h3.stitle { background: url(../img/common/h3_back.jpg) no-repeat; color: #FFFFFF; height: 34px; margin: 0 0 10px; padding: 12px 0 0 12px; }
h3.stitle2 {
	background-image: url(../img/common/H3_back01.jpg);
	background-repeat: no-repeat;
	height: 100%;
	color: #FFFFFF;
	margin: 0;
	padding: 12px 0 0 12px;
}
.end {
	background: url(../img/common/H3_back02.jpg) no-repeat;
	height: 12px;
	margin: 0 0 10px;
	line-height: 1em;
}
h4.stitle { clear: both; background: url(../img/common/h4_back.gif) no-repeat; padding: 2px 0 0 15px; margin: 0 0 10px 12px; height: 20px; }
h5 { font-size: small; line-height: 1em; margin: 0 0 5px 27px; padding: 5px 0 0; }

p { margin: 0; padding: 0; line-height: 1.6em; }
p.goTop { clear: both; margin: 5px 0 10px 0; padding: 0 10px 0 0; text-align: right; width: 560px; overflow: hidden; }
p.goTop2 { clear: both; margin: 5px 0 10px 0; padding: 0 10px 0 0; text-align: right; width: 544px; }

ul { margin: .5em 0 1em; padding: 0; list-style-type: none; }
ul li { margin: 0; padding: 0 0 3px 18px; text-indent: -18px; }

ol { margin: 0; padding: 0 0 0 35px; }
ol li { margin: 0; padding: 0 0 2px; text-indent: 0; }


img { border: 0; }
img.imgRight { margin: 0 0 10px 10px; float: right; }
img.imgLeft { margin: 0 10px 0 0; float: left; }

form { margin: 0; padding: 0; width: 0; overflow: hidden; position: absolute; }

input { margin: 0 3px 0 0; width: 0; overflow: hidden; position: absolute; !important; }
textarea { background-color: #EEF7F4; !important; }
input:focus { background-color: #FFEACE; !important; }
textarea:focus { background-color: #FFEACE; !important; }

.tableBox { margin: 0 0 0 10px; width: 550px; background: #CCCCCC; }

th,
td { line-height: 1.4em; }

table th { }
table td { background: #FFFFFF; }

table.noLine {
	border-top: 0 none;
	border-left: 0 none;
}
table.noLine th { background: #FFFFFF; text-align: left;
	border-right: 0 none;
	border-bottom: 0 none; }
table.noLine td {
	border-right: 0 none;
	border-bottom: 0 none;
}

table.tableinH4 { margin: 5px 0 15px 27px; }
table.tableinH4 td { background: #CCCCCC; }
table.tdWhite td { background: #FFFFFF; }

/*
===== 4: リンクの設定 =============================================
*/

/*── 基本リンク ──*/

a, area { outline: 0 none; }

a:link { text-decoration: underline; color: #005CAB; }
a:visited { text-decoration: underline; color: #005CAB; }
a:hover { text-decoration: none; color: #005CAB; }
a:active { text-decoration: underline; color: #005CAB; }

a.black:link { text-decoration: underline; color: #333333; }
a.black:visited { text-decoration: underline; color: #333333; }
a.black:hover { text-decoration: none; color: #333333; }
a.black:active { text-decoration: underline; color: #333333; }


/*── ナビリンク ──*/

.link { background: url(../img/common/point09.gif) no-repeat 0 1px; line-height: 1.6em; padding: 0 0 3px 10px; }
.slink { background: none; padding: 0 0 3px 12px; line-height: 1.4em; }
.pdf { background: url(../img/common/point04.gif) no-repeat 0 1px; padding: 0 0 0 12px; margin: 0 1px 0 0; display: block; }
.coution { margin: 0 0 3px 22px; text-indent: -1em; }
.coution2 { margin: 0 0 3px 34px; text-indent: -1.5em; }
.coution3 { margin: 0 0 3px 42px; text-indent: -1em; }
.coution4 { margin: 0 0 3px 52px; text-indent: -1em; }
.coution5 { margin: 0 0 3px 12px; text-indent: -1em; }

ul li.link { background: url(../img/common/point09.gif) no-repeat 0 2px; text-indent: 0; padding-top: 0; }
ul li.disc { list-style: disc; text-indent: 18px; padding: 0 0 3px; }
ul li.pdf { background: url(../img/common/point04.gif) no-repeat 0 3px; text-indent: 0; padding-top: 0; }
ul.anker { margin-bottom: 0px; }
ul.anker li { background:url(../img/common/point06.gif) no-repeat 0 1px; text-indent: 0px; padding-top: 0; font-size: small; }

ul.day { margin: 5px 0 0 10px; }
ul.day li { background: url(../img/common/point05.gif) no-repeat 0 2px; text-indent: 2px; margin: 0 0 5px; line-height: 1.2em; }

ul.monitorTest { margin-bottom: 0; }
ul.monitorTest li {
	background: url(../img/common/point07.gif) no-repeat 0 2px;
	text-indent: 0;
	padding-top: 0;
	margin: 0 0 5px;
	line-height: 1.4em;
}

#question { margin: 0 0 15px; }
ul.question { margin: 0 0 5px; padding: 0 0 0 10px; background: url(../img/common/H4inBox_back.gif) no-repeat bottom; width: 501px; }
ul.qa { padding: 0; margin: 0; }
ul.an { padding: 0; margin: 0; }
li.q { background: url(../img/common/point_q.gif) no-repeat 0 3px; text-indent: 0; line-height: 1.4em; }
li.a { background: url(../img/common/point_a.gif) no-repeat 0 3px; margin: 0 0 0 9px; text-indent: 0; line-height: 1.4em; }


/*
===== 5: 独自共通要素 =============================================
*/


/*── フォントカラー ──*/

.red { color: #FF0000; }
.orange { color: #FF6600; }
.green { color: #05A55D; }
.white { color: #FFFFFF; }


/*── フォントサイズ ──*/

.small { font-size: small; line-height: 1.2em; }
.smaller { font-size: smaller; line-height: 1.2em; }
.xsmall { font-size: x-small; line-height: 1.2em; }
.big { font-size: x-large; font-weight: bold; line-height: 1.8em; }
.f10 { font-size: 10px; }
.f12 { font-size: 12px; line-height: 1.4em; }
.f14 { font-size: 14px; }
.bold { font-weight: bold; }


/*── マージン・インデント ──*/

.m5b { margin-bottom: 5px; }
.m10b { margin-bottom: 10px; }
.m15b { margin-bottom: 15px; }
.m20b { margin-bottom: 20px; }
.m30b { margin-bottom: 30px; }
.m50b { margin-bottom: 50px; }

.m5t { margin-top: 5px; }
.m10t { margin-top: 10px; }
.m15t { margin-top: 15px; }
.m20t { margin-top: 20px; }
.m30t { margin-top: 30px; }
.m52t { margin-top: 52px; }

.p10t { padding-top: 10px; }

.m10l { margin-left: 10px; }
.m20l { margin-left: 20px; }

.m5r { margin-right: 5px; }
.m10r { margin-right: 10px; }
.m15r { margin-right: 15px; }
.m20r { margin-right: 20px; }
.m30r { margin-right: 30px; }

.p5b { padding-bottom: 15px; }
.p10b { padding-bottom: 15px; }
.p15b { padding-bottom: 15px; }

.p40r { padding-right: 40px; }
.p3l { padding-left: 3px; }
.p20l { padding-left: 20px; }

.wd190 { width: 190px; }
.w235 { width: 235px; }

/*── その他 ──*/

.clear { clear: both; }
.clearNoWin { clear: both; }
.clear0 { clear: both; font-size: 0; line-height:1em; height: 0; }
.cen { text-align: center; }
.valignTop { vertical-align: top; }
.right { text-align: right; }
.left { text-align: right; }
.fLeft { float: left; }
.fRight { float: right; }
.uline { text-decoration: underline; }
.yubi { cursor: pointer; }

.lineH { line-height: 1.4em; }

.inH2 { margin: 0 0 10px 22px; }
.inH3 { margin: 0 0 15px 10px; width: 555px; }
.inH3u { margin: 0 0 15px 10px; }
.inH4 { margin: 5px 0 10px 27px; width: 535px; }
.inH4h { margin: 5px 0 10px 27px; }
.inH4o { margin: 5px 0 10px 27px; width: 500px; }
.inH4p { float: left; margin: 5px 0 0 3px; }

.base { margin: 0 0 10px; }



/*
===== 6: 独自要素 =============================================
*/

/*── H2ページタイトル ──*/

#products { background: url(../img/products/title_products.jpg) no-repeat; }
#kon { background: url(../img/products/title_k.jpg) no-repeat; height: 88px; }
#drink { background: url(../img/products/title_d.jpg) no-repeat; height: 88px; }
#drinkCloseup { background: url(../img/products/title_d_clsup.jpg) no-repeat; height: 88px; }
#drinkQA { background: url(../img/products/title_d_qa.jpg) no-repeat; height: 88px; }
#drinkCampaign { background: url(../img/campaign/title_d_cam.jpg) no-repeat; height: 88px; }
#order { background: url(../img/order/title_order.jpg) no-repeat; }
#regular { background: url(../img/regular/title_regular.jpg) no-repeat; }
#about { background: url(../img/about/title_about.jpg) no-repeat; }

/*── その他 ──*/

img.basedisplay { display: none; }
img.nodisplay { display: block; }

.bunken { float: left; margin: 0 0 0 27px; }
.note { width:234px; }
.noteTitle { background: url(../img/common/test1.jpg) no-repeat; line-height: 1em; padding: 40px 25px 2px; }
.noteText { background: url(../img/common/test2.jpg) repeat-y; line-height: 1.2em; padding: 0 25px; }
.noteEnd { background: url(../img/common/test3.jpg) no-repeat top; height: 26px; }

.caption { font-size: x-small; margin: 0 0 10px; text-align: center; }
.caption2 { font-size: x-small; margin: 0 10px 10px 0; text-align: center; }
.caption150 { font-size: x-small; margin: 0 150px 10px 0; text-align: center; }
.outline { width: 470px; }
.hrLine { border-top: 1px solid #CCCCCC; width: 100%; margin: 5px 0; padding: 2px 0 0; }


/*
===== 7: アクセシビリティ =============================================
*/

.hide { margin: 0 0 10px; height: 0; width: 0; overflow: hidden; position: absolute; /* for the benefit of IE5 Mac */ }


/*
===== 8: 不具合回避 =============================================
*/

/* WindowsIE以外に適用 */
ul.pullMenu>li.on { overflow: visible; /*×*/ }
ol.sub>li.on2{ overflow: visible; }


/* WindowsIE以外に適用 */
html>body img { vertical-align: bottom; }	/*画像下の隙間をなくす */

/* MacIE5.xを除くWindowsIE4〜6だけに適用 */

.clearfix { margin: 0; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-table; }

/* MacIE5.x意外に適用 \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
* html セレクタ { height: 1%; }	/* WindowsIE6配置バグ解消 */
/* //MacIE5.x意外に適用 */

/* MacIE5.xとWindowsIE4〜6だけに適用 */


/* html>body h3.side { font-size: x-small; } */	/* Opera文字サイズ対策 */
/* head:first-child+body h3.side { font-size: smaller; } */	/* 最新ブラウザ文字サイズ対策 */

/* デバッグ用 */
/* border: 1px solid #FF0000; */
.debug { border: 1px solid #FF0000; }


/* Safari対策 */

.stopSafari { color: #333333; ! }	/* これ以降Safariには適用されない */
label { cursor: pointer; }




/* END */