@media screen and (max-width: 777px){
header,footer,nav,section,article,aside{
	display: block;
}
*{
	margin: 0px;
	padding: 0px;
	font-size: 24px;
	line-height: 32px;
}
body{
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}

img{
	border: 0px;
	max-width: 100%;
	height: auto;
	width /***/:auto;
}
a{
	color: #4313f4;
	text-decoration: none;
}
a:hover{
	color: #4313f4;
	text-decoration: underline;
}
a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
.clear{
	clear: both;
	line-height: 0px;
	font-size: 0px;
}
.dsp{
	display: block;
}
.nsp{
	display: none;
}

/* コンテナ */
#container{
	width: 640px;
}

/* ヘッダ */
header{
	width: 640px;
	background-color: #ff31af;
	position: fixed;
	top: 0;
	height: 74px;
	z-index: 100;
}
h1{
	margin-left: 20px;
	width: 327px;
	float: left;
}
#smenu{
	width: 91px;
	float: right;
	text-align: center;
}
.smenu-open{
	background-color: #ffe600;
}
nav{
	display: none;
	position: absolute;
	top: 72px;
	z-index: 999999;
	width: 640px;
	overflow-x: none;
	overflow-y: auto;
	background: #ffe600;
	-moz-box-shadow: 0px 1px 2px #666666;
	-webkit-box-shadow: 0px 1px 2px #666666;
	box-shadow: 0px 1px 2px #666666;
}
nav ul{
	list-style-type: none;
}
nav ul li{
	border-bottom: 1px solid #fff599;
}
nav ul li a{
	display: block;
	padding: 20px 20px 20px 20px;
}
nav ul li #nav_fb{
	display: block;
	padding: 20px 0px 20px 20px;
	float: left;
}
nav ul li #nav_app{
	display: block;
	padding: 20px 20px 20px 0px;
	float: right;
}
#fb-banner{
	display: none;
}

/* メイン */
#contents{
	margin-top: 72px;
}

/* フッタ */
footer{
	width: 600px;
	margin-left: 20px;
	margin-right: 20px;
}
#footer-bn01,#footer-bn02,#footer-bn03{
	margin-bottom: 20px;
}
#footer-bn04{
	margin-bottom: 48px;
}
#twitter-title{
	margin-bottom: 18px;
}
#footer-tw01,#footer-tw03{
	width: 290px;
	height: 344px;
	float: left;
	margin-bottom: 20px;
	background-color: #ffe600;
}
#footer-tw02,#footer-tw04{
	width: 290px;
	height: 344px;
	float: right;
	margin-bottom: 20px;
	background-color: #ffe600;
}
.twitter-timeline{
	width: 290px;
}
.tw-header{
	background-color: #b3db2e;
	padding-top: 10px;
	padding-left: 12px;
	padding-bottom: 0px;
	font-size: 1px;
}
.tw-header .tw-name{
	font-weight: bold;
	color: #f5489e;
	font-size: 20px;
}
.tw-header .tw-id{
	font-size: 14px;
	color: #4313f4;
}

#footer-sns{
	text-align: center;
	margin-top: 24px;
}
address{
	text-align: center;
	font-style: normal;
	margin-top: 48px;
	padding-bottom: 24px;
}
.back2top{
	display: none;
	text-align: right;
	position: fixed;
	right: 10px;
	bottom: 16px;
	z-index: 10;
}


/* TOPページ */
#main-visual{
	position: relative;
	z-index: 0;
}
#main-visual img{
	width: 100%;
	height: auto;
}
#top-history{
	position: relative;
	z-index: 1;
	margin-top: -57px;
}
#top-history img{
	width: 100%;
	height: auto;
}
#top-character{
	position: relative;
	z-index: 2;
	margin-top: -84px;
}
#top-character img{
	width: 100%;
	height: auto;
}
#top-comic{
	position: relative;
	z-index: 3;
	margin-top: -73px
}
#top-comic img{
	width: 100%;
	height: auto;
}
#top-history a:hover img, #top-character a:hover img, #top-comic a:hover img{
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha(opacity=100)";
}
#top-footer{
	margin-top: -66px;
	background: url(images/footer-bg.jpg);
	padding-top: 111px;
}

/* 下層コンテンツ共通 */
#footer-shape{
	width: 100%;
	height: auto;
}
#contents-footer{
	margin-top: -62px;
	background: url(images/footer-bg.jpg);
	padding-top: 12%;
}


/* コミック */
#comic-explain{
	width: 600px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 48px;
}
#comic-banner{
	text-align: center;
	margin-top: 48px;
}
#comic-thumbs{
	margin-top: 54px;
	width: 600px;
	margin-left: auto;
	margin-right: auto;
}
.comic-thumbs01, .comic-thumbs03, .comic-thumbs05{
	width: 290px;
	float: left;
	margin-bottom: 104px;
}
.comic-thumbs02, .comic-thumbs04, .comic-thumbs06{
	width: 290px;
	float: right;
	margin-bottom: 104px;
}
#comic-banner2{
	display: none;
}

/* コミック詳細 */
.comic-title{
	position: fixed;
	top: 74px;
	left: 0;
}
.comic-detail-1st{
	padding-top: 120px;
}
.comic-detail-list{
	width: 600px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	margin-bottom: 48px;
}
.comic-detail-anchor{
/*	margin-bottom: 96px;*/
	position: relative;
	top: -130px;
}
.comic-detail-list h3{
	font-size: 20px;
	line-height: 30px;
}
.comic-detail-list h3 span{
	font-size: 24px;
	color: #ff31af;
}
.comic-detail-list .back2list{
	width: 250px;
	float: left;
	text-align: center;
	line-height: 48px;
}
.comic-detail-list .back2list a{
/*	padding-left: 48px;*/
}
.comic-detail-list .uplink{
	width: 58px;
	float: left;
	text-align: left;
}
.comic-detail-list .downlink{
	width: 49px;
	float: left;
	text-align: center;
}
.comic-detail-list .twcomic{
	width: 200px;
	float: left;
	text-align: right;
}

/* ひすとり～ */
#history{
	width: 600px;
	margin-left: auto;
	margin-right: auto;
}
#history dl{
	margin-bottom: 40px;
}
#history dt{
	width: 184px;
	float: left;
	color: #ff31af;
	margin-top: 20px;
}
#history dd{
	width: 416px;
	float: left;
	margin-top: 20px;
}

/* キャラクター紹介 */
#character{
	text-align: center;
}
.character_detail{
	margin-top: 24px;
	padding-bottom: 48px;
}

/* 会社概要 */
#company{
	width: 600px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 48px;
}
#company table{
	width: 100%;
	margin-top: 56px;
	border-collapse: collapse;
}
#company table th{
	width: 132px;
	border-top: 1px solid #ff31af;
	vertical-align: top;
	text-align: left;
	color: #ff31af;
	padding-top: 18px;
	padding-left: 8px;
	padding-bottom: 18px;
}
#company table td{
	width: 422px;
	border-top: 1px solid #c9c9c9;
	padding-top: 18px;
	padding-left: 8px;
	padding-bottom: 18px;
}
#company table .nt{
	width: 24px;
	border: 0px;
}
#company p{
	line-height: 24px;
}

/* 著作権について */
#copyright{
	width: 600px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 52px;
	margin-bottom: 48px;
}
#copyright p{
	margin-bottom: 32px;
}
#copyright em{
	color: #4313f4;
	font-style: normal;
}
#copyright h3{
	font-size: 30px;
	color: #ff31af;
	padding-top: 24px;
	margin-bottom: 24px;
}
#copyright ol{
	margin-bottom: 32px;
}
#copyright ol li{
	margin-left: 40px;
	font-weight: bold;
}

/* むてき食堂 */
#muteki-info{
	width: 600px;
	margin-left: auto;
	margin-right: auto;
}
#muteki-info table{
	width: 100%;
	margin-top: 56px;
	border-collapse: collapse;
}
#muteki-info table th{
	width: 130px;
	border-top: 1px solid #ff31af;
	vertical-align: top;
	text-align: left;
	color: #ff31af;
	padding-top: 18px;
	padding-left: 8px;
	padding-bottom: 18px;
}
#muteki-info table td{
	width: 436px;
	border-top: 1px solid #c9c9c9;
	padding-top: 18px;
	padding-left: 8px;
	padding-bottom: 18px;
}
#muteki-info table .nt{
	width: 24px;
	border: 0px;
}
#muteki-info table td iframe{
	width: 432px;
	height: 270px;
}

}
