@charset "utf-8";
/*
=============================================================================
top.css
=============================================================================
Structure:
	[Top Page Layout]
		01. Eyecatch
		02. Content
	[Eyecatch]
		01. Eyecatch
	[Product Content]
		01. Headline
		02. Product List
	[News Content]
		01. Headline
		02. News List
	[Side Content]
		01. Headline
		02. Side Content List
*/

/*
-----------------------------------------------------------------------------
[Top Page Layout]
=============================================================================
Structure:
  #eyecatch				: 100%
	#basebox			  : 950px
  .content				: 950px
	#wrapper			  : 750px
	  #product-content		: 230px
	  #news-content			: 500px
	#side-content		  : 180px
*/

/*	01. Eyecatch
-----------------------------------------------------------------------------*/
div#eyecatch {
	width: 100%;
	height: 285px;
	background: url(../images/img-eyecatch.jpg) no-repeat 50% 0;
	z-index: 1;
	}
	div#eyecatch div#basebox,
	div#eyecatch div#basebox-exposure {
		width: 950px;
		height: 285px;
		margin: 0 auto;
		}

/*	02. Content
-----------------------------------------------------------------------------*/
div#wrapper {
	float: left;
	width: 740px;
	}

	div#product-content {
		float: left;
		width: 230px;
		}

	div#news-content,
	div#sp-contents {
		position: relative;
		float: right;
		width: 480px;
		}

ul#side-content {
	float: right;
	width: 180px;
	}


/*
-----------------------------------------------------------------------------
[Eyecatch]
=============================================================================
/*	01. Eyecatch
-----------------------------------------------------------------------------*/
div#eyecatch div#basebox {
	position: relative;
	background: url(../images/img-eyecatch.jpg) no-repeat 50% 0;
	}
div#eyecatch div#basebox-exposure {
	position: absolute;
	background-repeat: no-repeat;
	background-position: 50% 0;
	z-index: 10;
	}
div.lang-en div#eyecatch div#basebox-exposure { background-image: url(../images/img-eyecatch-exposure.jpg); }
div.lang-ja div#eyecatch div#basebox-exposure { background-image: url(../images/la/img-eyecatch-exposure.jpg); }

/* Flashによるテキスト表示 */
div#eyecatch object#catchcopy-swf {
	position: absolute;
	top: 72px;
	right: 18px;
	z-index: 30;
	}

/* Flashなしの場合にテキストの画像を配置する */
div#eyecatch div#catchcopy {
	position: absolute;
	top: 120px;
	right: 35px;
	width: 535px;
	height: 115px;
	z-index: 20;
	}


/*
-----------------------------------------------------------------------------
[Product Content]
=============================================================================
/*	01. Headline
-----------------------------------------------------------------------------*/
div#product-content h2 {
	width: 220px;
	height: 76px;
	margin: 0 auto;	
	}

/*	02. Product List
-----------------------------------------------------------------------------*/
div#product-content ul {
	width: 220px;
	padding: 0 5px 5px;
	background: url(../images/bg-dots.gif) repeat 0 0;
	overflow: hidden;
	}

	div#product-content ul li {
		margin-top: 5px;
		background-color: #fff;
		}

/*
-----------------------------------------------------------------------------
[News Content]
=============================================================================
/*	01. Headline
-----------------------------------------------------------------------------*/
div#news-content h2 {
	width: 100%;
	height: 31px;
	margin-top: 15px;	
	}

div#news-content a#goto-backnumber {
	position: absolute;
	top: 23px;
	right: 0;
	width: 103px;
	height: 17px;
	font-size: 1px;
	text-indent: -9999px;
	outline: 0;
	overflow: hidden;
	}
	div.lang-en div#news-content a#goto-backnumber { background-image: url(../images/link-backnumber.gif); }
	div.lang-jp div#news-content a#goto-backnumber { background-image: url(../images/ja/link-backnumber.gif); }

	div#news-content a#goto-backnumber:hover,
	div#news-content a#goto-backnumber:active { background-position: 0 -17px; }


/*	02. News List
-----------------------------------------------------------------------------*/
div#news-content ul {
	margin-top: 5px;
	overflow: hidden;
	}

	div#news-content ul li {
		margin-top: -1px;
		padding: 6px 10px 5px;
		background: url(../images/bg-dotline.gif) repeat-x 0 0;
		overflow: hidden;
		zoom: 1;
		}

		/* 日付 */
		div#news-content ul li span.post-date {
			display: block;
			width: 90px;
			color: #aaaaaa;
			overflow: hidden;
			}
		/* ニュースタイトル */
		div#news-content ul li span.post-title {
			display: block;
			float: right;
			width: 360px;
			color: #545454;
			vertical-align: middle;
			}

			/* New マーク */
			div#news-content ul li span.post-title img {
				display: inline;
				padding-left: 0.3em;
				}

/*	03. Special Contents
-----------------------------------------------------------------------------*/
div#sp-contents { margin-top: 40px; }

	div#sp-contents ul {
		margin-top: 15px;
		padding: 0 10px;
		}

		div#sp-contents ul li {
			width: 220px;
			height: 90px;		
			}


/*
-----------------------------------------------------------------------------
[Side Content]
=============================================================================
/*	01. Headline
-----------------------------------------------------------------------------*/
ul#side-content { list-style: outside; }

ul#side-content li {
	width: 180px;
	margin-bottom: 10px;
	}