/* CSS Document */

/* ────────────────────────────
	Slider
──────────────────────────── */

/*  COMMON -- */
.clear {
	content: "";
	clear: both;
	display: block;
}

/* -- SLIDER -- */
div.slider {
	width: 848px;
	height: 412px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-image: url(../slider/common/base.jpg);		/* CSSファイル基準の相対 */
	background-repeat: no-repeat;
}

/* ──────────────────────────── */

/* -- DISPLAY -- */
.slider > div.display {
	position: relative;
	width: 810px;
	height: 320px;
	overflow: hidden;
	margin: 15px 18px 5px 18px;
}
.slider > div.display:after {
	content: "";
	clear: both;
	display: block;
}
.slider > .display > div.blind {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	z-index: 2;
	display: none;
	opacity: 0;
}
.slider > .display > ul.carousel {
	position: absolute;
	list-style: none;
	width: 10000px;
	margin: 0;
	padding: 0;
	z-index: 0;
}
.slider > .display > ul.carousel > li {
	float: left;
}

/* ──────────────────────────── */

/* -- L-R-BUTTON -- */
.slider > .display > a.btn {
	height: 100%;
	width: 100px;
	position: absolute;
	display: block;
	opacity: 0.3;
	-moz-opacity: 0.3;
	-webkit-opacity: 0.3;
	z-index: 1;
}
.slider > .display > a.btn#R-btn {
	right: 0;
}
.slider > .display > a.btn#L-btn {
	left: 0;
}
.slider > .display > a.btn > img.arrow {
	position: absolute;
	z-index: 3;
	top: 45%;
}
.slider > .display > a.btn > img.arrow.left {
	left: 20px;
}
.slider > .display > a.btn > img.arrow.right {
	right: 20px;
}

/* ──────────────────────────── */

/* -- PAGER -- */
.slider > div.pager {
	position: relative;
	width: 810px;
	height: 60px;
	overflow: hidden;
	margin: 0 18px 5px 18px;
}
.slider > div.pager:after {
	content: "";
	clear: both;
	display: block;
}
.slider > .pager > ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.slider > .pager > ul > li {
	float: left;
	margin-left: 6px;
}
.slider > .pager > ul > li:first-child {
	margin-left: 0;
}

/* ──────────────────────────── */

/* -- TOGGLE-WINDOW -- */
.slider > div.display > ul.toggle-window {
	list-style: none;
	margin: 0;
	padding: 0;
	z-index: 3;
}
.slider > div.display > ul.toggle-window > li {
	display: none;
	opacity: 0;
}