﻿@charset "UTF-8";


body { 
background-color:#666666; 

line-height:1.4;
color:#ffffff;
font-family: 'メイリオ','Hiragino Kaku Gothic Pro', sans-serif;
font-size:14px;
text-align: center;
}

img {
max-width: 100%;
height: auto;
display:block;
}

a img {
border: none;
}


a { 
color: #00ccff;
text-decoration:none; 
}
a:visited {
color: #00ccff;
text-decoration:none;   
}      
a:hover {
color: #ff9933;
text-decoration:none;   
}



/* もくじ */

.box1 {
max-width: 900px;
text-align: center;
padding-top: 5px;
margin: 0px auto;
}

.page {
font-size: 20px;
}

.page ul {
padding: 0px;
margin: 0px auto;
}

.page li {
margin: 5px;
float: left;
list-style: none;
padding-bottom: 0px;
line-height: 0.8;
}


li.new a{
color: #ffff66;
text-decoration:none; 
}

li.new a:visited {
color: #ffff66;
text-decoration:none;   
}  
    
li.new a:hover {
color: #ff9933;
text-decoration:none;   
}


.mokujiclear {
content="";
display: block;
clear: both;
}


/* 漫画画像 */

.box2{
margin: 10px auto 0px;
}


.gazo {
width: 532px;
margin: 0px auto;

}

.gazo a {
text-decoration: none;

}



.comic {
font-size: 16px;
}

.comic p {
margin: 0px auto;
padding-bottom: 10px;
width: 532px;
}






/* 前と次 */

.mae {
text-align: left;
float: left;
}

.tugi {
text-align: right;
}

.fit {
width: 532px;
margin: 0px auto;
}

.maetugi {
max-width: 500px;
margin-top: 10px;
font-size: 20px;
margin: 5px auto;

}

.backmawari {
margin-top: 50px;
width: 100%;
}

.back {
margin: 0px auto;
width: 200px;
height: 50px;
}

.back a {
width: 200px;
height: 50px;
margin-top: 10px;
font-size: 20px;
background-color: #000000;
display: table-cell;
vertical-align: middle;
text-align: center;
}



/* ランク投票 */
.rank {
margin-top: 50px;
margin-bottom: 30px
}

.rank ul {
margin: 0px;
padding-left: 20px;
padding-right: 20px;
list-style: none;
background-color: #ffffff;
text-align: left;
}

.rank li {
color: #333333;
padding-bottom: 10px;

}

.narabi {
width: 232px;
margin: 0px;
padding-top: 10px;

}

.rank img {
width: 100%;

}


.tbc {
width: 100%;
max-width: 100px;

}

.tbc a {
display: inline-block;
}



.tbw {
width: 100%;
max-width: 100px;
}

.tbw a {
display: inline-block;
}




/* コピーライト */

.copyright p {
margin: 0;
color: #333333;
}

/* コピーライト上の罫線 */
.box3 {
border-top: solid 2px #333333
}


/* ボックス上下の間隔 */


.box2 {
padding-top: 0px;
padiing-bottom: 0px;
margin-bottom: 10px;
}


.box3 {
padding-top: 15px;
padding-bottom: 15px;
}




/* ########## 599px以下 ########## */
@media (max-width: 599px) {
/*  */

body { 
font-size:18px;
}

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


/* もくじ */
.page {
font-size: 20px;
width: 534px;
}

.page ul {
padding: 0px;
margin: 0px auto;

}


.comic {
font-size: 24px;
}



/* コピーライト */


.box3 {
width: 534px;
}





/* ボックス上下の間隔 */

.box2 {
padding-top: 0px;
padiing-bottom: 0px;
margin-bottom: 30px;
}


.box3 {
padding-top: 15px;
padding-bottom: 15px;
}



}


/* ########## 600px 以上～ 849px 以下 ########## */
@media (min-width: 600px) and (max-width: 849px) {

body { 
background-image:none; 
line-height:1.4;
color:333333;
font-family: 'メイリオ','Hiragino Kaku Gothic Pro', sans-serif;
font-size:16px;
}

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





/* ボックス上下の間隔 */
.box2 {
padding-top: 0px;
padiing-bottom: 0px;
margin-bottom: 30px;
}


.box3 {
padding-top: 15px;
padding-bottom: 15px;
}



}




/* ########## 850px以上 ########## */
@media (min-width: 850px) {


/* 全体の横幅を固定 */
.box1, .box2, .box3 {
width: 850px;
margin-left: auto;
margin-right: auto;
}




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


/* tbcとtbwを横に並べる設定 */
.narabi:after {
content:"";
display: block;
clear: both

}


.tbc {
float: left;
width: 50%
}            

.tbw {
float: left;
width: 50%
}


/* .tbcと.tbw左右の間隔 */
.tbw {
padding-left: 0px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;




}









/* devicePixelRatio=1.5  主にAndroid */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5) {
	/* style here... */
}

/* devicePixelRati=2  主にiPhone ########## iphone6 ########## */
@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {
	/* style here... */







}

