/* flicksimple css　自動スクロールバナー*/

#scrollbanner_area {
	width:300px;
	height:430px;
	background:url(../../images/bg_autoScroll.png) no-repeat;
	position:relative;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.flickSimple {
	width: 320px;
	position: relative;
	overflow: auto;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.flickSimple.landscape {
	width: 490px;
}

.flickSimple .flickContainer {
	display: block;
	margin: 0;
	padding: 0;
}

.flickSimple .animeBanner {
	float: left;
	list-style-type: none;
	text-align: center;
}

/*.flickSimple ul.landscape {
}*/
/*.flickSimple ul li.landscape {
}*/

/* バナー表示エリアのサイズとマージン */
#flickable1,
#flickable1.landscape {
	width: 280px;
	margin:0 0 0 10px;
	padding:0;
}

#flickable1 ul.landscape,
#flickable1 .flickContainer {
	width: 600%;/*バナーの数が変わったらこの幅を調整。バナー１つにつき100%で設定してある。*/
}

/* 個別バナーサイズとマージン */
#flickable1 .animeBanner {
	width: 280px;
	margin-top:10px;
}

.bannerDescription {
	width:278px;
	height:115px;
	margin-top:5px;
	font-size:1.2em;
	border:1px solid #cccccc;
	background:#fff;
	border-radius: 7px;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	position: relative;
	behavior: url(/w/common/pie/PIE.htc);
}
.bannerDescription p { 
	padding:7px;
	text-align:left;
}
.bannerDescription h5.itemTitle {
	margin:7px 0 0 0;
	color:#a21c1c;
	font-size:1.4em;
}

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

.flickableControl {
	overflow: hidden;
}

/* flickablenavi：見たいバナーにクリックで移動 */
#flickableNavi {
	width:276px;
	text-align: center;
	position:absolute;
	top:393px;
	left:23px;/*バナーの数が変更になったらここも調整(.indicatorのmargin-leftと値を同じにする)*/
	/*left:87px; ←バナー3個の場合*/
}

#flickableNavi li {
	width:46px;
	height:28px;
	float:left;
	display:block;
}

/* indicator：バナー数の可視化 */
.indicator {
	position: relative;
	overflow: hidden;
	top:12px;
	height: 40px;
	background: url(../../images/indicater_bg.gif) repeat-x;
	margin: 0 0 0 23px;
}

.indicator img {
	position: absolute;
	left: 0;
	top: 0;
	margin: 0;
}

/*-----------------------------------------------------------------ここから下は使ってない*/
.nextbtn {
	width:40px;
	height:180px;
	display: block;
	text-indent:-9999px;
	position:absolute;
	top:10px;
	right:10px;
	background:url(../images/scrollban_next.gif) no-repeat;
}

.backbtn {
	width:40px;
	height:180px;
	display: block;
	text-indent:-9999px;
	position:absolute;
	top:10px;
	left:10px;
	background:url(../images/scrollban_prev.gif) no-repeat;
}
.nextbtn.inactive,
.backbtn.inactive {
	opacity : 0.3;
}