@charset "utf-8";

html{
	overflow-y:scroll;
	margin:0;
	padding:0;
}

body{
	background:#fff url(images/detail_bg.png) repeat-x;
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:90%;
	color:#333;
	margin:0;
	padding:0;
	position: relative;
}
body#flash{
	background:#fff url(images/bg_flash.png) repeat-x;
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:90%;
	color:#484848;
	margin:0;
	padding:0;
	position: relative;
}


a{
	color:#484848;
	text-decoration:none;
	cursor:pointer;
}
a:hover{
	color:#0075C2;
	text-decoration:underline;
}
a img{
	border:none;
}

.txtred{
	color:#FB120E;}



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

　ヘッダー 一覧用

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

#header_list{
	margin:0 auto;
	padding:0 0 0;
	overflow:hidden;
	background:#fff url(images/story_bg_index.png) repeat-x;
	height:114px;
}
#header_list div{
	margin:0 auto;
	padding:0 0 0;
	overflow:hidden;
	width:880px;
	position:relative;
}
#header_list h1{
	margin:0 0 0 0;
	padding:0 0 0;
	overflow:hidden;
	width:880px;
}
#header_list p{
	margin:0 0 0 0;
	padding:0 0 0;
	overflow:hidden;
	width:83px;
	height:30px;
	top:49px;
	left:766px;
	position:absolute;
}

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

　メイン 一覧用

-------------------------------------- */
#index_main{
	margin:40px auto 0;
	padding:0;
	width:840px;
	overflow:hidden;
	background:url(images/index_bg.png) repeat-y;
}
#index_main .pickup{
	margin:0 auto 0;
	padding:0;
	width:840px;
	overflow:hidden;
	background:url(images/index_boad_head.png) top no-repeat;
}
#index_main .category{
	margin:0 auto 0;
	padding:0 0 15px;
	width:840px;
	overflow:hidden;
	background:url(images/index_boad_bottom.png) bottom no-repeat;
}
#index_main h3{
	margin:14px 0 0 40px;
	padding:0 0;
	width:170px;
}
#index_main ul{
	margin:9px 0 25px 28px;
	padding:0 0;
	width:786px;
	overflow:hidden;
}
#index_main li{
	margin:0 0 15px 0;
	padding:0 0 3px;
	width:786px;
	overflow:hidden;
	background: url(images/index_bg_whitebox.png) bottom left no-repeat;
	display:table;
}
#index_main li:before {content:"."; display:block; float:left; width:0px; height:90px; opacity:0;}

#index_main li div{
	margin:0 0 0 0;
	padding:7px 0;
	width:786px;
	overflow:hidden;
	background: url(images/index_bg_whiteboxtop.png) top left no-repeat;
}
#index_main li p{
	display:table-cell;
}
#index_main li p.pin{
	width:31px;
	padding:0 0 5px 2px;
	vertical-align:top;
}
#index_main li p.pht{
	width:73px;
	padding:0 0 0 9px;
	vertical-align:top;
}
#index_main li p.pht img{
	width:71px;
	height:71px;
	border:1px solid #6DB323;
}
#index_main li p.title{
	padding:0 16px 0 8px;
	vertical-align:middle;
	line-height:1.4;
	font-size:120%;
}



/**/

#index_main dl{
	margin:9px 0 0 28px;
	padding:0 0;
	width:786px;
	overflow:hidden;
}
#index_main dt{
	margin:0 0 15px 0;
	padding:0 0 3px;
	width:786px;
	overflow:hidden;
	background: url(images/index_bg_whitebox.png) bottom left no-repeat;
	cursor:pointer;
}
#index_main dt.open{
	margin:0 4px 0 0;
	padding:0 20px 0;
	width:742px;
	overflow:hidden;
	background:#fff url(images/index_dotline.png) bottom center no-repeat;
	background-color:#fff;
}
#index_main dt:before {content:"."; display:block; float:left; width:0px; height:65px; opacity:0;}

#index_main dt div{
	margin:0 0 0 0;
	padding:0 0;
	width:786px;
	overflow:hidden;
	background: url(images/index_bg_whiteboxtop.png) top left no-repeat;
}
#index_main dt h4{
	background:url(images/index_yaji.png) 0 50% no-repeat;
	padding:0 0 0 55px;
	margin:20px 0 0 20px;
	font-weight:normal;
	font-size:120%;
}
#index_main dt.open h4{
	background:#fff url(images/index_yaji_open.png) 0 50% no-repeat;
	margin:20px 0 0 0;
}
#index_main dd{
	background:#fff url(images/index_bg_whitebox.png) bottom left no-repeat;
	margin:0 4px 15px 0;
	padding:10px 20px 20px 74px;
	overflow:hidden;
	font-size:120%;
	width:688px;
	display:none;
}
#index_main dd a{
	color:#007FFF;
	text-decoration:underline;
	background:url(images/index_icon_ten.png) 0 10px no-repeat;
	padding:3px 0 3px 15px;
	margin:5px 0;
	display:block;
}




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

　ヘッダー

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

#header{
	margin:0 auto;
	padding:0 0 0;
	overflow:hidden;
	width:888px;
	background:url(images/detail_main_top_bg.png) top center no-repeat;
	height:186px;
	position:relative;
}
#header div{
	margin:0 auto;
	padding:0 0 0;
	overflow:hidden;
	width:840px;
}
#header h1{
	margin:25px 0 0 6px;
	padding:0 0 0;
	overflow:hidden;
	width:530px;
	float:left;
}
#header h1 img{
	display:none;
}
#header p{
	position:absolute;
	margin:0;
	top:49px;
	right:40px;
	padding:0 0 0;
	overflow:hidden;
	width:83px;
}



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

　メイン

-------------------------------------- */
#main{
	margin:0 auto 0;
	padding:0 50px 0 50px;
	clear:both;
	width:740px;
	overflow:hidden;
	background:url(images/detail_main_bg.png) top center repeat-y
}
#main h3{
	margin:14px auto;
	padding:18px 0 18px 38px;
	background:url(images/index_icon_blue.png) 0px 18px no-repeat;
	font-size:150%;
	border-bottom:1px solid #393987;
}
body.blue_pin #main h3{
	background:url(images/index_icon_blue.png) 0px 0px no-repeat;
}
body.green_pin #main h3{
	background:url(images/index_icon_green.png) 0px 0px no-repeat;
}
body.red_pin #main h3{
	background:url(images/index_icon_red.png) 0px 0px no-repeat;
}
body.yellow_pin #main h3{
	background:url(images/index_icon_yellow.png) 0px 0px no-repeat;
}

#main h4{
	margin:0 0 10px;
	padding:0;
	font-size:110%;
	clear:both;
}
#main .txt{
	margin:0 0 30px 0;
	padding:0;
	line-height:1.8;
	clear:both;
}
#main .pht{
	margin:0 0 40px 0;
	padding:0;
	clear:both;
}
#main .align_left{
	text-align:left;
}
#main .align_center{
	text-align:center;
}
#main .align_right{
	text-align:right;
}

#main img.left{
	margin:5px 20px 20px 0;
	padding:0;
	float:left;
}
#main img.right{
	margin:5px 0 20px 10px;
	padding:0;
	float:right;
}
#main img.spl{
	margin:0 0 0 10px;
	padding:0;
}
#main img.spc{
	margin:0 10px 0 10px;
	padding:0;
}
#main img.spr{
	margin:0 10px 0 0;
	padding:0;
}


.btn{
	margin:0 0 35px 0;
	padding:130px 0 0 0;
	clear:both;
	text-align:center;
	background:url(images/detail_main_bottom_bg.png) center top no-repeat;
}

body.index .btn{
	margin:0 0 35px 0;
	padding:35px 0 0 0;
	clear:both;
	text-align:center;
	background:none;
}


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

　フッター

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

#footer{
	margin:0 auto;
	padding:10px 0;
	overflow:hidden;
	text-align:center;
	border-top:2px solid #32327C;
}

#footer h2{
	margin:0 0 0 0;
	padding:0;
	font-size:75%;
	font-weight:normal;
}





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

	misc.

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


.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix {
	/*overflow:hidden;*/
	zoom:1;
}


/*rollover*/
.over{}
.hover{}

strong{	
	font-weight:bold;
}




/* --------------------------------------
　
　FLASH
　ヘッダー

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

#flash #header{
	margin:0 auto;
	padding:0 0 0;
	overflow:hidden;
	width:895px;
	background:url(images/story_bg.png) top center no-repeat;
}
#flash #header div{
	margin:0 auto;
	padding:0 0 0;
	overflow:hidden;
	width:800px;
}
#flash #header h1{
	margin:11px 0 3px 0;
	padding:0 0 0;
	overflow:hidden;
	width:654px;
	float:left;
}
#flash #header p{
	margin:47px 0 0 0;
	padding:0 0 0;
	overflow:hidden;
	width:83px;
	float:right;
}

/* --------------------------------------
　
　FLASH
　メイン

-------------------------------------- */
#flash #main{
	margin:0 auto 0;
	padding:0 0 0;
	clear:both;
	width:800px;
	overflow:hidden;
}
#flash #main div{
	margin:50px auto 0;
	width:800px;
	height:500px;
	background:#ccc;
}