@charset "utf-8";
/*
 * name:common.css
 * author:Manabu Kushimoto(web-park.org)
*/

/* reset
------------------------------------------------ */
body,div,pre,p,a,img,figure,form,fieldset,input,textarea,select,option,
dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,table,th,td,embed,object {
	margin: 0;
	padding: 0;
}
body {
	width: 100%;
	height: 100%;
	background: #000;
	font-size: 72%;
	font-family: Arial, Verdana, Helvetica, "ヒラギノ角ゴ Pro W3", "Hiragino Kakugo Pro W3", "MS P Gothic", "ＭＳ Ｐゴシック", Osaka, sans-serif;
	line-height: 1.6;
	color: #fff;
}
ul,ol { list-style: none; }
img { border: none; vertical-align: top; }
a:link { color: #fff; text-decoration: none; }
a:visited { color: #fff; text-decoration: none; }
a:hover { text-decoration: underline; }

.hide { display: none; }
.fRed { color: #f00; }
.space { margin-top: 10px; }
.exSpace { margin-top: 30px; }
.spaceL { margin-left: 10px; }
.spaceR { margin-right: 10px; }
.center { text-align: center; }

body.en .fr { display: none; }
body.fr .en { display: none; }

/* clearfix
------------------------------------------------ */
.clearfix:after {
	clear: both;
	display: block;
	visibility: hidden;
	height: 0;
	font-size: 0;
	content: ".";
}

.clearfix {
	clear: both;
	*zoom: 1;
}

/* container
------------------------------------------------ */
#container {
	display: none;
	margin: 0 auto;
	width: 800px;
	height: 496px;
}

	.wrap {
		margin: 0 auto;
		width: 660px;
		background: inherit;
	}

/* header
------------------------------------------------ */
#header {
	margin-bottom: 10px;
}

	#logo {
		text-align: center;
	}

/* contents
------------------------------------------------ */
#contents {
	position: relative;
	width: 100%;
	height: 360px;
}

#contents:before,
#contents:after {
	content: " ";
	position: absolute;
	left: 0;
	display: block;
	width: 100%;
	height: 1px;
	background: -webkit-gradient(linear,left top,right bottom,color-stop(0,#000),color-stop(.3,#838383),color-stop(.7,#838383),color-stop(1,#000));
}
#contents:before { top: 0; }
#contents:after { bottom: 0; }

/* product_detail */
.product_detail {
	position: relative;
	height: 100%;
	overflow: hidden;
}

	.product_detail > h1 {
		padding-top: 40px;
	}

	.product_detail > .product_list {
	}

		.product_detail > .product_list li {
		}

			.product_detail > .product_list li > article {
				position: absolute;
				top: 70px;
				right: 50px;
				width: 260px;
			}
		
				.product_detail > .product_list li > article h2 {
					font-family: Trajan Pro;
					font-size: 160%;
					font-weight: bold;
				}
		
				.product_detail > .product_list li > article .comment {
					font-size: 90%;
					word-break: break-all;
					color: #ccc;
				}
		
				.product_detail > .product_list li > article .price {
					margin-top: 10px;
					font-size: 90%;
					color: #ccc;
				}
		
				.product_detail > .product_list li > article dl {
					margin-top: 30px;
					font-size: 90%;
					color: #ccc;
				}
		
					.product_detail > .product_list li > article dl dt {
					}
		
					.product_detail > .product_list li > article dl dd {
					}
		
						.product_detail > .product_list li > article dl dd ul {
						}
		
							.product_detail > .product_list li > article dl dd ul li {
							}
		
								.product_detail > .product_list li > article dl dd ul li a {
									padding-left: 12px;
									background: url(../img/share/arrow1.png) no-repeat left 3px;
									color: #ccc;
								}
		
			.product_detail > .product_list li > figure {
				position: absolute;
				bottom: 0;
				left: 285px;
				width: 180px;
				text-align: center;
			}

/* item_nav */
.item_nav {
	position: absolute;
	top: 130px;
	left: 110px;
	width: 140px;
	font-size: 80%;
}

	.item_nav ul {
		border-top: solid #808080 1px;
	}

		.item_nav ul li {
			border-bottom: solid #808080 1px;
		}

			.item_nav ul li a {
				display: block;
				padding: 13px 0;
				color: #808080;
			}
			.item_nav ul li a.on,
			.item_nav ul li a.hover { color: #fff; }

/* story_gallery */
.product_detail > #story_gallery {
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
}

	.product_detail > #story_gallery > li {
		position: absolute;
		top: 0;
		right: 40px;
		width: 420px;
		height: 275px;
		font-size: 90%;
		color: #ccc;
	}

	.product_detail > #story_gallery > #gallery {
		right: 80px;
	}

		.product_detail > #story_gallery > #gallery > ul {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 270px;
		}

			.product_detail > #story_gallery > #gallery > ul li {
				position: absolute;
				top: 0;
				display: none;
				width: 268px;
				background: #000;
				border: solid #808080 1px;
				z-index: 1;
			}
			.product_detail > #story_gallery > #gallery > ul li.first { border-color: #fff; z-index: 10; }
			.product_detail > #story_gallery > #gallery > ul li.second { z-index: 8; }
			.product_detail > #story_gallery > #gallery > ul li.third,
			.product_detail > #story_gallery > #gallery > ul li.third_last_back,
			.product_detail > #story_gallery > #gallery > ul li.third_last_next { z-index: 6; }

				.product_detail > #story_gallery > #gallery > ul li img { width: 100%; }
				.product_detail > #story_gallery > #gallery > ul li.second img { opacity: .6; }
				.product_detail > #story_gallery > #gallery > ul li.third img,
				.product_detail > #story_gallery > #gallery > ul li.third_last_back img,
				.product_detail > #story_gallery > #gallery > ul li.third_last_next img { opacity: .4; }

		.product_detail > #story_gallery > #gallery > .back,
		.product_detail > #story_gallery > #gallery > .next {
			position: absolute;
			top: 280px;
			color: #808080;
		}

		.product_detail > #story_gallery > #gallery > .back { left: 73px; padding-right: 8px; background: url(../img/share/back.png) no-repeat right 3px; }
		.product_detail > #story_gallery > #gallery > .next { right: 73px; padding-left: 8px; background: url(../img/share/next.png) no-repeat left 3px; }

		.product_detail > #story_gallery > #gallery > .back:hover { background-position: right -24px; color: #fff; }
		.product_detail > #story_gallery > #gallery > .next:hover { background-position: left -24px; color: #fff; }

	.product_detail > #story_gallery > #story {
		padding-right: 40px;
		overflow-y: scroll;
	}

/* footer
------------------------------------------------ */
#footer {
	padding: 10px 0;
}
#footer a { color: #A6A6A6; }
#footer a.on,#footer a:hover { text-decoration: underline; color: #D9D9D9; }

	#gnav {
		float: left;
		padding-right: 3px;
	}

		#gnav ul {
		}

			#gnav ul li {
				display: inline-block;
				font-size: 90%;
			}

				#gnav ul li a { margin-right: 10px; padding-left: 8px; background-position: left top; background-repeat: no-repeat; }
				body.fr #gnav ul li a { margin-right: 4px; }
				#gnav ul li:nth-child(1) a { background-image: url(../img/share/icon_home.png); }
				#gnav ul li:nth-child(2) a { background-image: url(../img/share/icon_gel.png); }
				#gnav ul li:nth-child(3) a { background-image: url(../img/share/icon_fragrance.png); }
				#gnav ul li:nth-child(4) a { background-image: url(../img/share/icon_jewelry.png); }
				#gnav ul li:nth-child(5) a { background-image: url(../img/share/icon_store.png); }
				#gnav ul li:nth-child(6) a { background-image: url(../img/share/icon_contact.png); }

	#footer dl {
		float: left;
		padding: 2px 0 0 10px;
		font-size: 90%;
	}

		#footer dl dt {
			float: left;
			padding-left: 10px;
			background-position: left 3px;
			background-repeat: no-repeat;
		}
		#footer #nav_sound dt { background-image: url(../img/share/icon_sound.png); }
		#footer #nav_lang dt { background-image: url(../img/share/icon_language.png); }

		#footer dl dd {
			float: left;
			padding-left: 6px;
		}

			#footer dl dd ul {
			}

				#footer dl dd ul li {
					display: inline-block;
				}
				#footer dl dd ul li:first-child:after {
					content: "・";
				}

					.en #footer #nav_lang dd ul li:first-child a { text-decoration: underline; color: #D9D9D9; }
					.fr #footer #nav_lang dd ul li:last-child a { text-decoration: underline; color: #D9D9D9; }

	#copyright {
		clear: both;
		padding-top: 30px;
		text-align: center;
	}