/*/////////////////////////////////////////////////////////////////////////////////////////////////

 Base Layout

/////////////////////////////////////////////////////////////////////////////////////////////////*/

.comic_area {
  width:320px;
  height:320px;
  margin:0 auto;
  /*border: #EEEEEE 1px solid;*/
  border: none !important;
  overflow:hidden;
}
.comic_area * {
  -webkit-box-sizing: border-box !important;
  -moz-box-sizing: border-box !important;
  -o-box-sizing: border-box !important;
  -ms-box-sizing: border-box !important;
  box-sizing: border-box !important;
}
.comic_area .viewer {
  width:9999px;
}
.comic_area .viewer img {
  float:left;
  width:320px;
  height:auto;
}

.popup_viewer {
  display:none;
}

.viewer_btns {
  width:100%;
  margin:20px 0 30px;
  text-align:center;
}
.viewer_btns a {
	display:inline-block !important;
  height:34px;
	font-size:14px;
  color:#F04370 !important;
  line-height:34px;
	
	border: #F04370 1px solid;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}
.viewer_btns a:hover {
  background-color:#F04370 !important;
  color:#FFF !important;
  text-decoration:none !important;
}
.viewer_btns a.off { color:inherit !important; border-color:#777777 !important;}
.viewer_btns a.off:hover { background-color:inherit !important;}

.viewer_btns .page_l { padding:0 20px 0 10px; margin-right:20px;}
.viewer_btns .page_r { padding:0 10px 0 20px; margin-left:20px;}



/* width:350px以下 */
@media screen and (max-width: 350px) {
  
.comic_area {
  width:300px;
  height:300px;
}
.comic_area .viewer img {
  width:300px;
}
  
}