@charset "UTF-8";

.container-magazine .content ul,.container-magazine .content ul li{
	list-style: none;
}

.container-magazine .content .pc{
	display: inherit;
}

.container-magazine .content .sp{
	display: none;
}
/*レーベル各種色変更*/

.renai-syokora{
	background: #fcd3df;
}

.gaticomi{
	background: #e3e3e3;
}

.black-syokora{
	background: #fbd3df
}

/*lineup 色変更*/

.renai-syokora .magazine-title{
	background: #ff356e;
}

.gaticomi .magazine-title{
	background: #00AE9C;
}

.black-syokora .magazine-title{
	background: #ff4d7e;
}

/*色変更ここまで*/

#main #container.container-magazine{
	width: 100%;
}

.backnumber_gallery dl{
	float: left;
	margin-top: 10px;
	text-align: center;
	width: 25%;
}

/*magazine*/

#main #container .content.content-magazine{
	width: 100%;
	max-width: 950px;
	margin: auto;
	float: none;
}

.magazine-top .su-row{
	display: flex;
	justify-content: space-between;

}

.su-column01{
	width: 385px;
}

.su-column02{
	width: 270px;
	padding: 0 20px;
}

.su-column03{
	width: 250px;
}

.backnum_link{
	padding: 20px 0 0 0 !important;
	border-top: 1px solid #fee9ef;
}

.magazine-title{
	background: #ff356e;
	color: #fff;
	text-align: center;
	font-size: 16px;
	line-height: 1.5;
	padding: 10px 0;
	margin: 35px 0 40px;
}

.magazine-title span{
	color: #fff;
	font-size: 30px;
	line-height: 1.5;
}

.magazine-list{

}
.magazine-list > ul{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 0px 0px 20px -30px !important;
}

.magazine-list > ul li{
	max-width: 456px;
	width: 100%;
	list-style: none !important;
	margin: 0px 0px 30px 30px !important;
	background: #fff;
	border-radius: 10px;
	padding: 17px !important;
	box-sizing: border-box;
}
.magazine-list > ul li .top{
	display: flex;
	justify-content:space-between;
	margin-bottom: 15px;
	padding-bottom: 15px;
	border-bottom: 1px solid #e7e7e7;
}
.magazine-list > ul li .left_img{
	width: 180px;
	box-sizing: border-box;
	margin-bottom: 0;
}
.magazine-list > ul li .left_img img{
	width: 100%;
}

.magazine-list > ul li .right_txt{
	width: 220px;
	box-sizing: border-box;
	margin-bottom: 0;	
}

.magazine-list > ul li .right_txt .txt01{
	color: #ff356e;
	font-size: 14px;
	font-weight: bold;
}

.magazine-list > ul li .right_txt .txt02{
	font-size: 18px;
	font-weight: bold;
	display: inline-block;
	margin: 10px 0;
}

.magazine-list > ul li .right_txt .txt03{
	color: #00ae9c;
	font-size: 20px;
	font-weight: bold;
}

.magazine-list > ul li .bottom{
	line-height: 170%;
	padding: 0px;
}

.magazine-list > ul li .bottom .bottom_txt{
	line-height: 170%;
	padding: 0px;
}




/*タグカラー基礎*/
.tag_list > ul {
	display: flex;
	justify-content: left;
	flex-wrap: wrap;
	margin:0 0 0 -13px !important;
}

.magazine-list > ul li .tag_list > ul .tag{
	color: #fff;
	background: #e9e9e9;
	font-weight: bold;
	display: inline-block;
	border-radius: 0;
	padding: 7px 10px 5px !important;
	margin: 0 0 10px 13px !important;
	width: auto;
}

.magazine-list > ul li .tag_list > ul .tag_eposode{
	color: #ff356e;
	background: #fcd3df;
}
.magazine-list > ul li .tag_list > ul .tag_kouhyou{
	background: #ff356e;
}
.magazine-list > ul li .tag_list > ul .tag_sinreisai{
	background: #00c1aa;
}
.magazine-list > ul li .tag_list > ul .tag_shortcomic{
	background: #ff984d;
}
.magazine-list > ul li .tag_list > ul .tag_comic{
	background: #ec6ac9;
}
.magazine-list > ul li .tag_list > ul .tag_omake{
	background: #ec8380;
}
.magazine-list > ul li .tag_list > ul .tag_corabo{
	background: #77aae8;
}

/*タグカラー、カテゴリ毎*/

.gaticomi .magazine-list > ul li .tag_list > ul .tag_eposode{
	color: #5f6468;
	background: #c4ccd6;
}

.gaticomi .magazine-list > ul li .tag_list > ul .tag_kouhyou{
	background: #b20200;
}

.gaticomi .magazine-list > ul li .tag_list > ul .tag_sinreisai{
	background: #00c1aa;
}




@media screen and (max-width:660px) {

	.container-magazine .content .pc{
		display: none;
	}

	.container-magazine .content .sp{
		display: inherit;
	}

	.magazine-top{
		padding: 0 15px;
	}

	.magazine-top .su-row{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	.su-column01{
		width: 100%;
	}
	
	.su-column02{
		width: 100%;
		padding: 40px 0 20px;
	}

	.su-column02 ul{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.su-column02 ul li{
		width: 49%;
	}

	
	.su-column03{
		width: 100%;
	}

	.su-column03 iframe{
		width: 100% !important;
	}

	.magazine-list{
		padding: 0 15px;
	}

	.magazine-list > ul{
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}

	.magazine-list > ul li {
		max-width: 100%;
		list-style: none !important;
		margin-bottom: 30px !important;
		background: #fff;
		border-radius: 10px;
		padding: 17px !important;
		box-sizing: border-box;
	}

	.magazine-list > ul li .left_img{
		width: 46%;
	}
	.magazine-list > ul li .right_txt{
		width: 50%;
	}
	.magazine-list > ul li .top{
		margin-bottom: 20px;
		padding-bottom: 17px;
	}

	/*タグカラー基礎*/
	.tag_list > ul {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		margin:0 0 0 -13px !important;
	}
	.magazine-list > ul li .tag_list > ul .tag{
		color: #fff;
		font-weight: bold;
		display: inline-block;
		border-radius: 0;
		padding: 7px 10px !important;
		margin-bottom: 10px !important;
		margin-left: 13px;
	}

}