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

html,body {height:auto!important;}
body{
	overflow:auto!important;
	background:url(../images/bg.png);
	color:#000;
	font-size:1rem;
	line-height:1.6;
	font-family: "MS PGothic", "Osaka", Arial, sans-serif;
}
.kekka{
	display:block!important;
}

.container{
	width:957px;
	margin:0 auto 30px auto;
	padding: 0 0 50px 0;
	background:rgba(255,255,255,0.8);
}

.pantsu{
	margin:20px auto;
	overflow:hidden;
}

.p_image{
	width: 50%;
    text-align: right;
	float: left;
}

.p_text{
	width: 40%;
    margin: 40px 5%;
    text-align: left;
    font-size: 1.8em;
    font-weight: bold;
    letter-spacing: 0.1em;
	float: left;
}

.chara{
	text-align:center;
}

.text{
	text-align: center;
	margin: 30px 0 0 0;
}

textarea {
    min-width: 80%;
    max-width: 80%;
}

.twi_twi{
	text-align:center;
	width:80%;
	margin:30px auto;
}

.twi_twi .tweet_btn a {
    border-radius: 3px;
    font-size: 18px;
    padding: 20px 30px;
    background: #1da1f2;
    color: #fff;
}

.check{
	text-align:center;
}

.comic{
	text-align:center;
	margin:50px 20px;
	width:920px;
}
.yoyaku{
	text-align:center;
	margin:30px 20px 10px;
	width:920px;
}
.more{
	text-align:center;
	margin:0 0 10px 0; 
}

.yoyaku a:hover img,.more a:hover img{
	opacity:0.5;
}

.comic img,.yoyaku img{
	width:100%!important;
	height:auto;
}

footer{
	text-align: center;
}

.tokusetsu{
	text-align:center;
	font-size:1.3em;
	font-weight:bold;
	margin:0 auto 30px auto; 
}

.tokusetsu a:hover img{
	opacity:0.5;
}

@media screen and (max-width: 640px) {
/* スマートフォン用のスタイル記述 */
body{ font-size: calc(11px + 0.25vw) }
.container{
	width:100%;
}

img{
	width:100%;
	height:auto;
}

.pantsu{
	margin:0 auto 20px auto;
	overflow:hidden;
}

.p_image{
	width:100%;
    text-align: center;
	margin:0 auto;
}

.p_image img{
	width:80%!important;
	height:auto;
}

.p_text{
	width: 90%;
    margin: 0 5%;
    text-align: left;
    font-size: 1.2em;
    font-weight: bold;
    letter-spacing: 0;
}

.chara{
	text-align:center;
}

.twi_twi{
    padding: 0px;
    width: 100%;
    margin: 30px auto;
    background: none;
    text-align:center;
}
textarea {
    min-width: 90%;
    max-width: 90%;
}


.check{
	text-align:center;
	margin:0 2%;
	width:96%;
}

.comic{
    margin: 30px 2%;
    width: 96%;
}
.yoyaku{
	text-align:center;
	margin:10px 2%;
	width:96%;
}
.more{
	text-align:center;
	margin:0 auto 10px auto; 
	width:50%;
}

.yoyaku a:hover img,.more a:hover img{
	opacity:0.5;
}

.comic img,.yoyaku img{
	width:100%!important;
	height:auto;
}

footer{
	text-align: center;
}

.tokusetsu{
	text-align:center;
	font-size:1.3em;
	font-weight:bold;
	margin:0 auto 30px auto; 
}
.tokusetsu img{
	width:80%;
	max-width:330px;
}

}