/*=============================================================================================================================

// story.css

==============================================================================================================================*/

/* common
==============================================================================================================================*/

body {
	margin:0;
	padding:0;
	background:url(../story/img/bg.jpg) 0 0;
}

.story-container{
	width:682px;
	margin:0 auto 0 0;
}

.story-common-btn{
	text-indent:-9999px;
	font-size:0.1px;
	line-height:0.1px;
	display:block;
	position:absolute;
	right:0;
	top:0;
}

/* common-btn
==============================================================================================================================*/
.story-close{width:74px; height:17px; background:url(../story/img/colse-btn001.jpg) 0 0 no-repeat; top:42px; right:77px;} /* window close*/
a.story-close:hover{width:74px; height:17px; background:url(../story/img/colse-btn001.jpg) 0 -17px no-repeat; top:42px; right:77px;} /* window close:hover*/

.story-pageback{width:147px; height:23px; background:url(../story/img/page_back_001.jpg) 0 0 no-repeat; top:0; right:98px;} /* page back*/
a.story-pageback:hover{width:147px; height:23px; background:url(../story/img/page_back_001.jpg) 0 -23px no-repeat; top:0; right:98px;} /* page back:hover*/

.story-pageback-p02{width:147px; height:23px; background:url(../story/img/page_back_001.jpg) 0 0 no-repeat; top:253px; right:78px;} /* page back p02*/
a.story-pageback-p02:hover{width:147px; height:23px; background:url(../story/img/page_back_001.jpg) 0 -23px no-repeat; top:253px; right:78px;} /* page back p02:hover*/

.story-pageback-p03{width:147px; height:23px; background:url(../story/img/page_back_001.jpg) 0 0 no-repeat; top:246px; right:78px;} /* page back p02*/
a.story-pageback-p03:hover{width:147px; height:23px; background:url(../story/img/page_back_001.jpg) 0 -23px no-repeat; top:246px; right:78px;} /* page back p02:hover*/

.story-pageback-p04{width:147px; height:23px; background:url(../story/img/page_back_001.jpg) 0 0 no-repeat; top:275px; right:86px;} /* page back p02*/
a.story-pageback-p04:hover{width:147px; height:23px; background:url(../story/img/page_back_001.jpg) 0 -23px no-repeat; top:275px; right:86px;} /* page back p02:hover*/

/* header
==============================================================================================================================*/

.story-header{
	width:682px;
	height:248px;
	margin:0;
	padding:0;
	position:relative;
	background:url(../story/img/story_header_bg_001.jpg) 0 0 no-repeat;
}
.story-header-box{
	position:absolute;
	left:0;
	top:0;
	display:block;
}

.story-header-navibox{
	text-indent:-9999px;
	font-size:0.1px;
	line-height:0.1px;
	display:block;
	position:absolute;
	left:0;
	top:0;
}		

/* header-bg
==============================================================================================================================*/
.story-header-p01{background:url(../story/img/story_header_bg_002.jpg) 0 0 no-repeat;}
.story-header-p02{height:130px; background:url(../story/img/story_header_bg_003.jpg) 0 0 no-repeat;}
.story-header-p03{height:175px; background:url(../story/img/story_header_bg_004.jpg) 0 0 no-repeat;}
.story-header-p04{height:140px; background:url(../story/img/story_header_bg_005.jpg) 0 0 no-repeat;}

/* page-navi
==============================================================================================================================*/
.story-index-nv01{top:121px; left:39px;}
.story-index-nv01-p01{top:135px; left:36px;}
.story-index-nv01-p02{top:102px; left:56px;}
.story-index-nv01-p03{top:132px; left:56px;}
.story-index-nv01-p04{top:112px; left:48px;}

.story-index-nv02{width:74px; height:23px; top:121px; left:159px; background:url(../story/img/page_navi_002.jpg) 0 0 no-repeat;}
a.story-index-nv02:hover{background-position:0 -23px;}

.story-index-nv02-p01{width:54px; height:23px; top:135px; left:140px; background:url(../story/img/page_navi_002.jpg) 0 -1px no-repeat;}
a.story-index-nv02-p01:hover{background-position:0 -24px;}

.story-index-nv02-p02{width:54px; height:23px; top:102px; left:159px; background:url(../story/img/page_navi_002.jpg) 0 -1px no-repeat;}
a.story-index-nv02-p02:hover{background-position:0 -24px;}

.story-index-nv02-p03{width:54px; height:23px; top:132px; left:159px; background:url(../story/img/page_navi_002.jpg) 0 -1px no-repeat;}
a.story-index-nv02-p03:hover{background-position:0 -24px;}

.story-index-nv02-p04{width:54px; height:23px; top:112px; left:151px; background:url(../story/img/page_navi_002.jpg) 0 -1px no-repeat;}
a.story-index-nv02-p04:hover{background-position:0 -24px;}

.story-index-nv03{top:135px; left:194px;}
.story-index-nv03-p02{top:102px; left:213px;}
.story-index-nv03-p03{top:132px; left:213px;}
.story-index-nv03-p04{top:112px; left:205px;}

/* inner
==============================================================================================================================*/

.story-inner{
	width:682px;
	height:552px;
	margin:0;
	padding:0;
	position:relative;
	background:url(../story/img/story_inner_bg_001.jpg) 0 0 no-repeat;
}

.story-inner-box{
	position:absolute;
	left:0;
	top:0;
	display:block;
}
.story-inner-btn{
	text-indent:-9999px;
	font-size:0.1px;
	line-height:0.1px;
	display:block;
	position:absolute;
	left:0;
	top:0;	
}

/* inner-bg
==============================================================================================================================*/
.story-inner-p01{height:545px; background:url(../story/img/story_inner_bg_002.jpg) 0 0 no-repeat;}
.story-inner-p02{height:574px; background:url(../story/img/story_inner_bg_003.jpg) 0 0 no-repeat;}
.story-inner-p03{height:576px; background:url(../story/img/story_inner_bg_004.jpg) 0 0 no-repeat;}
.story-inner-p04{height:562px; background:url(../story/img/story_inner_bg_005.jpg) 0 0 no-repeat;}

/* page-title
==============================================================================================================================*/
.story-page-title001{left:39px;	top:171px;} /* 絵本のお話 <目次> */
.story-page-title002{left:37px;	top:183px;} /* とびだスゴロク！ */

/* new-mark
==============================================================================================================================*/
.new-mark01{left:356px; top:193px; z-index:1000;}
.new-mark02{left:356px; top:321px; z-index:1001;}
.new-mark03{left:356px; top:466px; z-index:1002;}

/* page-inner-btn
==============================================================================================================================*/
.index-btn001{width:566px; height:137px; background:url(../story/img/story-index-btn001.jpg) 0 0 no-repeat; left:39px; top:0;} /* とびだスゴロク！ */
a.index-btn001:hover{background-position:0 -137px;} /* とびだスゴロク！ btn:over */

.index-btn002{width:566px; height:154px; background:url(../story/img/story-index-btn002.jpg) 0 0 no-repeat; left:39px; top:137px;} /* キッドとガーリー */
a.index-btn002:hover{background-position:0 -154px;} /* キッドとガーリー btn:over */

.index-btn003{width:566px; height:130px; background:url(../story/img/story-index-btn003.jpg) 0 0 no-repeat; left:39px; top:291px;} /* ドクトルとシルバ */
.index-btn003-off{width:566px; height:130px; background:url(../story/img/story-index-btn003.jpg) 0 -260px no-repeat; left:39px; top:291px;} /* ドクトルとシルバ close*/
a.index-btn003:hover{background-position:0 -130px;} /* ドクトルとシルバ btn:over */

.index-btn004{width:566px; height:131px; background:url(../story/img/story-index-btn004.jpg) 0 0 no-repeat; left:39px; top:421px;} /* スリーセブンとニンゾー */
.index-btn004-off{width:566px; height:131px; background:url(../story/img/story-index-btn004.jpg) 0 -262px no-repeat; left:39px; top:421px;} /* スリーセブンとニンゾー close*/
a.index-btn004:hover{background-position:0 -131px;} /* スリーセブンとニンゾー btn:over */

/* page-inner-txt
==============================================================================================================================*/
.p01-inner-txt001{top:33px; left:36px;}

.p02-inner-txt001{top:24px; left:56px;}
.p02-inner-txt002{top:102px; left:56px;}
.p02-inner-txt003{top:332px; left:186px;}
.p02-inner-txt004{top:420px; left:186px;}

.p03-inner-txt001{top:9px; left:293px;}
.p03-inner-txt002{top:78px; left:293px;}
.p03-inner-txt003{top:314px; left:54px;}
.p03-inner-txt004{top:389px; left:54px;}

.p04-inner-txt001{top:24px; left:47px;}
.p04-inner-txt002{top:101px; left:47px;}
.p04-inner-txt003{top:331px; left:214px;}
.p04-inner-txt004{top:400px; left:214px;}


/* footer
==============================================================================================================================*/

.story-footer{
	width:682px;
	height:80px;
	margin:0;
	padding:0;
	position:relative;
	background:url(../story/img/story_bottom_bg_001.jpg) 0 0 no-repeat;
}
/* footer-bg
==============================================================================================================================*/
.story-footer-p01{height:54px; background:url(../story/img/story_bottom_bg_002.jpg) 0 0 no-repeat;}
.story-footer-p02{height:320px; background:url(../story/img/story_bottom_bg_003.jpg) 0 0 no-repeat;}
.story-footer-p03{height:300px; background:url(../story/img/story_bottom_bg_004.jpg) 0 0 no-repeat;}
.story-footer-p04{height:333px; background:url(../story/img/story_bottom_bg_005.jpg) 0 0 no-repeat;}