/** *** INDEX *** **/
#main-contents {background-color:#000; padding:0 40px;}
.inner-box {width:auto; display:inline-block; margin:0 auto;}
.works-title {font-family:"Noto Sans SC",sans-serif; font-style:normal; font-size:2rem; color:#fff; font-weight:normal; line-height:2rem; padding:60px 0 40px; margin:0;}
.works-read {font-size:1.3rem; line-height:2rem; padding: 0 0 50px; color:#fff2e2;}

.life-of-composer {color:#fff2e2; text-align:center; font-size:1.3rem; background-color:#000; line-height:2.4rem; min-height:572px; padding:0 80px; width:100%; display:flex; align-items:center; position:relative;}
.life-of-composer-text {margin:0 auto; position:relative; z-index:1;}
.life-of-composer h3 {font-size:1.6rem; padding:0; margin:0 0 1.6rem 0; font-weight:normal;}
.life-of-composer p {}
.life-of-composer .annotation {font-size:0.9rem;}
.life-of-composer-bg {background:url(/works/images/bg-ryoichi-life-of-composer.png) 50% 0 no-repeat #000; background-size:cover; min-height:572px; padding:0 80px; width:100%; position:absolute; top:0; left:0; user-select:none;
	animation:fadeinbg 2s ease-in forwards;}
@keyframes fadeinbg {
  0% {
     opacity:0;
  }
  100% {
     opacity:1;
  }
}
/** /// INDEX /// **/


/** *** COMTAINER *** **/
.music-box {margin:0 auto 60px;}
.music-box:after {content:""; display:block; clear:both;}
.streaming-list {color:#fff2e2; font-size:1.3rem; line-height:2rem; float:left;}
.streaming-list li {display:inline-block; padding:0 80px 20px 0; vertical-align:top;}
.streaming-list li:last-child {padding:0 0 20px 0;}
.streaming-list li a {display:block; width:300px; color:#fff2e2;}
.streaming-list li .name {display:block;}
.streaming-list li .date {display:block; text-align:right; font-size:1rem;}


.representative-song {padding:0 0 80px;}
.title-representative-song {margin:0 auto 40px;}
.representative-song .song-list {}
.representative-song .song-list li {display:inline-block; padding:0 30px 30px 0;}
.representative-song .song-list li:nth-child(3n) {padding:0 0 30px 0;}
.representative-song .song-list li a {display:block;}
.representative-song .song-list li a:hover {}
.representative-song .song-list li.current a {opacity:0.4;}
/** /// COMTAINER /// **/




@media screen and (max-width:720px){
	/** *** INDEX *** **/
	#main-contents {background-color:#000; padding:0 0;}
	.inner-box {width:100%; display:block;}
	.works-title {padding:60px 10px 20px; margin:0 auto;}
	.works-read {font-size:1rem; line-height:1.6rem; padding:0 10px 50px;}

	.life-of-composer {float:none; padding:60px 10px; min-height:inherit; line-height:1.8rem;}
	.life-of-composer h3 {font-size:1.2rem; margin:1.2rem;}
	.life-of-composer p {font-size:0.9rem;}
	.life-of-composer .annotation {font-size:0.7rem;}
	.life-of-composer-bg {height:100%; min-height:inherit;}
	/** /// INDEX /// **/

	/** *** COMTAINER *** **/
	.streaming-list {font-size:1rem; line-height:1.6rem; float:none; display:flex; justify-content:start; flex-wrap:wrap; padding:0 5px 10px;}
	.streaming-list li {width:50%; display:block; padding:0 5px 20px; text-align:center;}
	.streaming-list li:last-child {padding:0 5px;}
	.streaming-list li a {width:auto;}
	.streaming-list li img {width:100%;}
	.streaming-list li .name {text-align:left;}
	.streaming-list li .date {font-size:0.9rem;}

	
	.representative-song {padding:0 0 40px;}
	.title-representative-song {padding:0 10px; margin:0 auto 30px;}
	.title-representative-song img {width:100%; max-width:374px;}
	.representative-song .song-list {text-align:center;}
	.representative-song .song-list li {display:block; margin:0 auto; padding:0 10px 20px;}
	.representative-song .song-list li:nth-child(3n) { padding:0 10px 20px;}
	.representative-song .song-list li img {width:100%; max-width:499px;}
	.representative-song .song-list li a {display:inline-block;}
	
	/** /// COMTAINER /// **/

}
