@charset "UTF-8";

#release {
	padding: 70px 0 0;
}

/*********************************************
 release list
*********************************************/

.release-list {
	padding: 0;
	list-style: none;
	letter-spacing: -.4em;
}

.release-list li {
	margin: 0 20px 40px 0;
}

.release-list li:nth-of-type(4n) {
	margin: 0 0 40px;
}

.release-list li a::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 235px;
	height: 235px;
	z-index: 10;
	background-color: rgba(22, 23, 31, .5);
	transition: opacity .2s;
	opacity: 0;
}

.release-list li a:hover::after {
	opacity: 1;
}


/*********************************************
 release detail
*********************************************/

#release-detail {
	margin-bottom: 70px;
	padding-bottom: 70px;
	border-bottom: solid 1px #fff;
	overflow: hidden;
}

h3.r-d-h3 {
	font-size: 1.4rem;
	font-weight: 400;
	margin-bottom: 13px;
}

.r-d-images {
	float: left;
	width: 390px;
	text-align: center;
}

.r-d-images img {
	width: 100%;
	height: auto;
	margin-bottom: 10px;
}

.r-d-images a.r-d-button {
	position: relative;
	display: inline-block;
	width: 300px;
	height: 60px;
	margin-top: 20px;
	padding-right: 63px;
	background-color: #fff;
	border-radius: 9px;
	font-size: 1.8rem;
	line-height: 60px;
	color: #16171f;
	text-decoration: none;
}

.r-d-images a.r-d-button::after {
	content: "";
	position: absolute;
	top: 13.5px;
	right: 30px;
	display: inline-block;
	width: 33px;
	height: 33px;
	background: url(../img/common/icon-play.png) no-repeat;
	vertical-align: -9.5px;
}

.r-d-info {
	margin: 0 0 0 420px;
}

.r-d-info h2 {
	font-size: 2.6rem;
	font-weight: 400;
	margin-bottom: 16px;
}

.r-d-info h2 a {
	display: block;
	margin-top: 8px;
	font-size: 1.8rem;
	text-decoration: none;
}

.r-d-info h2 a span {
	text-decoration: underline;
}

.r-d-info h2 a::after {
	content: " \00bb";
	font-size: 1.2rem;
	text-decoration: none;
}


.r-d-info h2 .artistnames {
	display: block;
	margin-top: 8px;
	font-size: 1.8rem;
}

.r-d-info h2 .artistnames a {
	display: inline;
	text-decoration: underline;
}

.r-d-info h2 .artistnames a::after {
	display: none;
}

.r-d-info .date {
	font-size: 1.4rem;
}


.r-d-info h3.r-d-h3 {
	margin: 40px 0 10px;
}

ol.tracklist {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: tlcounter;
	border-top: solid 1px #494949;
}

ol.tracklist li {
	position: relative;
	padding: 15px 80px;
	border-bottom: solid 1px #494949;
	line-height: 2rem;
}

ol.tracklist li::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 50px;
	padding: 15px 0;
	content: counter(tlcounter, decimal-leading-zero) ":";
	counter-increment: tlcounter;
	text-align: right;
}

#release-detail-comments {
	margin-bottom: 80px;
}

#release-detail-comments ul {
	list-style: none;
	padding: 20px 0 0;
	background-color: #717171;
	font-size: 1.4rem;
}

#release-detail-comments ul li {
	padding: 0 20px 20px;
	line-height: 2rem;
	overflow: hidden;
}

#release-detail-comments ul li img {
	float: left;
	width: 128px;
	height: 128px;
}

.c-c-comment {
	margin: 0 0 0 147px;
}

#release-detail-comments ul li h4 {
	margin: 6px 0 0;
	font-size: 1.6rem;
}

#release-detail-comments ul li h4 span {
	font-size: 1.2rem;
	margin: 0 0 0 6px;
}

#release-detail-comments ul li h5 {
	font-size: 1.4rem;
	margin: 20px 0 0;
}

#release-detail-comments ul li p {
	margin: 1em 0 0;
}

#release-detail-keyword {
	margin: 0 0 70px;
}

#release-detail-keyword .keyword-list {
	text-align: left;
}

#release-detail-keyword .keyword-list li {
	margin: 0 10px 10px 0;
	text-align: center;
}

/* add 2019/07/29 */
#release-detail .r-d-info-more {
	margin: 20px 0 0;
	font-size: 1.4rem;
	line-height: 2.2rem;
}

#release-detail .r-d-info-more p {
	margin: 0 0 1em;
}
