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

/*----base----*/
* { margin:0; padding:0; }
*, *:before, *:after { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }
html { overflow-y:scroll; overflow-x: hidden; }
table { border-collapse:collapse; border-spacing:0; }
html, h1, h2, h3, h4, h5, h6 { font-size:100%; }

body { font-family: 'Rounded Mplus 1c','Hiragino Sans','ヒラギノ角ゴシック','Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','メイリオ','Meiryo','ＭＳ Ｐゴシック',Osaka,Verdana,sans-serif; font-size:10px; background:#fff; overflow-x:visible!important; }


/*---clearfix：floatによる整形乱れの修正---*/
.clearfix { zoom:1; }
.clearfix:after { content: ""; display:block; clear:both; }



@media screen and (max-width:640px) {
/*画面サイズが640px以下の場合、ここのスタイルを読み込む*/ 

.sp-only { display:block; }
.pc-only { display:none; }

.book-area {
	width: 60%;
	max-width: 460px;
	margin: 0 auto;
}
.book-img {
	text-align: center;
	margin-bottom: 20px;
}
.book-area img {
	max-width: 200px;
}
.inner { width:100%; display:block; margin:0 auto; }

header { width:100%; height:auto; display:block; margin:0; background:#000; position:relative; }
header h1 { display:block; width:100%; height:auto; padding:10px; background:#cb4837; position:absolute; top:0; left:0; }
header h1 a { text-decoration:none; color:#fff; font-size:1.0em; font-weight:normal; }
header h1 a:hover { color:#F4D63B; }
header h2 { display:block; width:100%; height:auto; padding:10px 0; background:rgba(0,0,0,0.8); position:absolute; bottom:0; left:0; color:#fff; font-size:1.5em; text-align:center; font-weight:bold; }
header img.env { display:block; width:75px; height:60px; position:absolute; top:20%; left:5% }
header img.main-image { width:100%; height:auto; }

#c-body { display:block; width:100%; margin:20px auto; padding:10px 0; background:#efe2e1; }
.book-area h3 { height:20px; background:#cb4837; color:#fff; font-size:1.3em; padding:1px 0; margin-bottom:10px; text-align:center; }
.book-area p {
	font-size:1.30em; line-height:1.8;
}


footer { width:100%; height:auto; display:block; margin:0; background:#fff; }
footer .l1 { width:100%; padding:30px 0; }
footer .l1 img { width:80%; display:block; margin:0 auto;  }
footer .l2 { width:100%; padding:0 0 30px 0; }
footer .l2 .inner { width:100%; display:block; margin:0 auto;  }
footer .l2 .small-column { width:80%; display:block; float:none; margin:20px auto; }
footer .l2 .small-column h6 { display:block; height:20px; background:#cb4837; color:#fff; font-size:1.3em; padding:1px 0; margin-bottom:10px; text-align:center; }
footer .l2 .small-column p { font-size:1.15em; line-height:2.0;  }
footer .l3 { padding-bottom:30px; }
footer .l3 .inner { width:90%; display:block; margin:0 auto; font-size:1.2em; line-height:1.5;  }
footer .l3 img { width:100%; height:auto; display:block; float:none; margin:10px auto; }
footer .l4 { background:#EEF0F1; padding:10px; font-size:1.3em; color:#4D4D4D; text-align:center;  } 


} @media screen and (min-width:641px) and (max-width:999px) {
/*画面サイズが641px以上999px以下の場合、ここのスタイルを読み込む*/ 

.sp-only { display:none; }
.pc-only { display:block; }

.book-area {
	width: 100%;
	max-width: 540px;
	margin: 0 auto;
}
.book-img {
	text-align: center;
	margin-bottom: 20px;
}
.book-area img {
	max-width: 460px;
}
.inner { width:100%; display:block; margin:0 auto; }

header { width:100%; height:auto; display:block; margin:0; background:#000; position:relative; }
header h1 { display:block; width:100%; height:auto; padding:10px; background:#cb4837; position:absolute; top:0; left:0; }
header h1 a { text-decoration:none; color:#fff; font-size:1.0em; font-weight:normal; }
header h1 a:hover { color:#F4D63B; }
header h2 { display:block; width:100%; height:auto; padding:10px 0; background:rgba(0,0,0,0.8); position:absolute; bottom:0; left:0; color:#fff; font-size:1.5em; text-align:center; font-weight:bold; }
header img.env { display:block; width:75px; height:60px; position:absolute; top:20%; left:5% }
header img.main-image { width:100%; height:auto; }

#c-body { width:100%; margin:20px auto; padding:10px 0; background:#EEF0F1; }
.book-area h3 { height:20px; background:#cb4837; color:#fff; font-size:1.3em; padding:1px 0; margin-bottom:10px; text-align:center; }
.book-area p {
	font-size:1.30em; line-height:1.8;
}


footer { width:100%; height:auto; display:block; margin:0; background:#fff; }
footer .l1 { width:100%; padding:30px 0; }
footer .l1 img { width:200px; display:block; margin:0 auto;  }
footer .l2 { width:100%; padding:0 0 30px 0; }
footer .l2 .inner { width:760px; display:block; margin:0 auto;  }
footer .l2 .small-column { width:220px; display:block; float:left; }
footer .l2 .small-column:nth-of-type(1) { margin-right:50px; }
footer .l2 .small-column:nth-of-type(2) { margin-right:50px; }
footer .l2 .small-column h6 { display:block; height:20px; background:#cb4837; color:#fff; font-size:1.3em; padding:1px 0; margin-bottom:10px; text-align:center; }
footer .l2 .small-column p { font-size:1.15em; line-height:2.0;  }
footer .l3 { padding-bottom:30px; }
footer .l3 .inner { width:720px; display:block; margin:0 auto; font-size:1.2em; line-height:1.5;  }
footer .l3 img { width:305px; height:auto; display:block; float:left; margin-right:40px; }
footer .l4 { background:#EEF0F1; padding:10px; font-size:1.3em; color:#4D4D4D; text-align:center;  } 


}  @media screen and (min-width:1000px) {
/*画面サイズが1000px以上の場合、ここのスタイルを読み込む*/

.sp-only { display:none; }
.pc-only { display:block; }

.book-area {
	width: 60%;
	max-width: 680px;
	margin: 0 auto;
}
.book-img {
	text-align: center;
	margin-bottom: 20px;
}
.book-area img {
	max-width: 460px;
}
.inner { width:1000px; display:block; margin:0 auto; }

header { width:100%; height:auto; display:block; margin:0; background:#000; position:relative; }
header h1 { display:block; width:100%; height:auto; padding:10px 0; background:#cb4837; position:absolute; top:0; left:0; }
header h1 a { text-decoration:none; color:#fff; font-size:1.3em; font-weight:normal; }
header h1 a:hover { color:#F4D63B; }
header h2 { display:block; width:100%; height:auto; padding:10px 0; background:rgba(0,0,0,0.8); position:absolute; bottom:0; left:0; color:#fff; font-size:2.6em; text-align:center; font-weight:bold; }
header img.env { display:block; width:150px; height:120px; position:absolute; top:15%; }
header img.main-image { width:100%; height:auto; }

#c-body { display:block; width:100%; margin-top:20px; padding:40px 0; background:#efe2e1; }
.book-area h3 { height:20px; background:#cb4837; color:#fff; font-size:1.3em; padding:1px 0; margin-bottom:10px; text-align:center; }
.book-area p {
	font-size:1.30em; line-height:1.8;
}


footer { width:100%; height:auto; display:block; margin:0; background:#fff; }
footer .l1 { width:100%; padding:30px 0; }
footer .l1 img { width:200px; display:block; margin:0 auto;  }
footer .l2 { width:100%; padding:0 0 30px 0; }
footer .l2 .inner { width:760px; display:block; margin:0 auto;  }
footer .l2 .small-column { width:220px; display:block; float:left; }
footer .l2 .small-column:nth-of-type(1) { margin-right:50px; }
footer .l2 .small-column:nth-of-type(2) { margin-right:50px; }
footer .l2 .small-column h6 { display:block; height:20px; background:#cb4837; color:#fff; font-size:1.3em; padding:1px 0; margin-bottom:10px; text-align:center; }
footer .l2 .small-column p { font-size:1.15em; line-height:2.0;  }
footer .l3 { padding-bottom:30px; }
footer .l3 .inner { width:720px; display:block; margin:0 auto; font-size:1.2em; line-height:1.5;  }
footer .l3 img { width:305px; height:auto; display:block; float:left; margin-right:40px; }
footer .l4 { background:#EEF0F1; padding:10px; font-size:1.3em; color:#4D4D4D; text-align:center;  } 
}