/*主題歌*/

@media all and (min-width: 768px) {
#contentsArea  {background-image: url(../img/music/bg.png); background-repeat: no-repeat; background-position: center top;}
.contentsBlock { padding: 40px 50px;}
}
@media all and (max-width: 767px) {
#contentsArea  {
	background-image: url(../img/music/sp_bg_l.png), url(../img/music/sp_bg_r.png); 
	background-repeat: no-repeat, no-repeat; 
	background-position: left top, right top;
	background-size: 29.71% auto, 31.88% auto;
	}
.contentsBlock { padding: 30px 20px 10px;}
}

.musicBlock { padding-bottom: 2em;}
h2 { margin-bottom: 1em; }
h2 .name { color:#e5007f;}
h2 .tit { padding-bottom: 0.2em; display: block;}

.notes {font-size: 0.7em; line-height: 1.5em; }
.spacing {letter-spacing: -.2em;}

/*.ph_cut span, .ph_cut_l span {
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
}*/


.txtArea h3 {background-image: url(../img/bg_tit.png); background-repeat: repeat-x; background-position: center bottom;
padding: 0 8px 8px 8px;
display: inline-block; margin-bottom: 10px; font-size: 1.5em; line-height: 1.0em;
font-family: maru-maru-gothic-alr-stdn, sans-serif;
font-weight: 900;
font-style: normal;}
.txtArea h3 .small { font-size: 0.8em;}


.infoArea { border: solid 2px #ffcce4; padding: 1em; margin: 1em 0; line-height: 1.5em;}
.infoArea h3 {font-size: 1.2em; line-height: 1.6em; padding-bottom: 1em; color:#e5007f;}
.infoArea h4 {font-size: 1.05em;}
.infoArea .infoTxt div { border-top: dotted 1px #ffcce4; }

.phJacket span{
  display: block;
  position: relative;
background-size: 100%;
}

@media all and (min-width: 768px) {
	.ph_cut, .ph_cut span {
    width: 700px;
    height: 496px;
    background-size: cover;
    background-repeat: no-repeat;
	background-position: center center;
	}
	
	h2 { line-height: 2.0em!important;}
	.txtSm { font-size: 0.9em;}
	.txtMusic { padding-bottom: 2.0em!important;}
	
	.infoArea { padding: 30px;}
	.phJacket { display: inline-block; margin-right: 30px; vertical-align: top;}
  .phJacket,
  .phJacket span {
    width: 250px;
    height: 250px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
  }
.infoTxt { /*display: inline-block; width:555px; vertical-align: top;*/} 
	.infoArea .infoTxt div { padding: 1.5em 1em; }
}
@media all and (max-width: 767px) {
	.ph_cut span {
    height: 0;
    padding: 70.857% 0 0;
    position: relative;
}
		
			
	.txtSm { font-size: 0.8em;}
	.notes { line-height: 1.5em;}
	.txtArea h3 { font-size: 1.6em; display: block; text-align: center;}
	.txtMusic { padding-bottom: 1.5em!important;}

  .phJacket span img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }

  .phJacket {
    width: 100%;
    box-sizing: border-box; margin-bottom: 10px;
  }

  .phJacket span {
    height: 0;
    padding: 100% 0 0;
    position: relative;
  }
	.infoArea .infoTxt div { padding: 1.2em 0.5em; }
}