/*--

	ストーリー・キャラクター下
	#Story

====================================================== --*/

#Story .contents .story{
	text-align:center;
	margin:0px 0px 30px 0px;
	padding:0;
}
#Story .story .book {
	width:720px;
	margin-right:-10px;
	margin-bottom:-20px;
	overflow:hidden;
}
#Story .story .book .info {
	float:left;
	margin:0 10px 20px 0;
	width:230px;
}
/*#Story .story .book .info.last_line {
	margin:0 28px 0 0;
}*/
#Story .story .book .info p {
	margin:0;
	padding:0;
}
#Story .story .book .info p.cover {
	background:url(../../images/story/bg_book.png) no-repeat center bottom;
	height:190px;
	cursor:pointer;
}
#Story .story .book .info dl {
	margin-top:-7px;
	padding:0 15px;
}
#Story .story .book .info dt {
	text-align:left;
	font-size:16px;
}
#Story .story .book .info dd {
	padding:7px 7px 0 0;
	text-align:left;
}
#Story .story .book .info .btn_read {
	background:url(../../images/story/bg_book_btn.png) no-repeat left top;
	margin:10px 0 0 0;
	padding:5px 0 7px 0;
}
#Story .story .book .info .btn_read a {
	cursor:pointer;
}
#Story .attention {
	background-color:#E5E5E5;
	padding:15px 20px;
	margin:0 30px 50px;
}


#Story .eventBn{
	text-align:center;
	margin:0px 0px 30px;
}
#Story .storyList{
	background:url(../../images/story/story.jpg) no-repeat left top;
	width:709px;
	height:157px;
	margin:0px auto 50px;
	font-size:1px;
	text-align:center;
	padding:25px 0px 0px;
}
#Story .storyList ul{
	font-size:1px;
	height:75px;
	line-height:1px;
}
#Story .storyList li{
	font-size:1px;
	line-height:1px;
	display:inline-block;
	background:url(../../images/story/story_bg.jpg) no-repeat left bottom;
	padding:0px 0px 15px;
	width:165px;
	height:55px;
	margin:0px 4px 5px;
	/display:inline;
}
#Story .storyList li img{
	vertical-align:bottom;
}

/*-- キャラ一覧 --*/
/*-- ------------------------------------------------- --*/
#Story .characterList{
	height:129px;
	width:738px;
	margin:0px 0px 10px;
}
#Story .characterList li{
	width:100px;
	float:left;
	margin:0px 1px 0px 0px;
	background:url(../../images/story/tab_bg.jpg) no-repeat left bottom;
	height:129px;
}
#Story .characterList li a{
	display:block;
	width:100px;
	height:114px;
	position:relative;
}
#Story .characterList li a img{
	position:relative;
	z-index:10;
	display:none;
}
#Story .characterList li a img.arrow{
	position:absolute;
	z-index:1;
	left:29px;
	bottom:-26px;
	bottom:0px;
}
@media only screen and (min-width: 601px) {
	#Story .characterList li a:hover img{
		display:block;
	}
}
#Story .characterList li a.current img{
	display:block;
}

#Story .characterList li.chara01 a{
	background:url(../../images/story/tab_01.jpg) no-repeat left top;
}
#Story .characterList li.chara02 a{
	background:url(../../images/story/tab_02.jpg) no-repeat left top;
}
#Story .characterList li.chara03 a{
	background:url(../../images/story/tab_03.jpg) no-repeat left top;
}
#Story .characterList li.chara04 a{
	background:url(../../images/story/tab_04.jpg) no-repeat left top;
}
#Story .characterList li.chara05 a{
	background:url(../../images/story/tab_05.jpg) no-repeat left top;
}
#Story .characterList li.chara06 a{
	background:url(../../images/story/tab_06.jpg) no-repeat left top;
}
#Story .characterList li.chara07 a{
	background:url(../../images/story/tab_07.jpg) no-repeat left top;
}

#Story .character{
	height:458px;
	width:713px;
	background:url(../../images/story/chara_bg.jpg) no-repeat left top;
	margin: 0;
	position:relative;
}


#Story .character .prev{
	width:25px;
	height:43px;
	overflow:hidden;
	position:absolute;
	left:-22px;
	top:200px;
	z-index:100;
}
#Story .character .prev a,
#Story .character .next a{
	position:absolute;
	width:25px;
	height:43px;
	position:absolute;
	top:0px;
}
#Story .character .prev a{
	right:-25px;
}
#Story .character .next a{
	left:0px;
}
#Story .character .next{
	width:25px;
	height:43px;
	overflow:hidden;
	position:absolute;
	right:-23px;
	top:200px;
	z-index:100;
}


#Story .character li{
	height:458px;
	width:713px;
	position:absolute;
	z-index:1;
	display:none;
}
#Story .character li.current{
	z-index:10;
	display:block;
}

#Story .character li .img{
	margin:19px 0px 0px 3px;
	float:left;
	width:313px;
	height:400px;
}
#Story .character li dl{
	width:320px;
	float:right;
	margin:14px 19px 0px 0px;
}

#Story .character li dl dd dl{
	float:none;
	margin:0px;
}
#Story .character li dl dd dl dt{
	color:#321900;
	line-height:1.4em;
	text-shadow:1px 1px rgba(0,0,0,0.3);
	background:url(../../images/story/chara_line.gif) repeat-x left top;
	margin-top: 0;
	padding:7px 0px 0px 0px;
}
#Story .character li dl dd dl dt:first-child{
	background:none;
	padding:0px;
}
#Story .character li dl dd dl.ex dt{
	padding:12px 0px 0px 0px;
}
#Story .character li dl dd dl dd{
	color:#321900;
	padding:0px 0px 0px 85px;
	margin:-1.4em 0px 5px 0px;
	line-height:1.4em;
	text-shadow:1px 1px rgba(0,0,0,0.3);
}
#Story .character li dl dd dl.ex dd{
	margin:-1.4em 0px 10px 0px;
}
#Story .character li dl dd dl.ex + p{
	background:url(../../images/story/chara_line.gif) repeat-x left top;
	padding:12px 0px 0px 0px;
}
#Story .character li dl dd p{
	padding:7px 0px 0px 0px;
	color:#321900;
	margin:0px;
	line-height:1.6em;
	text-shadow:1px 1px rgba(0,0,0,0.3);
}


/*-- ページ下部バナー --*/
/*-- ------------------------------------------------- --*/
.bnr {
	background:url(../../images/story/bg_btn_schedule.jpg) repeat-y center top;
	padding:38px 30px;
	text-align:center;
	margin:50px 0 0 0;
}


#Story_book #sns {
	width:700px;
	margin:10px auto 20px;
	text-align:right;
}
#Story_book #sns ul {
	float: right;
}
#Story_book #sns li {
	float: left;
}
#Story_book #sns:after,
.main #sns ul:after{
	content: '';
	display: block;
	clear: both;
}
#Story_book .close {
	margin:20px auto;
	background-color:#FFFFFF;
	border:1px solid #cccccc;
	width:150px;
}
#Story_book .close a {
	display:block;
	padding:15px;
	text-decoration:none;
	color:#000000;
	cursor:pointer;
}