@charset "utf-8";

@import url(//fonts.googleapis.com/css?family=Courgette&display=swap);
@import url(//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(//use.fontawesome.com/releases/v5.0.6/css/all.css);


/********** base ************/
html {font-size:62.5%;}
body{
	background:url(../images/bg.jpg) center top fixed;
	font-size:1.2rem;
}
li {list-style:none;}
.Bold {font-weight:bold;}
.Font12 {font-size:1.2rem;}
a:hover img {opacity:0.7;}


/* topへ戻る */
footer #pageTop{
    width:40px;
    height:40px;
    padding:0;
    text-indent:-9999px;
    background-color:#0079c7;
    border-radius:100%;
    position:fixed;
    bottom:10px;
    right:10px;
    z-index:800;
    display:none;
    cursor:pointer;
}
footer #pageTop a {display:block;}
footer #pageTop::after{
    content:"\f106";
    font-family:"FontAwesome";
    font-size:40px;
    line-height:35px;
    text-indent:0;
    text-align:center;
    color:#fff;
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
}


@media screen and (min-width: 641px) {
#contentsWrap{
	background:#fff;
	width:1080px;
	margin:0 auto;
	line-height:1.7;
}
main{
	width:1080px;
	margin:0 auto;
}
.smOnly {display:none;}


/* header */
#headerWrap{
	width:1080px;
	padding:0 0 30px;
}
#headerWrap h1 {margin-bottom:40px;}
.Line {margin-bottom:20px;}
.infoTit{
	font-size:2rem;
	font-weight:bold;
	text-align:center;
}
#headerWrap .infoWrap{
	width:1040px;
	margin:0 auto 2em;
	font-size:1.6rem;
}
p {margin-bottom:1em;}
#Logo{
	display:inline-block;
	position:relative;
	width:148px;
}
#Logo img{
	position:absolute;
	top:-19px;
	left:6px;
	width:95%;
}
#Logo a:hover img {opacity:0.7;}
#tokutenBox{
	overflow:hidden;
	width:950px;
	margin:0 auto;
	font-weight:bold;
	color:#fff;
}
#tokutenBox li{
	float:left;
	background:#ef859b;
	width:276px;
	height:320px;
	margin:0 20px;
	padding:10px;
	font-size:1.6rem;
	text-align:center;
	line-height:1.2;
	box-sizing:border-box;
}
#tokutenBox li img{
	width:100%;
	max-width:250px;
	padding-top:10px;
	text-align:center;
}
#tokutenBox li .bookCover {padding:20px 0 14px;}
#tokutenBox li .bookCover img{
	width:auto;
	max-height:250px;
	margin-bottom:6px;
	padding-top:0;
}


/* シーン */
.scene h2, .sceneUpdate h2{
	width:556px;
	height:122px;
	margin:0 auto 20px;
}
.scene ul{
	overflow:hidden;
	width:960px;
	margin:0 auto 80px;
	font-size:1.5rem;
}
.scene li{
	position:relative;
	float:left;
	width:300px;
	height:400px;
	margin-right:10px;
	box-sizing:border-box;
}
.scene li:nth-child(2)::after{
	content:url(../images/page1.png);
	position:absolute;
	bottom:-6px;
	right:20px;
}
.scene li:nth-child(3)::after{
	content:url(../images/page2.png);
	position:absolute;
	bottom:-6px;
	right:20px;
}
.updateDay{
	margin-bottom:0;
	font-size:4.6rem;
	font-weight:bold;
	text-align:center;
}
.comingSoon{
	font-family:"Courgette", cursive;
	margin-bottom:80px;
	font-size:4.6rem;
	font-weight:bold;
	text-align:center;
}
.scene li:first-child{
	background:#fdf6f7;
	width:330px;
	padding:6px;
	border:2px solid #ef859b;
}
.scene li img{
	height:100%;
	vertical-align:bottom;
	border:1px solid #000;
	box-sizing:border-box;
}


/* 特典注意文 */
.tokutenBoxAttention{
	width:1050px;
	margin:20px auto;
	padding:1em;
	border:1px solid #630a68;
}
.tokutenBoxAttention p {padding:0 12px;}
.tbaTit{
	display:inline-block;
	margin-bottom:3px;
	padding:0 6px;
	font-size:1.4rem;
	color:#d80f11;
	border:1px solid #d80f11;
}
.tbaTit::before{
	font-family:FontAwesome;
	content:"\f06a";
	margin-right:4px;
	font-size:1.6rem;
	color:#d80f11;
}
.tokutenBoxAttention .AttLink{
	margin:12px 0 0;
	font-size:1.4rem;
}
.tokutenBoxAttention .AttLink a {color:#d80f11;}
.tokutenBoxAttention .AttLink::before{
	font-family:FontAwesome;
	content:"\f061";
	margin-right:4px;
	font-size:1.6rem;
	color:#d80f11;
}
.tokutenBoxAttention .AttLink a:hover{
	color:#444;
	text-decoration:none;
}


/* Footer */
footer{
	padding-bottom:30px;
	color:#fff;
}
#linkWrap ul{
	overflow:hidden;
	width:868px;
	margin:0 auto 30px;
	box-sizing:border-box;
}
#linkWrap li{
	float:left;
	max-height:111px;
	margin:0 10px;
}
#linkWrap li:last-child{
	max-height:109px;
	box-sizing:border-box;
}
#linkWrap li:last-child img{
	height:111px;
	vertical-align:bottom;
	border:1px solid #000;
	box-sizing:border-box;
}

}



@media screen and (max-width: 640px) {
.pcOnly {display:none;}
#contentsWrap{
	background:#fff;
	width:96%;
	margin:0 auto;
	padding:0 10px;
	font-size:1.3rem;
	line-height:1.5;
	box-sizing:border-box;
}
main{
	width:100%;
	margin:0;
}


/* header */
#headerWrap{
	width:100%;
	padding:0 0 30px;
}
#headerWrap h1 {margin-bottom:20px;}
#headerWrap h1 img {width:100%;}
.Line {margin-bottom:0;}
.Line img {width:100%;}

.infoTit{
	font-size:2rem;
	font-weight:bold;
	text-align:center;
}
#headerWrap .infoWrap{
	width:100%;
	margin:0 auto 2em;
	font-size:1.4rem;
}
p {margin-bottom:1em;}
#Logo{
	display:inline-block;
	position:relative;
	width:138px;
}
#Logo img{
	position:absolute;
	top:-17px;
	left:4px;
	width:95%;
}
#Logo a:hover img {opacity:0.7;}
#tokutenBox{
	overflow:hidden;
	width:96%;
	margin:0 auto;
	font-weight:bold;
	color:#fff;
}
#tokutenBox li{
	background:#ef859b;
	max-width:256px;
	height:320px;
	margin:0 auto 10px;
	padding:10px;
	font-size:1.4rem;
	text-align:center;
	line-height:1.2;
	box-sizing:border-box;
}
#tokutenBox li img{
	width:100%;
	max-width:250px;
	padding-top:10px;
	text-align:center;
}
#tokutenBox li .bookCover {padding:20px 0 14px;}
#tokutenBox li .bookCover img{
	width:auto;
	max-height:250px;
	margin-bottom:6px;
	padding-top:0;
}


/* シーン */
.scene h2, .sceneUpdate h2{
	width:100%;
	margin:0 auto 20px;
}
.scene h2 img, .sceneUpdate h2 img {width:100%;}
.scene ul{
	overflow:hidden;
	width:96%;
	margin:0 auto 40px;
}
.scene li{
	position:relative;
	max-width:281px;
	margin:0 auto 12px;
}
.scene li:nth-child(2)::after{
	content:url(../images/page1.png);
	position:absolute;
	bottom:-4px;
	right:0;
}
.scene li:nth-child(3)::after{
	content:url(../images/page2.png);
	position:absolute;
	bottom:-4px;
	right:0;
}
.updateDay{
	margin-bottom:0;
	font-size:2.6rem;
	font-weight:bold;
	text-align:center;
}
.comingSoon{
	font-family:"Courgette", cursive;
	margin-bottom:80px;
	font-size:2.6rem;
	font-weight:bold;
	text-align:center;
}
.scene li:first-child{
	background:#fdf6f7;
	width:268px;
	padding:6px;
	border:2px solid #ef859b;
}
.scene li img{
	width:100%;
	vertical-align:bottom;
	border:1px solid #000;
	box-sizing:border-box;
}


/* Footer */
footer {}
#linkWrap ul{
	overflow:hidden;
	width:90%;
	margin:0 auto 30px;
	text-align:center;
	box-sizing:border-box;
}
#linkWrap li {margin-bottom:10px;}
#linkWrap li:last-child img {vertical-align:bottom;}
#linkWrap li img{
	width:80%;
	margin:0 auto;
}



}