/* -----------------------------------------------------------------------------
general
-------------------------------------------------------------------------------- */
body {
	margin: 0;
	padding: 0;
	background: url(img/background.jpg) center top no-repeat fixed;
	line-height: 2.5em;
	font-size: small;
	font-family: 'hiragino kaku Gothic Pro W3', Verdana, Arial, sans-serif;
	text-align: center;
	}

p {
	font-size: larger;
	}

ul {
	list-style: none;
	}

li {
	line-height: 2.5em;
	}
	
h2 {
	margin: 0 0 40px 0;
	}

h3 {
	margin: 20px 0;
	}
	
a img {
	border: none;
	}

/* -----------------------------------------------------------------------------
layout
-------------------------------------------------------------------------------- */
.page {
	position: relative;
	width: 800px;
	margin: 10px auto 0 auto;
	padding: 0;
	text-align: left;
	}

.block {
	margin: 0 0 50px 0;
	padding: 0 10px;
	}

.maincolumn {
	float: left; 
	width: 490px;
	}

.subcolumn {
	float: right;
	width: 285px;
	}
/* -----------------------------------------------------------------------------
header area
-------------------------------------------------------------------------------- */	
#logo {
	position: absolute;
	left: 10px;
	top: 0;
	}
	
#freedial {
	position: absolute;
	right: 10px;
	top: 0;
	}

#mainvisual {
	margin: 70px 0 0 0;
	}

p#intro {
	width: 448px;
	height: 253px;
	margin: 0 0 50px 0;
	}

p#intro span {
	width: 448px;
	height: 253px;
	background: url(img/p_intro.gif) 0 0 no-repeat;
	}

a#jumpcart {
	width: 238px;
	height: 120px;
	}

a#jumpcart span {
	width: 238px;
	height: 120px;
	background: url(img/btn_jump-cart.gif) 0 0 no-repeat;
	}

a#jumpcart:hover span {
	background-position: 0 -120px;
	}

a#recommend {
	width: 227px;
	height: 77px;
	top: 100px;
	}

a#recommend span {
	width: 227px;
	height: 77px;
	background: url(img/btn_recommend.gif) 0 0 no-repeat;
	}

a#recommend:hover span {
	background-position: 0 -77px;
	}
/* -----------------------------------------------------------------------------
catch area
-------------------------------------------------------------------------------- */	
h2#Hcatch {
	width: 658px;
	height: 180px;
	}

h2#Hcatch span {
	width: 658px;
	height: 180px;
	background: url(img/header_catch-area.jpg) 0 0 no-repeat;
	}

h3#Hadvantage {
	width: 242px;
	height: 40px;
	}

h3#Hadvantage span {
	width: 242px;
	height: 40px;
	background: url(img/header_sub_advantage.gif) 0 0 no-repeat;
	}

li#delicious {
	width: 490px;
	height: 25px;
	}

li#delicious span {
	width: 490px;
	height: 25px;
	background: url(img/li_delicious.gif) 0 0 no-repeat;
	}

li#polyphenol {
	width: 249px;
	height: 25px;
	background: url(img/li_polyphenol.gif) 0 0 no-repeat;
	}

li#polyphenol span {
	width: 249px;
	height: 25px;
	background: url(img/li_polyphenol.gif) 0 0 no-repeat;
	}

h3#Hcomparison {
	width: 357px;
	height: 40px;
	}

h3#Hcomparison span {
	width: 357px;
	height: 40px;
	background: url(img/header_sub_comparison.gif) 0 0 no-repeat;
	}
/* -----------------------------------------------------------------------------
push area -environment
-------------------------------------------------------------------------------- */	
h2#Henvironment {
	width: 596px;
	height: 105px;
	}

h2#Henvironment span {
	width: 596px;
	height: 105px;
	background: url(img/header_push-area-environment.jpg) 0 0 no-repeat;
	}

h3#Hcomment {
	width: 253px;
	height: 40px;
	}

h3#Hcomment span {
	width: 253px;
	height: 40px;
	background: url(img/header_sub_comment-farmer.gif) 0 0 no-repeat;
	}
/* -----------------------------------------------------------------------------
push area -component
-------------------------------------------------------------------------------- */	
h2#Hcomponent {
	width: 450px;
	height: 102px;
	}

h2#Hcomponent span {
	width: 450px;
	height: 102px;
	background: url(img/header_push-area-component.jpg) 0 0 no-repeat;
	}

li#fiber {
	width: 333px;
	height: 25px;
	}

li#fiber span {
	width: 333px;
	height: 25px;
	background: url(img/li_fiber.gif) 0 0 no-repeat;
	}

li#absence {
	width: 660px;
	height: 25px;
	}

li#absence span {
	width: 660px;
	height: 25px;
	background: url(img/li_absence-vegetable.gif) 0 0 no-repeat;
	}

li#health {
	width: 263px;
	height: 25px;
	}

li#health span {
	width: 263px;
	height: 25px;
	background: url(img/li_health.gif) 0 0 no-repeat;
	}
	
li#carbohydrate {
	width: 206px;
	height:25px;
	}

li#carbohydrate span {
	width: 206px;
	height:25px;
	background: url(img/li_carbohydrate.gif) 0 0 no-repeat;
	}

li#greenjuice {
	width: 470px;
	height: 25px;
	}

li#greenjuice span {
	width: 470px;
	height: 25px;
	background: url(img/li_green-juice.gif) 0 0 no-repeat;
	}
	
h3#Hrecommend {
	width: 202px;
	height: 40px;
	}

h3#Hrecommend span {
	width: 202px;
	height: 40px;
	background: url(img/header_sub_recommend.gif) 0 0 no-repeat;
	}


/* -----------------------------------------------------------------------------
push area -component
-------------------------------------------------------------------------------- */	
h2#Hfaq {
	width: 500px;
	height: 104px;
	}

h2#Hfaq span {
	width: 500px;
	height: 104px;
	background: url(img/header_push-area-faq.jpg) 0 0 no-repeat;
	}
	
h3#HfaqKaraimo {
	width: 507px;
	height: 107px;
	}

h3#HfaqKaraimo span {
	width: 507px;
	height: 107px;
	background: url(img/li_faq-karaimo.jpg) 0 0 no-repeat;
	}

h3#HfaqTarget {
	width: 496px;
	height: 107px;
	}

h3#HfaqTarget span {
	width: 496px;
	height: 107px;
	background: url(img/li_faq-target.jpg) 0 0 no-repeat;
	}

h3#HfaqDrink {
	width: 275px;
	height: 107px;
	}

h3#HfaqDrink span {
	width: 275px;
	height: 107px;
	background: url(img/li_faq-how-to-drink.jpg) 0 0 no-repeat;
	}

h3#HfaqPurchase {
	width: 375px;
	height: 107px;
	}

h3#HfaqPurchase span {
	width: 375px;
	height: 107px;
	background: url(img/li_faq-purchase.jpg) 0 0 no-repeat;
	}

h3#HfaqDifference {
	width: 420px;
	height: 107px;
	}	

h3#HfaqDifference span {
	width: 420px;
	height: 107px;
	background: url(img/li_faq-difference.jpg) 0 0 no-repeat;
	}	


/* -----------------------------------------------------------------------------
purchase area
-------------------------------------------------------------------------------- */	
h2#Hpurchase {
	width: 513px;
	height: 102px;
	}

h2#Hpurchase span {
	width: 513px;
	height: 102px;
	background: url(img/header_purchase-area.jpg) 0 0 no-repeat;
	}

h3#HgetItem {
	width: 283px;
	height: 100px;
	}

h3#HgetItem span {
	width: 283px;
	height: 100px;
	background: url(img/header_petit_shoppingcart.jpg) 0 0 no-repeat;
	}

p#productName {
	width: 251px;
	height: 41px;
	}

p#productName span {
	width: 251px;
	height: 41px;
	background: url(img/label_name-ketto-otameshi.gif) 0 0 no-repeat;
	}

p#LabelContent {
	width: 87px;
	height: 27px;
	}

p#LabelContent span {
	width: 87px;
	height: 27px;
	background: url(img/label_item.gif) 0 0 no-repeat;
	}

p#productContent {
	width: 275px;
	height: 41px;
	}

p#productContent span {
	width: 275px;
	height: 41px;
	background: url(img/label_content.gif) 0 0 no-repeat;
	}

p#price {
	width: 264px;
	height: 41px;
	}

p#price span {
	width: 264px;
	height: 41px;
	background: url(img/label_price.gif) 0 0 no-repeat;
	}


/* -----------------------------------------------------------------------------
purchase area -notice box
-------------------------------------------------------------------------------- */	
div.notice {
	width: 640px;
	margin: 0 auto 40px auto;
	padding: 10px;
	border: 1px solid #CCC;
	background: #FFCCCC;
	}

div.notice div {
	float: left;
	width: 300px;
	margin: 0 10px 0 0;
	}

div.notice p {
	font-size: 1em;
	}

div.notice a {
	color: #222222;
	}
	
div.notice a:hover {
	text-decoration: none;
	}

strong#noticeCost {
	width: 79px;
	height: 14px;
	}

strong#noticeCost span {
	width: 79px;
	height: 14px;
	background: url(img/item_cost.gif) 0 0 no-repeat;
	}

strong#noticePay {
	width: 133px;
	height: 14px;
	}

strong#noticePay span {
	width: 133px;
	height: 14px;
	background: url(img/item_payment.gif) 0 0 no-repeat;
	}

strong#noticeDelivery {
	width: 131px;
	height: 14px;
	}

strong#noticeDelivery span {
	width: 131px;
	height: 14px;
	background: url(img/item_delivery.gif) 0 0 no-repeat;
	}

strong#noticeExchange {
	width: 114px;
	height: 14px;
	}

strong#noticeExchange span {
	width: 114px;
	height: 14px;
	background: url(img/item_return-and-change.gif) 0 0 no-repeat;
	}

strong#noticeCancel {
	width: 145px;
	height: 14px;
	}

strong#noticeCancel span {
	width: 145px;
	height: 14px;
	background: url(img/item_cancel.gif) 0 0 no-repeat;
	}

strong#noticeContact {
	width: 53px;
	height: 14px;
	}

strong#noticeContact span {
	width: 53px;
	height: 14px;
	background: url(img/item_contact.gif) 0 0 no-repeat;
	}


/* -----------------------------------------------------------------------------
purchase area -etc
-------------------------------------------------------------------------------- */	
h3#productDetail {
	width: 158px;
	height: 40px;
	}

h3#productDetail span {
	width: 158px;
	height: 40px;
	background: url(img/header_sub_content.jpg) 0 0 no-repeat;
	}

h3#productComponent {
	width: 182px;
	height: 40px;
	}

h3#productComponent span {
	width: 182px;
	height: 40px;
	background: url(img/header_sub_component.jpg) 0 0 no-repeat;
	}

h3#productEtc {
	width: 127px;
	height: 40px;
	}
	
h3#productEtc span {
	width: 127px;
	height: 40px;
	background: url(img/header_sub_etc.jpg) 0 0 no-repeat;
	}

/* -----------------------------------------------------------------------------
common tools
-------------------------------------------------------------------------------- */	
.caption {
	margin: -1em 0 0 0;
	font-size: small;
	}

/* IR:Gilder/Levin Method */
p#intro,
a#jumpcart,
a#recommend,
h2#Hcatch,
h3#Hadvantage,
li#delicious,
li#polyphenol,
h3#Hcomparison,
h2#Henvironment,
h3#Hcomment,
h2#Hcomponent,
li#fiber,
li#absence,
li#health,
li#carbohydrate,
li#greenjuice,
h3#Hrecommend,
h2#Hfaq,
h3#HfaqKaraimo,
h3#HfaqTarget,
h3#HfaqDrink,
h3#HfaqPurchase,
h3#HfaqDifference,
h2#Hpurchase,
h3#HgetItem,
p#productName,
p#LabelContent,
p#productContent,
p#price,
strong#noticeCost,
strong#noticePay,
strong#noticeDelivery,
strong#noticeExchange,
strong#noticeCancel,
strong#noticeContact,
h3#productDetail,
h3#productComponent,
h3#productEtc {
	position: relative;
	font-size: 1.1em;
	overflow: hidden;
	} 

p#intro span,
a#jumpcart span,
a#recommend span,
h2#Hcatch span,
h3#Hadvantage span,
li#delicious span,
li#polyphenol span,
h3#Hcomparison span,
h2#Henvironment span,
h3#Hcomment span,
h2#Hcomponent span,
li#fiber span,
li#absence span,
li#health span,
li#carbohydrate span,
li#greenjuice span,
h3#Hrecommend span,
h2#Hfaq span,
h3#HfaqKaraimo span,
h3#HfaqTarget span,
h3#HfaqDrink span,
h3#HfaqPurchase span,
h3#HfaqDifference span,
h2#Hpurchase span,
h3#HgetItem span,
p#productName span,
p#LabelContent span,
p#productContent span,
p#price span,
strong#noticeCost span,
strong#noticePay span,
strong#noticeDelivery span,
strong#noticeExchange span,
strong#noticeCancel span,
strong#noticeContact span,
h3#productDetail span,
h3#productComponent span,
h3#productEtc span {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	}