/* ----------------------------------------------- */
body {
	font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
	width: 100%;
	margin:0 auto;
}
li {
list-style-type: none;
}

a:hover{opacity: 0.8; transition: 0.3s;}

/* --------------------------------------- */

#wapper  {
	width:100%;
	height:auto;
	margin:0 auto;
	background-image:url("../img/properaImg19_pc.jpg");
	background-repeat:repeat-y;
	background-size: contain;
	padding-bottom: 4%;
}

/*ナビゲーション--------------------------------- */
#header {
	height:50px;
	background-color:#0080d9;
}

#obi {
	height:50px;
	width:100%;
	margin:0 auto;
}
.snsWrapper {
	height:50px;
	float:right;
}
.snsWrapper li {
	float:right;
	margin-left:10px;
}

h1 {
	width:242px;
	height:50px;
	float: left;
}
.facebtn {
margin-top: 13px;
margin-right: 14px;
}
#twitterbtn {
margin-top: 13px;
width: 100px;
}

/* maincont --------------------------------- */
#mainCont{ width: 100%; max-width:1132px; height: auto; margin: 0 auto; }
.Img{ width: 100%; vertical-align: top;}


/* シリーズ　-------------------------------- */
#series{
	background-image: url("../img/properaImg23_pc.png");
	width: 93%;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0% 0% 4% 7%;
}
.book{
	display: flex;
	flex-wrap: wrap;
}
.book li{
	width: 27.5%;
	margin: 6% 5% 0 0;
}
.book li img{ width: 100%;}
.book li a{ display: block; margin: 4% 0 0;}


/* コミックス　-------------------------------- */
#comics{
	background-image: url("../img/properaImg24_pc.png");
	width: 92.9%;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0% 0% 10% 7%;
	margin: -1px 0 0 0 ;
}

/* ページトップへ　----------------------------- */
#page_top{
  position: fixed;
  right: 22px;
  bottom: -120px;
}
#page_top a{
  position: relative;
  display: block;
  text-decoration: none;
}

.trailer-container {
	width: 100%;
	position: relative;
}
.trailer-container iframe {
	width: 74%;
    height: 70%;
    position: absolute;
    top: 20%;
    left: 13%;
    border: 2px solid #000;
}

.buybtn{position: absolute; width: 42%; bottom: 21%; right: 2.5%;}
.presentbtn{position: absolute; width: 70%; bottom: 2.4%; right: 0%; left: 0; margin: 0 auto;}


@media screen and (max-width:520px) {
	
	.presentbtn{position: absolute; width: 85%; bottom: 3.2%; right: 0%; left: 0; margin: 0 auto;}
	
	.trailer-container {
	width: 100%;
	position: relative;
}
.trailer-container iframe {
	width: 79%;
    height: 70%;
    position: absolute;
    top: 23%;
    left: 10%;
    border: 2px solid #000;
}

.snsWrapper { width: 31%;}
	.facebtn { margin-top: 5px;}
	#twitterbtn { margin-top: 3px;}
	.snsWrapper li { float: none;}
	
#wapper {
    width: 100%;
    height: auto;
    margin: 0 auto;
    background-image: url(../img/properaImg19_sp.jpg);
    background-repeat: repeat-y;
    background-size: contain;
    padding-bottom: 4%;
}
h1 { max-width: 242px; width: 68%;}
h1 a img { width: 100%;}
	
/* シリーズ　-------------------------------- */
#series{
	background-image: url("../img/properaImg23_sp.png");
	width: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0% 0% 4% 0%;
}
.book{
	display: flex;
	flex-wrap: wrap;
}
.book li{
	width: 45%;
	margin: 6% 0 0 3%;
}
.book li img{ width: 100%;}
.book li a{ display: block; margin: 4% 0 0;}


/* コミックス　-------------------------------- */
#comics{
	background-image: url("../img/properaImg24_sp.png");
	width: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0% 0% 15% 0%;
	margin: -1px 0 0 0 ;
}

/* ページトップへ　----------------------------- */
#page_top{
	position: relative;
	right: auto;
	bottom: auto;
	display: block;
	width: 100%;
	margin: 4% 0 0;
}
#page_top a{
	margin: 0 auto;
	position: relative;
	display: block;
	text-decoration: none;
	width: 100%;
}
#page_top a img{ width: 100%; vertical-align: bottom; position: absolute;}
	
}