@charset "UTF-8";




/* === index === */

body.index #Container {
	background:#FFE549 url(../images/index_bg_04.gif) repeat-x 0 0;
}


body.index #Content {
	background:url(../images/index_bg_01.gif) no-repeat 50% 0;
}

body.index #Content div.inner {
	position: relative;
	padding:0 0 20px;
	background:url(../images/index_bg_02.gif) no-repeat 50% 100%;


	/*\*/
	_overflow:visible;
	_height:1px;
	zoom:1;
	/**/
	/*\*//*/
	display:inline-table;
	/**/
}

body.index #Content div.inner:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;
}




body.index #GrovalNavi {
	padding:32px 0 0 21px;
}

body.index h1 {
	width: auto;
	float: none;
  padding: 16px 0 0;
  text-align: center;
}
body.index h1 img {
	vertical-align:bottom;
}
body.index .img01 {
  text-align: center;
}
body.index .Banner1 {
  overflow: hidden;
  width: 610px;
  margin: 46px auto 0;
}
.index .Banner1 li {
  float: left;
  width: 285px;
  margin: 0 10px;
}
.index .Banner1 li img {
	vertical-align:bottom;
}
.index .Banner1 li span {
  display: block;
  margin-top: 3px;
  font-size: 12px;
  line-height: 1.3;
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
}
.index .Banner1 li a {
  text-decoration: none;
}
.index .Banner1 li a:link, .index .Banner1 li a:visited {
  color: #592511;
  text-decoration: none;
}
.index .Banner1 li a:hover, .index .Banner1 li a:active {
  color: #592511;
}


body.index #News {
	width:426px;
	min-height:90px;
	_height:90px;
	float:left;
	position:relative;
	top:-3px;
	margin:0 0 0 33px;
	_margin:0 0 0 16px;
	background:#5DB6E5 url(../images/index_bg_03.gif) no-repeat 0 100%;
	color:#fff;
	font-size:120%;
}

body.index #News ul {
	padding:2px 9px 7px;
}

body.index #News li {
	margin:0 0 3px;
	padding:0 0 0 2.8em;
	text-indent:-2.8em;
}


body.index #News a:link {
	color:#fff;
}

body.index #News a:visited {
	color:#fff;
}

body.index #News a:focus,
body.index #News a:hover,
body.index #News a:active {
	color:#fff;
}


/*body.index .bnr_icon {
	position: absolute;
	right: 27px;
	top: 106px;
}*/

body.index #Banner {
  margin: 5px 0 0;
  padding: 0;
  text-align: center;
}
body.index #Banner li {
	display: inline;
  margin: 0 2px;
}
body.index #Banner li img {
	vertical-align: top;
}
body.index #Banner li:first-child {
  position: relative;
  top: 7px;
}



body.index #Button {
	margin:0 auto;
	padding:0 0 10px;
	position:relative;
	top:-5px;
	text-align:left;
	width:780px;
		voice-family: "\"}\"";
		voice-family:inherit;
	width:708px;
}

/* === product === */

body.product #Content {
	background:url(../images/product_bg_01.gif) no-repeat 50% 0;
}


body.product #Banner {
	padding:45px 50px 25px;
	background:url(../images/product_bg_03.gif) no-repeat 0 100%;
}

/*
body.product #Main {
	min-height:840px;
	_height:640px;
}
*/
body.product #Main {
	padding-bottom: 15px;
	margin-left: 0px;
}

body.product .Products ,
body.product #ProductCocoa {
	margin:0 0 20px;


	/*\*/
	_overflow:visible;
	_height:1px;
	zoom:1;
	/**/
	/*\*//*/
	display:inline-table;
	/**/
}

body.product .Products:after ,
body.product #ProductCocoa:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;
}

body.product .Products {
	width: 629px;
	margin: 0 auto 23px;
	padding-bottom: 20px;
	background: url(../images/bg_product_section.gif) no-repeat center bottom;
}

body.product #Main h2 {
	margin:0 0 5px;
}

body.product #Main p.read {
	margin: 14px 30px 4px;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.6;
}

body.product div.subsection01 {
	display: inline;
	width:240px;
	float:left;
	margin-right: 26px;
	margin-left: 50px;
}

body.product div.subsection01 p {
	margin:0;
}


body.product div.subsection02 {
	display: inline;
	float:left;
	width:240px;
}

body.product div.subsection02 p {
	margin:0;
}

body.product #Main h3 {
	margin:0 0 8px;
}

body.product #Main div.subsection p {
	margin-bottom:5px;
}

body.product #Main p {
	line-height:1.35;
	font-size:120%;
	text-align:justify;
	text-justify:inter-ideograph;
}


body.product #ProductCocoa p.img {
	width:255px;
	float:left;
	margin:0;
}


body.product #Main #ProductCocoa h3 {
	padding:43px 0 0 255px;
}


body.product #ProductCocoa p {
	margin:0 95px 10px 255px;
}

body.product #Size {
	clear: both;
	width: 578px;
	margin: 0 auto 23px;
}


body.product #premium {
  clear: both;
  height: 771px;
  padding: 20px 0 0;
	background: url(../images/product_bg_04.jpg) no-repeat center top;
}
body.product #premium h2 {
  margin: 0 0 7px 0;
  text-align: center;
}
body.product #premium .read {
  margin: 0 0 13px 0 !important;
  text-align: center;
}
body.product #premium ul {
  height: 463px;
  margin: 0 0 0 40px;
}
body.product #premium ul li {
  float: left;
  margin: 0 20px 0 0;
}


/* === history === */


body.history #Content {
	background:url(../images/history_bg_01.gif) no-repeat 50% 0;
}


body.history #Banner {
	padding:45px 33px 14px;
	background:url(../images/history_bg_02.gif) no-repeat 0 100%;
}


body.history #Main {
	min-height:545px;
	_height:545px;
	width:640px;
	margin:10px 0 12px 60px;
	padding-bottom: 53px;
}

body.history #IndexList li {
	width:105px;
	height:105px;
	float:left;
}

body.history #IndexList img {
	cursor:pointer;
}


body.history #History {
	width:318px;
	height:320px;
	float:right;
}





/* === story === */

body.story #Head {
	min-height:60px;
	_height:60px;
}

body.story #Content {
	background:url(../images/story_bg_01.gif) no-repeat 50% 0;
}


body.story #Banner {
	padding:42px 33px 14px;
	background:url(../images/story_bg_02.gif) no-repeat 0 100%;
}


body.story #Main {
	min-height:512px;
	_height:512px;
	margin:18px 0 0 85px;
}



body.story #Main li {
	width:296px;
	float:left;
	padding:3px 0;
	border-bottom:1px dashed #FBB803;
	font-size:120%;
}

body.story #Main li a {
	text-decoration:none;
}

body.story #Main li a img {
	vertical-align:middle;
	margin:0 10px 0 0;
}





/* === project === */


body.project #Content {
	background:url(../images/project_bg_01.gif) no-repeat 50% 0;
}


body.project #Banner {
	padding:53px 33px 14px;
	background:url(../images/project_bg_02.gif) no-repeat 0 100%;
}


body.project #Head {
	padding:113px 55px 6px;
}

body.project h1 {
	float:none;
	width:auto;
	text-align:center;
}

body.project #Main {
	min-height:306px;
	height:306px;
	margin:0 0 0 70px;
	width:607px;
	text-align:center;
}

body.project #Entry {
	position:relative;
	top:-17px;
	margin:0 0 0 170px;
	text-align:left;
	line-height:1.35;
	font-size:120%;
}

body.project #Entry p {
	color:#E60012;
}

body.project #Exhibition ul {
	position:relative;
	top:-10px;
	z-index:2;
	margin:0 0 -10px;
}

body.project #Exhibition p {
	position:relative;
	top:-60px;
	z-index:1;
	margin:0 0 0 50px;
}

body.project #Mail {
	position:relative;
	top:-50px;
	margin:0 0 -98px;
}

body.project #Note {
	position:relative;
	bottom:-40px;
	margin:0 60px 0 70px;
	text-align:left;
	line-height:1.35;
	font-size:110%;
}

body.project #Note li {
	padding:0 0 0 1em;
	text-indent:-1em;
}


/* === download === */

body.download #Content {
	background:url(../images/download_bg_03.gif) no-repeat 50% 0;
}


body.download #Banner {
	padding:55px 33px 14px;
	background:url(../images/download_bg_04.gif) no-repeat 0 100%;
}


body.download #Main {
	min-height:470px;
	_height:470px;
	margin:0 0 0 75px;
	width:599px;
}




body.download h1 {
	width:285px;
	float:left;
}

body.download #Head p {
	margin:0 0 0 285px;
}


body.download #Download h2 {
	margin:0 0 3px;
	text-align:center;
}

body.download #Download li {
	margin:0 0 1px;
	text-align:center;
}

body.download #Download img {
	vertical-align:bottom;
}


body.download #SetUp {
	padding:0 0 23px;
	background:url(../images/download_bg_02.gif) no-repeat 0 100%;
}


body.download #SetUp h3 {
	padding:0 0 0 10px;
	background:url(../images/download_bg_01.gif) no-repeat 0 0;
}

body.download #SetUp h4 {
	margin:10px 23px 2px;
	color:#DE8200;
	font-size:120%;
	font-weight:normal;
}

body.download #SetUp p {
	margin:0 23px;
	line-height:1.35;
	font-size:120%;
}

body.download #SetUp em {
	color:#4BBFFD;
}




/* === exhibition === */

body.exhibition #Content {
	background:url(../images/exhibition_bg_01.gif) no-repeat 50% 0;
}

body.exhibition #Banner {
	padding:6px 33px 14px;
	background:url(../images/exhibition_bg_02.gif) no-repeat 0 100%;


	/*\*/
	_overflow:visible;
	_height:1px;
	zoom:1;
	/**/
	/*\*//*/
	display:inline-table;
	/**/
}

body.exhibition #Banner:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;
}


body.exhibition #Back {
	width:113px;
	float:left;
}


body.exhibition #GrovalNavi {
	padding:18px 0 0 21px;
}

body.exhibition #Main {
	margin:0;
}

body.exhibition #Main #flashcontent h1 {
	float:none;
	width:auto;
	font-size:120%;
	margin:30px 40px 10px;
}

body.exhibition #Main #flashcontent p {
	font-size:120%;
	margin:10px 40px 100px;
}




/* === cm === */

body.cmtop #Content {
	background:url(../images/cm_bg_01.gif) no-repeat 50% 0;
}

body.cmtop #Content div.inner {
	min-height:800px;
	_height:800px;
	background:url(../images/cm_bg_02.gif) no-repeat 50% 100%;
}

/* ----- */

body.cm #Content {
	background:url(../images/cm_bg_03.gif) no-repeat 50% 0;
}

body.cm #Content div.inner {
	min-height:760px;
	_height:760px;
	background:url(../images/cm_bg_02.gif) no-repeat 50% 100%;
}

/* ----- */

body.cm #Content {
	background:url(../images/cm_bg_04.gif) no-repeat 50% 0;
}

body.cmshort #Content div.inner {
	min-height:694px;
	_height:694px;
	padding:0 0 35px;
	background:url(../images/cm_bg_05.gif) no-repeat 50% 100%;
}

/* ----- */


body.cm #Main {
	margin:0 0 0 75px;
	padding:0 0 70px;
	width:599px;
}


body.cm #Head {
	padding:22px 55px 0;
}

body.cm h1 {
	width:auto;
	float:none;
	padding:13px 0 0 26px;
}


body.cm #Head p {
	position:relative;
	top:-20px;
	margin:0 0 0 100px;
	padding:0;
}


body.cm h2 {
	margin:0 0 14px;
	font-size:120%;
}

body.cm #Img {
	text-align:center;
}


body.cm #Img ul.button {
	margin:0 0 0 23px;


	/*\*/
	_overflow:visible;
	_height:1px;
	zoom:1;
	/**/
	/*\*//*/
	display:inline-table;
	/**/
}

body.cm #Img ul.button:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;
}

body.cm #Img ul.button img {
	vertical-align:bottom;
}

body.cm #Img ul.button li {
	width:93px;
	height:69px;
	float:left;
}




body.cm #Movie {
	text-align:center;
}


body.cm #Movie ul.button {
	position:relative;
	top:-103px;
	margin:0 26px -80px;
	text-align:right;
}


body.cm #Movie ul.button li {
	margin:0 0 3px;
}


body.cm #Movie ul.button img {
	vertical-align:bottom;
}



body.cm p.download {
	margin:16px 48px -20px;
	font-size:120%;
}


body.cm p.download img {
	float:left;
}


body.cm p.download span {
	display:block;
	margin:0 0 0 95px;
	padding:8px 0 0;
}






body.cm #ToTop {
	width:710px;
	margin:auto;
	padding:0 0 28px;
	background:none;


	/*\*/
	_overflow:visible;
	_height:1px;
	zoom:1;
	/**/
	/*\*//*/
	display:inline-table;
	/**/
}

body.cm #ToTop:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;
}


body.cm #ToTop li {
	width:150px;
}

body.cm #ToTop li.link01 {
	float:left;
	text-align:left;
}

body.cm #ToTop li.link02 {
	float:right;
	text-align:right;
}



body.cmtop h1 {
	width:210px;
}


body.cmtop #Head p {
	margin:0 0 0 210px;
	padding:10px 0 0;
}


body.cmtop #Button {
	margin:20px 0 0 75px;
	padding:0 0 70px;

	/*\*/
	_overflow:visible;
	_height:1px;
	zoom:1;
	/**/
	/*\*//*/
	display:inline-table;
	/**/
}

body.cmtop #Button:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;
}

body.cmtop #Button li {
	width:205px;
	height:163px;
	float:left;
}




body.cmtop #ToTop {
	width:710px;
	margin:auto;
	padding:0 0 28px;
	background:none;
}



/* === cocoa === */

body.cocoa #Container {
	text-align:left;
}


body.cocoa #PortalHead {
	position:absolute;
	top:0;
	left:0;
	z-index:1;
	width:100%;
}



body.cocoa #FlashContent p {
	padding:50px;
	font-size:120%;
	line-height:1.5;
	text-align:center;
}



