@charset "utf-8";
/* CSS Document */

/* 初期化[全体]
-------------------------------------------------------------------- */
/*基本*/
html, body, p, div, article, section, aside, tr, td, th, form, input, textarea, select, h1, h2, h3, h4, h5, h6, h7, hr{
	margin: 0;
	padding: 0;
}
h1, h2, h3, h4, h5, h6, h7 {
	font-weight: normal;
	font-size: 14px;
	line-height: 1.5em;
}
table, tr, td, th{
	word-break: break-all;
}

/*テーブル*/
table{
	margin: 0;
}

/*インライン*/
img, span, strong{
	border: none;
	margin: 0;
}
img{
	vertical-align: text-bottom;
	height: auto;
}
em {
	font-style: normal;
	font-weight:normal;
}

/*リスト*/
ul, ol, dl, dd, dt, li{
	margin: 0;
	padding: 0;
	list-style-type: none;
}

.clearfix:after {
    content:" ";
    display:block;
    clear:both;
}

/* PC SP 切替
-------------------------------------------------------------------- */
.pc { display: inline-block;}
.pcCont { display: block;}
.sp,.spCont { display: none;}

@media only screen and (max-width: 768px) {
	body {
		min-width: 320px;
	}
	img{
		width: auto;
		max-width: 100%;
	}
	.pc,.pcCont { display: none;}
	.sp { display: inline-block;}
	.spCont { display: block;}
}

/* 基本[共通]
-------------------------------------------------------------------- */
html {
	font-size: 62.5%;
}
@font-face {
  font-family: "YuGothic M";
  src: local(Yu Gothic Medium);
}
body{
	color: #ffffff;
	font-family: "游ゴシック Medium", "Yu Gothic Medium", "YuGothic M", "游ゴシック体", YuGothic, "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック",Helvetica,Arial,Verdana,"sans-serif";
	font-size: 1.4em;
	line-height: 1.5em;
    background: #0b0e1b;
}
a{
	color: #008599;
	text-decoration: underline;
}
a:hover{
	opacity: 0.7;
	text-decoration: none;
}
a img{
	border: none;
}
a img:hover{
	opacity: 0.7;
}

/* 明朝体指定 */
.bookBox .detail .text dl dt,
.book02Box .content .text dl dt,
.bookBox .detail .text ul li a,
.book02Box .content ul li a,
.interviewBox .detailArea .btn a,
.interviewBox .detailArea dl.readBox dt,
.trialBox .detailArea .btn a,
.headerArea .navArea ul li a {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}




/* コンテンツ[レイアウト]
-------------------------------------------------------------------- */
/* 共通 */
.wrapper {
	margin: auto;
	box-sizing: border-box;
}
.content {
	width: 800px;
	margin: auto;
	box-sizing: border-box;
}
.contentArea {
	margin: auto;
	box-sizing: border-box;
    padding-bottom: 20px;
}

/* コンテンツ共通 */
.block {
}
.block .content.line {
    border-top: 1px solid #303445; 
}
.block .content.noLine {
}
.block .content {
    display: table;
	padding-top: 50px;
	padding-bottom: 50px;
}
.block .titleArea,
.block .detailArea {
    display: table-cell;
    vertical-align: top;
}
.block .titleArea {
    width: 150px;
}
.block .detailArea {
}
.block .textBox p + p {
	margin-top: 10px;
}

.block.reviewBox {
    background: #2f323d;
    padding: 40px 0;
    width: 100%;
}

/* ヘッダー */
.headerArea .content {
    position: relative;
    height: 650px;
    margin-bottom: 50px;
}
.headerArea .headGoHome {
    position: absolute;
    top: 20px;
    left: 0;
}
.headerArea .image {
    position: absolute;
    top: 100px;
    right: -12px;
}
.headerArea .imageBox .btn {
    width: 119px;
    height: auto;
    position: absolute;
    top: 440px;
    left: 360px;
}
.headerArea .imageBox .btn a img:hover {
    opacity: 1;
}
.headerArea .snsArea {
    text-align: center;
    width: 100%;
    position: absolute;
    bottom:0;
    left: 0;
}
.headerArea .navArea {
    position: absolute;
    top: 100px;
    left: 0;
}
.headerArea .navArea ul {
}
.headerArea .navArea ul li {
    border-right: 1px solid #303445;
	text-align: center;
    float: right;
}
.headerArea .navArea ul li:last-of-type {
    border-left: 1px solid #303445;
}
.headerArea .navArea ul li span {
    display: none;
}

/* SNS */
.snsArea {
	display: block;
	text-align: center;
	margin: auto;
	padding: 20px 0;
}
.snsArea ul {
	display: inline-block;
	vertical-align: middle;
}
.snsArea li {
	display: inline-block;
	vertical-align: middle;
	margin: 0 2px;
}

/* フッター */
.footerArea {
	text-align: center;
}
.footerArea .goTop {
	padding: 20px 20px 20px 20px;
}
.footerArea .footerBox {
	padding: 20px;
	border-top: 1px solid #bfbfbf;
	border-bottom: 1px solid #bfbfbf;
}
.footerArea .goIndex a {
	background: url(../images/go_index_arrow.png) no-repeat left center;
	background-size: auto 14px;
	color: #ffffff;
	padding-left: 15px;
	font-size: 1.6rem;
	text-decoration: none;
}
.footerArea .goIndex img {
	height: 15px;
	width: auto;
}
.footerArea .copy {
	background-color: #000000;
	padding: 10px;
	color: #ffffff;
}


/* 書籍 */
.bookBox {
	margin-top: 20px;
}
.bookBox .content {
	padding: 30px;
	display: block;
}
.bookBox .detail {
	width: 100%;
    display: table;
}
.bookBox .detail .image {
    width: 220px;
    text-align: left;
    display: table-cell;
	vertical-align: bottom;
}
.bookBox .detail .image img {
	width: 180px;
	height: auto;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
}
.bookBox .detail .text {
    padding-top: 20px;
	white-space: nowrap;
    display: table-cell;
	vertical-align: bottom;
}
.bookBox .detail .text dl dt {
	margin-bottom: 20px;
}
.bookBox .detail .text dl dt em {
	font-size: 3.0rem;
	display: block;
	font-weight: bold;
    margin-bottom: 10px;
}
.bookBox .detail .text dl dt span {
	font-size: 2.0rem;
    font-weight: bold;
}
.bookBox .detail .text dl dd {
	margin-bottom: 10px;
}
.bookBox .detail .text ul {
	display: block;
	margin-top: 20px;
}
.bookBox .detail .text ul li {
	display: inline-block;
	font-size: 0;
	width: 150px;
    font-size: 0;
}
.bookBox .detail .text ul li + li {
	margin-left: 10px;
}
.bookBox .detail .text ul li a {
	display: block;
	width: 100%;
	font-size: 1.4rem;
	padding: 10px;
	text-align: center;
	color: #ffffff;
	text-decoration: none;
	box-sizing: border-box;
	background: #467193;
    font-weight: bold;
}

.book02Box {
    background: #2f323d;
	text-align: center;
    margin-top: 0;
}
.book02Box .content {
	display: table;
	width: 800px;
}
.book02Box .content .detail {
	display: table-cell;
	vertical-align: top;
	width: 200px;
}
.book02Box .content .detail .image {
	width: 200px;
}
.book02Box .content .detail .image img {
	max-width: 100%;
	height: auto;
}
.book02Box .content .text {
	margin: 10px 0 0 0;
	padding-left: 30px;
	display: table-cell;
	vertical-align: bottom;
}
.book02Box .content .text dl {
	text-align: left;
}
.book02Box .content .text dl dt {
	margin-bottom: 20px;
}
.book02Box .content .text dl dt em {
	font-size: 3.0rem;
	font-weight: bold;
	display: block;
    margin-bottom: 10px;
}
.book02Box .content .text dl dt span {
	font-size: 2.0rem;
	display: block;
    font-weight: bold;
}
.book02Box .content ul {
	display: block;
	font-size: 0;
	margin-top: 20px;
}
.book02Box .content ul li {
	display: inline-block;
}
.book02Box .content ul li a {
	display: block;
	background: #467193;
	padding: 10px;
	text-align: center;
	margin-right: 10px;
	color: #ffffff;
	text-decoration: none;
	width: 250px;
	box-sizing: border-box;
	font-size: 1.6rem;
    font-weight: bold;
}
.book02Box .content .text {
	text-align: left;
}
.book02Box .content .text .txt {
	margin-top: 10px;
}


/* 内容紹介 */
.awardBox .detailArea .textBox .meta {
    text-align: right;
}

/* 内容紹介 */
.storyBox {
}

/* 著者プロフィール／メッセージ */
.profileBox .detailArea dl dt {
	margin-bottom: 20px;
	font-size: 2.0rem;
	font-weight: bold;
}
.profileBox .detailArea dl dd{
    display: table;
    width: 100%;
}
.profileBox .detailArea dl dd p{
    display: table-cell;
    vertical-align: top;
}
.profileBox .detailArea dl dd p.image{
    text-align: right;
    padding-left: 20px;
}
.profileBox .detailArea dl dd p.image img {
    width: 320px;
}

/* 著者インタビュー */
.interviewBox .detailArea .image {
	margin-bottom: 40px;
}
.interviewBox .detailArea .image img {
    width: 320px;
    height: auto;
}
.interviewBox .detailArea dl + dl {
	margin-top: 40px;
}
.interviewBox .detailArea dl dt {
	margin-bottom: 20px;
}
.interviewBox .detailArea dl dt em {
	font-size: 2.0rem;
	font-weight: bold;
}
.interviewBox .detailArea dl dd p + p {
    margin-top: 10px;
}
.interviewBox .detailArea dl dd .meta {
    text-align: right;
}
.interviewBox .detailArea .btn {
    background: #a9833b;
    margin-top: 20px;
}
.interviewBox .detailArea .btn a {
	font-size: 2.0rem;
	font-weight: bold;
    color: #ffffff;
    text-align: center;
    display: block;
    padding: 10px;
    text-decoration: none;
}

/* 著者インタビュー ページ */
.interviewPage .headerArea .content {
    height: auto;
	padding-top: 0;
	padding-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
}
.interviewBox .detailArea dl.readBox dt em {
	font-size: 2.4rem;
    line-height: 1.4em;
}
.interviewPage .interviewBox .content {
    display: block;
}
.interviewPage .interviewBox .titleArea,
.interviewPage .interviewBox .detailArea {
    display: block;
    width: 100%;
}
.interviewPage .interviewBox .titleArea {
    margin-top: 40px;
    margin-bottom: 20px;
    text-align: center;
}
.interviewPage .interviewBox .detailArea dd.imageBox {
    text-align: center;
	padding-bottom: 40px;
}
.interviewPage .interviewBox .detailArea dd.imageBox.tate img {
    width: 570px;
}
.interviewPage .interviewBox .detailArea dl dd + dd  {
    margin-top: 20px;
}
.interviewPage .interviewBox .detailArea dl dd p {
    line-height: 2em;
}
.interviewPage .interviewBox .detailArea dl dd.q, 
.interviewPage .interviewBox .detailArea dl dd.a {
    display: table;
}
.interviewPage .interviewBox .detailArea dl dd.a {
    color: #d5ad63;
}
.interviewPage .interviewBox .detailArea dl dd > em,
.interviewPage .interviewBox .detailArea dl dd > div {
    display: table-cell;
}
.interviewPage .interviewBox .detailArea dl dd > em {
    width: 3em;
}
.interviewPage .interviewBox .detailArea dl dd p + p {
    margin-top: 10px;
}
.interviewPage .interviewBox .detailArea .meta {
	margin-top: 40px;
	text-align: right;
}
.interviewPage .interviewBox .detailArea .btn {
    margin-top: 40px;
}

/* 書評 */
.reviewBox .detailArea dl dt em {
    display: block;
	font-size: 2.0rem;
	font-weight: bold;
	margin-bottom: 20px;
}
.reviewBox .detailArea dl dt span {
    display: block;
	font-size: 1.6rem;
	font-weight: bold;
	margin-bottom: 20px;
}


/* 試し読み */
.trialBox .detailArea dl + dl {
	margin-top: 40px;
}
.trialBox .detailArea dl dt {
	margin-bottom: 20px;
}
.trialBox .detailArea dl dt em {
	font-size: 2.0rem;
	font-weight: bold;
}
.trialBox .detailArea dl dd + dd {
	margin-top: 20px;
}
.trialBox .detailArea .btn {
    background: #a9833b;
    margin-top: 20px;
}
.trialBox .detailArea .btn a {
	font-size: 2.0rem;
	font-weight: bold;
    color: #ffffff;
    text-align: center;
    display: block;
    padding: 10px;
    text-decoration: none;
}

/* 試し読み ページ */
.trialPage .headerArea .content {
    height: auto;
	padding-top: 0;
	padding-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
}
.trialPage .trialBox .content {
    display: block;
}
.trialPage .trialBox .titleArea,
.trialPage .trialBox .detailArea {
    display: block;
    width: 100%;
}
.trialPage .trialBox .titleArea {
    margin-top: 40px;
    margin-bottom: 20px;
    text-align: center;
}
.trialPage .trialBox .imageArea {
    text-align: center;
	padding-bottom: 40px;
}
.trialPage .trialBox .detailArea dl dd p {
    line-height: 2em;
}
.trialPage .trialBox .detailArea dl dd p + p {
    margin-top: 5px;
}
.trialPage .trialBox .detailArea .btn {
    margin-top: 40px;
}
.trialPage .trialBox .detailArea .bold {
    font-weight: bold;
}


/* 感想の声 */
.praiseBox .detailArea dl {
    border-top: 1px solid #55596e;
    padding: 20px 0;
}
.praiseBox .detailArea dl dt {
	font-size: 1.6rem;
	font-weight: bold;
	margin-top: 10px;
    text-align: right;
}
.praiseBox .detailArea dl dt span {
    text-align: left;
    display: inline-block;
}


/* スマホレイアウト
----------------------------- */
@media only screen and (max-width: 768px) {
/* -------------------------------------------------------------------------- */
/* 共通 */
.content {
	width: 100%;
}
.contentArea {
    padding-bottom: 0;
}

/* コンテンツ共通 */
.block .content {
    display: block;
	padding: 20px;
}
.block .content.line {
    border-top: none; 
}
.block .titleArea,
.block .detailArea {
    display: block;
}
.block .titleArea {
	width: 100%;
    text-align: center;
    margin: 20px 0;
}

.block.reviewBox {
    padding: 0;
}

/* ヘッダー */
.headerArea .content {
    height: auto;
    margin-bottom: 20px;
}
.headerArea .headGoHome {
    position: absolute;
    z-index: 2;
    top: 10px;
    left: 10px;
}
.headerArea .image {
    z-index: 1;
    margin-bottom: 20px;
}
.headerArea .image img {
    width: 100%;
    height: auto;
}
.headerArea .image,
.headerArea .snsArea,
.headerArea .navArea {
    position: relative;
    top: inherit;
    bottom: inherit;
    left: inherit;
    right: inherit;
}
.headerArea .imageBox {
    position: relative;
}
.headerArea .imageBox .btn {
    width: 40%;
    height: auto;
    position: absolute;
    top: auto;
    bottom: 25%;
    left: 2%;
    z-index: 2;
}
.headerArea .btn img {
    width: 100%;
    height: auto;
}
.headerArea .navArea ul li {
    border-right: none;
    border-top: 1px solid #303445;
    float: none;
}
.headerArea .navArea ul li:last-of-type {
    border-left: none;
    border-bottom: 1px solid #303445;
}
.headerArea .navArea ul li a {
    text-decoration: none;
    padding: 10px;
    display: block;
}
.headerArea .navArea ul li span {
    display: block;
	font-size: 1.6rem;
    color: #ffffff;
}
.headerArea .navArea ul li img {
    display: none;
}



/* フッター */
.footerArea  {
	padding-top: 0px;
}
.footerArea .footerBox {
	padding: 10px;
}
.footerArea .goTop {
	bottom: 10px;
	right: 10px;
}
.footerArea .goTop img {
	width: 40px;
	height: auto;
}

/* SNS */
.snsArea {
	text-align: center;
	min-width: inherit;
	display: block;
}
.snsArea ul {
	display: block;
	text-align: center;
	vertical-align: middle;
}
.snsArea li {
	display: inline-block;
	vertical-align: middle;
	margin: 0 2px;
}

/* 書籍 */
.bookBox .content {
	padding: 10px;
	display: block;
}
.bookBox .detail {
	display: block;
}
.bookBox .detail .image {
	display: block;
	width: 100%;
    text-align: center;
}
.bookBox .detail .image img {
	height: auto;
}
.bookBox .detail .text {
	display: block;
	padding-left: 0;
    padding-top: 10px;
}
.bookBox .detail .text dl dt em {
	font-size: 1.8rem;
}
.bookBox .detail .text dl dt span {
	font-size: 1.4rem;
}
.bookBox .detail .text dl dd {
	margin-bottom: 10px;
}
.bookBox .detail .text ul {
	margin-top: 0px;
	margin-left: 0px;
	width: 100%;
    font-size: 0;
}
.bookBox .detail .text ul li {
    font-size: 1.4rem;
	display: inline-block;
	margin-top: 5px;
	margin-right: 0px;
	margin-left: 0px;
    /*width: 100%;*/
	width: 48%;
}
.bookBox .detail .text ul li + li {
	margin-left: 4%;
}
.bookBox .detail .text ul li a {
	display: block;
	vertical-align: middle;
	font-size: 1.4rem;
	padding: 10px;
	width: 100%;
	height: auto;
}
.bookBox .detail .text ul li a:hover {
}


.bookArea {
    padding: 10px 0;
}
.book02Box {
	text-align: center;
	margin-top: 0px;
}
.book02Box .content {
	display: block;
	width: 100%;
}
.book02Box .content .detail {
	display: block;
}
.book02Box .content .text {
	display: block;
}
.book02Box .content .detail {
	display: block;
	width: 100%;
}
.book02Box .content .detail .image {
	width: 100%;
    margin-bottom: 20px;
}
.book02Box .content .detail .image img {
	max-width: 100%;
	height: auto;
}
.book02Box .content .text {
	padding-left: 0px;
}
.book02Box .content .text dl dt {
	margin-bottom: 10px;
}
.book02Box .content ul {
	margin-top: 0px;
}
.book02Box .content ul li {
	display: inline-block;
	margin-top: 10px;
    /*width: 100%;*/
	width: 48%;
}
.book02Box .content .text ul li + li {
	margin-left: 4%;
}
.book02Box .content ul li a {
	display: block;
	margin-right: 0px;
	width: 100%;
}


/* 内容紹介 */
.storyBox {
}

/* 著者プロフィール／メッセージ */
.profileBox .detailArea dl dt {
	margin-bottom: 10px
}
.profileBox .detailArea dl dd{
    display: block;
}
.profileBox .detailArea dl dd p{
    display: block;
}
.profileBox .detailArea dl dd p.image{
    text-align: center;
    padding-left: 0;
    margin-top: 10px;
}
.profileBox .detailArea dl dd p.image img {
    width: 100%;
}

/* 著者インタビュー */
.interviewBox .detailArea .image {
	margin-bottom: 20px;
    margin-left: -20px;
    margin-right: -20px;
}
.interviewBox .detailArea .image img {
    width: 100%;
    height: auto;
}
.interviewBox .detailArea dl + dl {
	margin-top: 20px;
}
.interviewBox .detailArea dl dt {
	margin-bottom: 10px;
}
.interviewBox .detailArea dl dd p + p {
    margin-top: 10px;
}
.interviewBox .detailArea .btn {
    margin-top: 20px;
}

/* 著者インタビュー ページ */
.interviewPage .interviewBox .titleArea {
    margin-top: 20px;
}
.interviewPage .interviewBox .detailArea dd.imageBox {
	padding-bottom: 20px;
}
.interviewPage .interviewBox .detailArea dd.imageBox.yoko {
    margin-left: -20px;
    margin-right: -20px;
}
.interviewPage .interviewBox .detailArea dd.imageBox.tate img {
    width: 100%;
}
.interviewPage .interviewBox .detailArea .btn {
    margin-top: 20px;
}

/* 書評 */
.reviewBox {
}

/* 試し読み */

/* 試し読み ページ */
.trialPage .trialBox {
}
.trialPage .trialBox .detailArea .btn {
    margin-top: 20px;
}


/* 感想の声 */
.praiseBox {
}



	
/* -------------------------------------------------------------------------- */
}