@charset "utf-8";
/* CSS Document */
/*S-MANGA用ヘッダ*/
.smangahd h1 a{
	background-image: url(../img_smanga/logo_head_smanga.png);
	width: 160px;
}
.ssfrhd-bottom.smangahd li>ul{display: none;}
.body-comics .ssfrhd-bottom.smangahd {height: 38px ;}
@media screen and (min-width: 480px){
	.body-comics .ssfrhd-bottom.smangahd {height: 40px ;}
}
@media screen and (min-width: 600px){
.smangahd h1 a {
	height: 48px;
	width: 192px;
	background-size: auto 48px;
	}
.body-comics .ssfrhd-bottom.smangahd {height: 48px ;}
}
@media screen and (min-width: 960px){
.smangahd h1 a {
	width: 232px;
	background-size: auto 56px;
	}
}
/*S-MANGAヘッダ文字サイズ調整*/
.ssfrhd-bottom.smangahd a{
	font-size: .85rem;
	padding: 0 1.25rem;
	}
	@media screen and (max-width: 320px){
	.ssfrhd-bottom.smangahd a{
		font-size: 11px;
		padding: 0 1rem;
		}
	}
/*S-MANGA サイドバー*/
#sm-sidebar{background-color: rgba(255,255,255,.96);}
#sm-sidebar h3{border-bottom: none;}
#sm-sidebar h3 a{
	display: block;
	padding: .5rem 1.25rem .5rem 1rem;
	background-color: #546E7A;
	color: rgba(255,255,255,.87);
}
#sm-sidebar h3 a:before {
	content: "";
	display: inline-block;
	width: 3rem;
	height: 3rem;
	background-image: url(../img_smanga/apple-touch-icon-precomposed.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
#sm-sidebar h3 a span {
	display: block;
	font-size: .75rem;
	word-break: keep-all;
	margin: 4px 0;
}
@media screen and (min-width: 720px){
	#sm-sidebar h3 a {padding: 1rem 1.5rem;}
	#sm-sidebar h3 a:before {
		width: 4rem;
		height: 4rem;
	}
	#sm-sidebar h3 a span {
		font-size: .85rem;
		margin: .5rem 0;
	}
}
#sm-sidebar ul{
	list-style-type: none;
	margin-bottom: 2rem;
}
#sm-sidebar>ul>li{
	list-style-type: none;
	border-top: 1px solid rgba(0,0,0,.12);
}
#sm-sidebar li a{
	display: block;
	word-break: keep-all;
	white-space: nowrap;
	outline: none;
	font-size: .85rem;
	line-height: 3.5rem;
	height: 3.5rem;
	padding: 0 1.5rem 0 1.5rem;
	margin: 0;
	color: rgba(0,0,0,1.00);
}
#sm-sidebar li a:hover, #sm-sidebar li:active {
	color: #263238;
	background-color: #ECEFF1;
}
#sm-sidebar dt{
	font-size: .75rem;
	color: rgba(0,0,0,.38);
	padding: 0 1.5rem 0 .75rem;
	margin: 1rem 0 0;
	display: block;
}
@media screen and (min-width: 720px){
	#sm-sidebar li a {
		font-size: .9rem;
		padding: 0 2rem 0 1.5rem;
	}
}
/*S-MANGAトップ雑誌*/
#smanga-top-mags{
	max-width: 1280px;
	margin: 2rem auto;
}
#smanga-top-mags ul{
	list-style-type: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
#smanga-top-mags ul li{
	list-style-type: none;
	padding: 16px 0;
	width: 280px;
}
#smanga-top-mags ul li figure{
	width: 172px;
	margin: 8px auto;
}
#smanga-top-mags ul li figure img{
	vertical-align: bottom;
	border-radius: 1px;
	box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
}
#smanga-top-mags ul li a{
	display: table;
	margin: 0 auto;
}
#smanga-top-mags ul li a:hover figure img{
	box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);
}
#smanga-top-mags ul li a div {
	display: table;
	margin: 8px auto;
	text-align: center;
}
#smanga-top-mags ul li a div h3{
	font-size: .9rem;
	font-weight: bold;
	color: rgba(38,50,56,.87);
	display: inline-block;
}
#smanga-top-mags ul li a h3::before{
	content: "［";
	font-weight: normal;
}
#smanga-top-mags ul li a h3::after{
	content: "］";
	font-weight: normal;
}
#smanga-top-mags ul li a p{
	font-size: .8rem;
	display: inline-block;
}
#smanga-top-mags ul li i{
	font-size: 10px;
	color: rgba(255,255,255,1);
	background-color: #F44336;
	line-height: 12px;
	height: 12px;
	padding: 1px 4px;
	margin-right: 2px;
	display: inline-block;
	position: relative;
}
#smanga-top-mags ul li i:before,#smanga-top-mags ul li i:after,
#smanga-top-mags ul li i:before,#smanga-top-mags ul li i:after{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	z-index: -1;
	border-top: 6px solid #F44336;
	border-left: 3px solid #F44336;
	border-right: 3px solid #F44336;
	border-bottom: 6px solid #F44336;
	}
#smanga-top-mags ul li i:before,#smanga-top-mags ul li i:before{
	left: -3px;
	border-left-color: transparent;
	}
#smanga-top-mags ul li i:after,#smanga-top-mags ul li i:after{
	right: -3px;
	border-right-color: transparent;
	}
/*下部雑誌のヒュン*/
#smanga-top-mags figure{
	opacity: 0;
	will-change: transform,opacity;
}
/*レーベル名色変え（一応用意）ボーダーのみ*/
.grid-outer.ssman h3{border-left-color: #546E7A;/*青年グレー*/}
.grid-outer.ssgirl h3{border-left-color: #F48FB1;/*少女女性ピンク*/}
.grid-outer.ssboy h3,.grid-outer.ジャンプコミックス h3{border-left-color: #90CAF9;/*少年ブルー*/}

/*S-MANGA会員*/
#smanga-member{margin: 1.5rem auto;}
#smanga-member .cards-inner{
	margin: 0 auto;
	max-width: 520px;
	line-height: 1.5;
	}
	@media screen and (min-width: 600px){
		#smanga-member .cards-inner{padding:1rem;}
	}
#smanga-member p{margin: 1.5rem .5rem;}
#smanga-member ul,#smanga-member ol{margin: 1.5rem 1rem;}
#smanga-member ul li,#smanga-member ol li{
	margin:.5rem 1rem ;
	font-size: .95rem;
}
#smanga-member .preface{
	background-color:#ECEFF1;
	color: #78909C;
	padding: 1rem;
	margin: 1.5rem 1rem;
}
#smanga-member .preface p{
	margin: 0.5rem ;
	font-size: .85rem;
}
#smanga-member .preface ul{
	margin: 0.5rem ;
	list-style-type: circle;
}
#smanga-member .preface ul li{
	margin: 0.5em 0 0.5em 1.25em;
	line-height: 1.25;
	font-weight: bold;
}
#smanga-member section{
	margin: 1.5rem 0;
	padding:0 1rem;
}
#smanga-member h3{
	margin: 1rem auto;
	padding: 0;
}
@media screen and (min-width: 600px){
	#smanga-member section{margin: 3rem 0;}
}
#smanga-member h3 a{
	display: block;
	color: rgba(0,0,0,.64);
	margin: 0 auto;
	background-color: rgba(255,255,255,1);
	border: 1px solid rgba(0,0,0,.2);
	text-align: center;
	vertical-align: middle;
	font-size: 1.25rem;
	padding: 1em;
	border-radius: 8px;
	box-shadow: 0 1px 1px rgba(204,204,204,.1);
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	cursor: pointer;
	overflow: hidden;
	line-height: 1;
}
#smanga-member h3 a small{font-size: .85rem;}
#smanga-member h3 a:hover{
	border: 1px solid rgba(0,0,0,.24);
	color: rgba(0,0,0,.87);
}
#smanga-member h3 a:active{
	background-color: #263238;
	border: 1px solid #263238;
	color: #FFF;
}
.smanga-member-kiyaku p{font-size: .85rem;}
#smanga-member .cards-inner.smanga-member-kiyaku,
#smanga-member .cards-inner.smanga-member-faq{
	max-width: 960px;
}
.smanga-member-faq section{border-top:1px solid rgba(0,0,0,.12);}
.smanga-member-faq section:first-of-type{border-top:none;}
.smanga-member-faq p{font-size: .95rem;}
#smanga-member .smanga-member-faq h3{
	font-size: 1rem;
	margin: 1.5rem 0;
}
#smanga-member .smanga-member-faq h3::before{
	content: "Q.";
	display: inline-block;
	background-color: #455A64;
	color: #FFFFFF;
	font-size: 12px;
	width: 18px;
	height: 18px;
	line-height: 18px;
	border-radius: 3px;
	text-align: center;
	margin-right: .5rem;
	vertical-align: bottom;
}
@media screen and (min-width: 600px){
	#smanga-member .smanga-member-faq h3{
		font-size: 1.125rem;
		margin: 3rem 0;
	}
	#smanga-member .smanga-member-faq h3::before{
		font-size: 14px;
		width: 20px;
		height: 20px;
		line-height: 20px;
		border-radius: 4px;
	}
}
.smanga-member-faq .preface dt{
	font-weight: bold;
	margin: .5em 0;
}
.smanga-member-faq .preface dd{
	font-size: .85rem;
	padding-left: 1rem;
	margin: .5em 0;
}