@charset "utf-8";


/* ===== Import Files ===== */

@import 'common.css';
@import 'header.css';
@import 'main.css';
@import 'module.css';
@import 'footer.css';



/* ===== picture book ===== */
#mainArea #contentsArea h4 {
padding-bottom: 1em;
}


#mainArea #contentsArea div.pictureBook {
margin-bottom: 1.5em;
}

#mainArea #contentsArea div.pictureBook:after{display:block; visibility:hidden; clear:both; height:0; content:".";}
#mainArea #contentsArea div.pictureBook{display:inline-block;}
#mainArea #contentsArea div.pictureBook{display:block;}

#mainArea #contentsArea p.bookCover {
width: 170px;
float: left;
clear: left;
}



#mainArea #contentsArea p.bookCover a img {
border: 1px solid #888;
}

#mainArea #contentsArea p.bookCover a:hover img {
border: 1px solid #5c0;
}

#mainArea #contentsArea .bookIntro {
width: 510px;
float: right;
padding-top:0.5em;
margin-right:45px;
border-top: 1px dotted #888;
}

#mainArea #contentsArea .bookIntro h2 {
font-size: 1.2em;
}

#mainArea #contentsArea .bookIntro p.intro {
margin-bottom: 1em;
}

#mainArea #contentsArea .bookIntro p.dateOfIssue {
font-size: 0.9em;
color: #888;
}

#mainArea #contentsArea #pictureBookDetail {
position: relative;
width: 100%;
text-align: center;

}

#mainArea #contentsArea #pictureBookDetail:after{display:block; visibility:hidden; clear:both; height:0; content:".";}
#mainArea #contentsArea #pictureBookDetail{display:inline-block;}
#mainArea #contentsArea #pictureBookDetail{display:block;}

#mainArea #contentsArea #pictureBookDetail h2 {
display: none;
}



#mainArea #contentsArea #pictureBookDetail p#pictureBookStory {
text-align: left;
padding: 1em 0 2em 0;
width: 500px;
margin: 0 auto 0;
}


#mainArea #contentsArea #pictureBookDetail #pictureBookAction li {
width: 140px;
float: left;
list-style: none;
margin: 0;
padding: 0;
text-align: center;
}


#mainArea #contentsArea #pictureBookDetail p.actionStart,
#mainArea #contentsArea #pictureBookDetail p.actionNext{
position: absolute;
top:90px;
right: 0;
width:156px;
text-align: right;
}

#mainArea #contentsArea #pictureBookDetail p.actionBack{
position: absolute;
top:90px;
left:　0;
width:156px;
text-align: left;
}

#mainArea #contentsArea #pictureBookDetail p.actionStop{

top:350px;
width:100%;
text-align: center;
}