@charset "UTF-8";
/* 一時調整用 CSS Document */

.caution {
    margin-top: 16px;
}

span.caution {
	color:#ffffcc;
}



.subpage .hdr-title {
	padding-bottom:30px;
}


.pc-only {
	display:block;
}

.sp-only {
	display:none;
}

#navigator {
width:700px;
margin:0 auto 40px;
display: flex;
flex-direction: row-reverse;
align-items: center;
}

#navigator .ttl_icon {
text-align:left;
padding: 0 40px 0 0;
}

#navigator h2 {
  font-size: 26px;
  font-size: 2.6rem;
	color:#d8cbc5;
	margin-bottom:30px;
}

#navigator .navi_photo{
width:245px;
}

#navigator .navi_photo img{
width:100%;
}

#block_playlist {
text-align:left;
}

#songlist #block_playlist {
	width: 850px;
	margin: 0 auto;
  padding: 40px 30px;
	background-color:#281e1c;
	border-radius:6px;
}

#songlist #block_playlist .list_songs {
  margin-bottom: 50px;
}

#songlist h3 span {
	display:block;
  font-size: 16px;
  font-size: 1.6rem;
  font-family: "Oswald", sans-serif;
  font-weight: 600;
  margin-bottom: 26px;
}

#songlist #block_playlist h3 span:before {
  width: 25px;
  height: 21px;
  margin-right: 10px;
  position: relative;
  top: 2px;
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCAyNC45IDIwLjciIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDI0LjkgMjAuNzsiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+LnN0MHtmaWxsLXJ1bGU6ZXZlbm9kZDtjbGlwLXJ1bGU6ZXZlbm9kZDt9PC9zdHlsZT48cGF0aCBpZD0iaWNvbiIgY2xhc3M9InN0MCIgZD0iTTI0LjMsMy4zYy0wLjItMC4zLTAuNS0wLjYtMC45LTAuOXYwYy0wLjQtMC4yLTAuOC0wLjQtMS4yLTAuNmMtMS42LTAuNi0xLjctMS0xLjctMS4xdjBjMC0wLjQtMC40LTAuOC0wLjgtMC43QzE5LjQsMCwxOSwwLjQsMTksMC44djBsLTAuMSwxMy44Yy0xLjctMS4xLTMuOS0xLjEtNS42LDAuMWMtMS40LDEtMS43LDIuOS0wLjcsNC4zYzAuMiwwLjMsMC40LDAuNSwwLjcsMC43YzEuNywxLjMsNC4xLDEuMyw1LjgsMC4xYzAuOC0wLjYsMS4zLTEuNSwxLjMtMi41djBsMC4xLTE0LjVjMC40LDAuMiwwLjgsMC40LDEuMiwwLjZjMC4zLDAuMSwwLjYsMC4yLDAuOCwwLjRsMCwwYzAuMiwwLjEsMC4zLDAuMywwLjUsMC41YzAuMywwLjYsMC40LDEuMywwLjEsMS45Yy0wLjIsMS0wLjcsMi0xLjQsMi44Yy0wLjMsMC4zLTAuMywwLjgsMCwxLjFjMCwwLDAsMCwwLDBjMC4zLDAuMywwLjgsMC4zLDEuMS0wLjFjMC44LTEsMS40LTIuMSwxLjctMy4zQzI1LjEsNS41LDI1LDQuMywyNC4zLDMuM3ogTTQuOCwzLjdoMTAuNEMxNS42LDMuNywxNiwzLjQsMTYsM2MwLTAuNC0wLjMtMC44LTAuOC0wLjhjMCwwLDAsMCwwLDBINC44QzQuNCwyLjIsNCwyLjUsNCwyLjlTNC40LDMuNyw0LjgsMy43TDQuOCwzLjd6IE0xLjIsMS44QzAuNSwxLjgsMCwyLjMsMCwzYzAsMC43LDAuNSwxLjIsMS4yLDEuMmMwLjYsMCwxLjItMC41LDEuMi0xLjJDMi40LDIuMywxLjksMS44LDEuMiwxLjhDMS4yLDEuOCwxLjIsMS44LDEuMiwxLjhMMS4yLDEuOHogTTQuOCw4LjFoMTAuNGMwLjQsMCwwLjgtMC4zLDAuOC0wLjhjMC0wLjQtMC4zLTAuOC0wLjgtMC44YzAsMCwwLDAsMCwwSDQuOEM0LjQsNi41LDQsNi45LDQsNy4zUzQuNCw4LjEsNC44LDguMUw0LjgsOC4xeiBNMS4yLDYuMUMwLjUsNi4xLDAsNi43LDAsNy4zYzAsMC43LDAuNSwxLjIsMS4yLDEuMmMwLjYsMCwxLjItMC41LDEuMi0xLjJDMi40LDYuNiwxLjksNi4xLDEuMiw2LjFMMS4yLDYuMXogTTQuOCwxMi40aDcuNGMwLjQsMCwwLjgtMC4zLDAuOC0wLjhjMC0wLjQtMC4zLTAuOC0wLjgtMC44YzAsMCwwLDAsMCwwSDQuOGMtMC40LDAtMC44LDAuMy0wLjgsMC44QzQsMTIuMSw0LjQsMTIuNCw0LjgsMTIuNEM0LjgsMTIuNCw0LjgsMTIuNCw0LjgsMTIuNHogTTEuMiwxMC40QzAuNSwxMC41LDAsMTEsMCwxMS42czAuNSwxLjIsMS4yLDEuMmMwLjcsMCwxLjItMC41LDEuMi0xLjJDMi40LDExLDEuOSwxMC40LDEuMiwxMC40eiBNOS4yLDE1LjJINC44QzQuNCwxNS4yLDQsMTUuNSw0LDE2YzAsMC40LDAuMywwLjgsMC44LDAuOGMwLDAsMCwwLDAsMGg0LjRjMC40LDAsMC44LTAuNCwwLjgtMC44QzEwLDE1LjUsOS42LDE1LjIsOS4yLDE1LjJ6IE0xLjIsMTQuOEMwLjUsMTQuOCwwLDE1LjMsMCwxNmMwLDAuNywwLjUsMS4yLDEuMiwxLjJjMC43LDAsMS4yLTAuNSwxLjItMS4yQzIuNCwxNS4zLDEuOSwxNC44LDEuMiwxNC44eiIvPjwvc3ZnPg==);
  background-size: cover;
  background-repeat: no-repeat;
}


#songlist .song {
  width: 100%;
}

#songlist #block_playlist .song .song_wrap {
border: 1px solid #8a7768;
border-radius:6px;
background-color:#342926;
margin-bottom: 12px;
}

#songlist .song .col_l {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: flex;
  padding: 0 10px;
}


#songlist .song .song_inner {
    padding: 20px 16px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    justify-content: space-between;
}

#songlist .song .col_l {
    width: 100%;
    align-items: center;
}

#songlist .song .col_l .img figure {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
		border-radius: 4px;
}

#songlist .song .col_l .song_info {
    width: calc(100% - 115px);
    margin-left: 15px;
}

#songlist .song .col_r {
    justify-content: space-between;
    align-items: start;
    margin-top: 0px;
    padding-top: 10px;
}

#songlist .song .col_l .song_info p.time {
    margin-bottom: 14px;
    font-size: 14px;
    font-size: 1.4rem;
		color:#8a7768;
}

#songlist .song .col_l .song_info h4 {
    font-size: 16px;
    font-size: 1.6rem;
		color:#d8cbc5;
    margin-bottom: 6px;
}

#songlist .song .col_l .song_info p.txt_artist span {
    font-size: 15px;
    font-size: 1.5rem;
}

#songlist .song .col_l .song_info p.txt_artist span:before {
    content: "";
    width: 18px;
    height: 18px;
    display: inline-block;
    position: relative;
    top: 3px;
    margin-right: 4px;
    background: url(/original/universe/music_lounge/asset/img/icon_artist.svg);
    background-size: cover;
    background-repeat: no-repeat;
}

#songlist .song .col_r ul.btn_buy li {
    margin-bottom: 4px;
}

#songlist .song .col_r ul.btn_buy li {
    width: 100%;
    margin-bottom: 10px;
}


#songlist .song .col_l .img {
        width: 120px;
        height: 120px;
    }

#songlist .song .col_l .img {
    width: 120px;
    height: 120px;
    position: relative;
}

#songlist .song .col_l .img figure {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}


#navigator_list {
	margin-top:60px;
}

#navigator_list h2 {
	margin-top:60px;
}

#navigator_list .sub_txt {
	margin:40px 0 30px;
}


#navigator_list ul{
    width: 800px;
    margin: 0 auto 40px;
    display: flex;
    justify-content: space-around;
}

#navigator_list li img{
    width: 160px;
}

#navigator_list li a{
    text-decoration:none;
}

#navigator_list li a .navi-name {
	font-size:16px;
	color:#d8cbc5;
	margin:10px auto;
}

#navigator_list li a .navi-days {
	font-size:12px;
	color:#8a7768;
}


@media(width <= 768px) {
	.pc-only {
		display:none !important;
	}

	.sp-only {
		display:block;
	}

	#navigator {
	    width: 100%;
	    margin: 0 auto;
	    display: flex;
	    flex-direction: column;
	    align-items: center;
	}

	#navigator h2 {
		text-align:center;
    margin-top: 20px;
    font-size: 2.0rem;
	}

	#navigator .ttl_icon {
		padding:0 40px;
	}

	#songlist #block_playlist {
		width: 100%;
		padding: 40px 0;
	}

	#songlist .song .song_inner {
    display: block !important;
    padding: 10px 0px 0;
	}

	#songlist .song .col_l .img {
	    width: 98px;
	    height: 98px;
	    position: relative;
	}

	#songlist .song .col_l .song_info {
	    width: calc(100% - 100px);
	    margin-left: 15px;
	}

	#songlist .song .col_r ul.btn_buy {
		display: flex;
		border-top: solid 1px #8a7768;
		padding: 10px 0 0 0;
		width: 96%;
		margin: 0 auto;
	}

	#songlist .song .col_r ul.btn_buy li {
	    width: 100%;
	    margin: 0 5px 10px;
	}

	#navigator_list ul {
		width: 100%;
		margin: 0 auto 40px;
		display: flex;
		justify-content: space-around;
		flex-wrap: wrap;
	}

	#navigator_list ul li {
		margin: 0 5px 30px;
	}
}