@charset "utf-8";
/* ------- css list created date 2013
globanNavArea
contents
layer
--------------------- */


/* -------------------------------
globalNavArea
------------------------------- */
#globalNavArea{
	position: relative;
	width:100%;
	height:71px;
	text-align:left;
	background:#ebebeb url(../images/gnav_bg.png) repeat-x left bottom;
}
#globalNavArea .wrapper{
	margin:0 auto;
	width:960px;
}
#globalNav{
	border-top: #515454 solid 1px;
	border-bottom: #515454 solid 1px;
	background-color:#262929;
}
#globalNav ul:after {/*for modern browser*/
	content: " ";
	display: block;
	height: 0;
	clear: both;
	line-height:0;
	visibility: hidden;
}
#globalNav ul{
	margin:0 auto;
	width: 902px;
	list-style-type: none;
	zoom:1;
}
#globalNav li{
	float: left;
	height:44px;
}
#globalNav li a,
#globalNav li span{
	display:block;
	height:44px;
	background-repeat:no-repeat;
	background-position: left top;
	font-size:10px !important;
	line-height:12px !important;
	text-align:left !important;
	text-indent:100% !important;
	white-space:nowrap !important;
	overflow:hidden !important;
	word-wrap: normal !important;
}
#globalNav li a:hover,
#globalNav li a.selected{
	background-position: left 100%;
}
#globalNav li span{
	background-position: left -44px;
}
#btnHome a{
	width:104px;
	background: url(../images/btn_gnav_home.png);
}
#btnChapter1 a{
	width:140px;
	background: url(../images/btn_gnav_chapter1.png);
}
#btnChapter2 a,
#btnChapter2 span{
	width:140px;
	background: url(../images/btn_gnav_chapter2.png);
}
#btnChapter3 a,
#btnChapter3 span{
	width:140px;
	background: url(../images/btn_gnav_chapter3.png);
}
#btnPhotobook a,
#btnPhotobook span{
	width:149px;
	background: url(../images/btn_gnav_photobook.png);
}
#btnEssay a,
#btnEssay span{
	width:107px;
	background: url(../images/btn_gnav_essay.png);
}
#btnProfile a{
	width:122px;
	background: url(../images/btn_gnav_profile.png);
}


/* -------------------------------
contents
------------------------------- */
#contents{
	position: relative;
	padding-top:40px;
	min-width:960px;
	text-align:center;
}
#contents .wrapper{
	position: relative;
	padding-bottom:80px;
	margin: 0 auto;
	width:840px;
	text-align:left;
	line-height:1.8;
	color:#101010;
}
#contents .wrapper a{
	text-decoration: underline;
}
#layout-two-column{
	position: relative;
	margin: 0 auto;
	width:960px;
	text-align:left;
	line-height:1.8;
}
#layout-two-column #leftColumn{
	padding-bottom:80px;
	float:left;
	width:689px;
}
.iphone #layout-two-column #leftColumn,
.ipad #layout-two-column #leftColumn,
.android #layout-two-column #leftColumn{
	margin-left:20px !important;
}
#layout-two-column #rightColumn{
	float:right;
	width:212px;
	line-height:1.4;
}


/* -------------------------------
rightColumn
------------------------------- */
#layout-two-column #rightColumn nav{
	background: url(../images/sidenav_tp.png) no-repeat left top;
}
#layout-two-column #rightColumn nav ul{
	margin:0;
	padding:50px 0;
	background: url(../images/sidenav_bm.png) no-repeat left bottom;
	list-style-type: none;
	font-size:12px;
}
#layout-two-column #rightColumn nav ul li{
	margin:12px 0;
}
#layout-two-column #rightColumn nav ul li a{
	padding:4px 5px 4px 8px;
	display: block;
}
#layout-two-column #rightColumn nav ul li.current a{
	padding:4px 5px 4px 8px;
	display: block;
	background: url(../images/sidnav_list_bg.png) no-repeat left 50%;
}
#layout-two-column #rightColumn .btnTimeline{
	margin:23px auto 10px;
	width:202px;
	height:41px;
}
#layout-two-column #rightColumn .btnIndexBack{
	margin:23px auto 0;
	width:202px;
	height:45px;
}
#layout-two-column #rightColumn .btnTimeline + .btnIndexBack{
	margin-top:15px !important;
}
#sidebar{
	position: relative;
	width:212px;
}
/*.floating-widget.floating {
    position: fixed;
    top: 0;
}
.floating-widget.pinned-bottom {
    position: absolute;
    bottom: 0;
    _position: static;
}/*

/* -------------------------------
story
------------------------------- */
.story article footer{
	margin-top:15px;
}
.story article footer .btnPrev{
	float:left;
	padding-right: 1em;
}
.story article footer .btnPrev a{
	display: block;
	padding:4px 0 4px 25px;
	background: url(../images/icon_btn_arrow_prev.png) no-repeat left 4px;
	line-height: 1.4;
}

.story article footer .btnNext{
	float:right;
	padding-left: 1em;
}
.story article footer .btnNext a{
	display: block;
	padding:4px 25px 4px 0;
	background: url(../images/icon_btn_arrow_next.png) no-repeat right 4px;
	text-align: right;
	line-height: 1.4;
}
.fontMincho{
	font-family:"ヒラギノ明朝 Pro W6", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
}
.story .txtBlock a{
color:#5da9b9 !important;
text-decoration: underline;
}
/* -------------------------------
modal
------------------------------- */
html,
body {
	height: 100%;
	margin: 0px;
	padding: 0px;
}
div#modal {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top:0;
	z-index:999;
}
div#modal div.background {
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: #fff;
	opacity: 0.75;
	-ms-filter: "alpha(opacity=75)";
    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=1, style=0, opacity=75);
}
div#modal div.container {
	position: relative;
	width: 610px;
	box-shadow: 0px 0px 10px #222;
	-moz-box-shadow: 0px 0px 10px #222; /* Firefox */
	-webkit-box-shadow: 0px 0px 10px #222; /* Chrome, Safari */
	-moz-border-radius: 4px;/*for Firefox*/
    -webkit-border-radius: 4px;/*for Safari and chrome*/
    border-radius: 4px;
}
#modalContentsArea{
	overflow-y:auto;
	overflow-x:hidden;
	background: #252929;
}
#modalHeader{
	position: relative;
	width:610px;
	height:46px;
}
#modalHeader #modalTab01{
	position: absolute;
	top:0;
	left:0;
	cursor: pointer;
	-moz-border-radius: 4px 0 0 0;/*for Firefox*/
    -webkit-border-radius: 4px 0 0 0;/*for Safari and chrome*/
    border-radius: 4px 0 0 0;
}
#modalHeader #modalTab01 img{
	-moz-border-radius: 4px 0 0 0;/*for Firefox*/
    -webkit-border-radius: 4px 0 0 0;/*for Safari and chrome*/
    border-radius: 4px 0 0 0;
}
#modalHeader #modalTab02{
	position: absolute;
	top:0;
	left:282px;
	cursor: pointer;
}
#modalHeader #modalClose{
	position: absolute;
	top:0;
	right:0;
	cursor: pointer;
	-moz-border-radius:0 4px 0 0;/*for Firefox*/
    -webkit-border-radius:0 4px 0 0;/*for Safari and chrome*/
    border-radius:0 4px 0 0;
}
#modalHeader #modalClose img{
	-moz-border-radius:0 4px 0 0;/*for Firefox*/
    -webkit-border-radius:0 4px 0 0;/*for Safari and chrome*/
    border-radius:0 4px 0 0;
}
#modalHeader .tabOn{
	cursor: default !important;
}
#modalHeader .tabOn img{
	filter: alpha(opacity=0);
	-moz-opacity:0;
	opacity:0;
}
#modalFooter{
	position: absolute;
	bottom: 0;
	left:0;
	-moz-border-radius:0 0 4px 4px;/*for Firefox*/
    -webkit-border-radius:0 0 4px 4px;/*for Safari and chrome*/
    border-radius:0 0 4px 4px;
}
#modalFooter img{
	-moz-border-radius:0 0 4px 4px;/*for Firefox*/
    -webkit-border-radius:0 0 4px 4px;/*for Safari and chrome*/
    border-radius:0 0 4px 4px;
}