@charset "EUC-JP";

/*----------------------------------------------------------------

	loopedslider_for_drama CSS

	1 #SpPageHeader

	2 #loopedSlider

	/ NOTICE /
	Find [ Change This ] word then change value(s) of the style property, If you need.

----------------------------------------------------------------*/

/* 1 #SpPageHeader
========================================== */
div#sliderBox{
	width:294px;
	height:248px;
	overflow:hidden;
	position:relative;
	cursor:pointer;
	top:4px;
	left:39px;
}

/* 2 #loopedSlider
========================================== */
div#loopedSlider{ margin:0; width:366px; position:relative;}
div#loopedSlider:after{
	display:block; clear:both; content:"";
}
div.slides { position:absolute; height:221px;}
div.slides div a{text-decoration:none;}
div.slides div p{
	font-size:12px;
	width: 294px;
	font-weight:bold;
	line-height:16px;
	cursor:pointer;
	color:#fff; /* [ Change This ] */
	text-align:center;
}

div#controller{
	z-index:10;
	position:absolute;
	left:9px;
	top:251px;
	>top:249px;
	top /*\**/: 249px\9;
	width:356px;
	text-align:center;
	
}
ul.pagination {
	list-style:none outside none;
}
ul.pagination li { display:inline;
	line-height:22px;
}
ul.pagination li a {
	text-decoration:none;
	color:#fff;
	width: 15px;
	height: 15px;
	padding: 0 5px;
	background-color: #04131d;
	border:1px solid #2c414f;
	text-align:center;
	font-size:11px;
	>font-size:10px;
	font-size /*\**/: 10px\9;
	line-height:18px;
	margin-left:-5px;
	font-weight:bold;
} /* [ Change This ] */
ul.pagination li.active a {color:#fff; } /* [ Change This ] */
ul.pagination li a:hover{color:#cd0000;} /* [ Change This ] */

.SlideCon{
	position:absolute;
	top:0;
	left:0;
	z-index:2;
}
.SlideCon a{
	display:block;
	width:28px;
	height:222px;
	overflow:hidden;
}
.SlideCon a.previous{
	position:absolute;
	left:9px;
	top:4px;

}
.SlideCon a.next{
	position:absolute;
	left:335px;
	top:4px;
}