/*はじめに*/

.ph_cut {margin: 0;}
.about .contentsBlock h2, .about #read {
	font-family: m-plus-1p, sans-serif;
font-weight: 900;
font-style: normal;
	text-align: center;
}
.about .contentsBlock h3 {color: #009a93;}
.tsume {letter-spacing: -0.05em;}
.phArea {}


@media all and (min-width: 768px) {
	.aboutBlock { padding: 25px 0 50px;}
	.about .contentsBlock h2 p {font-size: 1.8em; line-height: 1.8em; padding-bottom: 20px; }
	.about .contentsBlock h3 {font-size: 1.2em; line-height: 1.8em; }
	.about #read { font-size: 1.4em; line-height: 2.0em; padding-bottom: 1em;}
	
	.phArea {width: 600px; margin: 30px auto;}
	.phArea .ph_cut, .ph_cut span {
    width: 600px;
    height: 849px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
	.poster{width: 800px; margin: 0 auto 30px;}
	.poster .ph_cut, .poster .ph_cut span {
    width: 800px;
    height: 565px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
	.txtSm { font-size: 0.9em;}
	
	
}
@media all and (max-width: 767px) {

.about .contentsBlock h2 p {font-size: 1.2em; line-height: 1.6em; padding:0 0.4% 15px; }
.about .contentsBlock h3 {font-size: 1em; line-height: 1.6em; }
.about #read { font-size: 1em; line-height: 1.6em; padding-bottom: 1em;}
.aboutBlock { padding: 0 0 25px;}
.notes {font-size: 0.5em; line-height: 1.5em; }
.spacing {letter-spacing: -.2em;}
	
	.phArea {margin: 0 auto;}
	.poster {margin: 0 auto 1em;}
	
	.phArea .ph_cut span {
    padding: 141.5% 0 0;
}
	.poster .ph_cut span {
    padding-top: -webkit-calc(565 / 800 * 100%); padding-top: calc(565 / 800 * 100%);
}
	.txtSm { font-size: 0.8em;}
	.notes { line-height: 1.5em;}

}

/*	comment
============================== */
/*アコーディオン*/
.button {
  cursor: pointer;
}
.content {
  display: none;
}
.commentArea .button{margin: 0 auto; background-color: #000; background-repeat: no-repeat; background-position: center center; background-size: contain; background-image: url(../img/about/btn_comment.png); text-indent:-9999px; display: block; transition:0.5s;}
.commentArea .button:hover { opacity:0.8;}


.commentBlock .comment {}
.commentBlock h4 {
	font-size: 1.8em;
	font-weight: 900;
	line-height: 1.0em;
	position: relative;
	padding: 0 5px 10px;
	margin-bottom: 0.2em;

}
.commentBlock .cast h4 {border-bottom: solid 3px #f53475;}
.commentBlock .staff h4 {border-bottom: solid 3px #009a93;}
.commentBlock h4 .small { font-size: 0.8em;}




@media all and (min-width: 768px) {
	.commentArea { margin-bottom: 2em;}
	.commentArea .button {width: 300px; height: 80px; background-size:246px 30px;
	border-radius: 40px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;}

	.commentBlock { padding: 50px 0 0;}
	.commentBlock .comment:not(:last-child) { padding-bottom: 3em;}
	.commentBlock .txt, .commentBlock dl { padding: 10px 0;}
	.content { padding-top: 15px;}
	
}

@media all and (max-width: 767px) {
	.commentArea { margin-bottom: 1.5em;}
	.commentArea .button{width: 200px; height: 60px; background-size:165px 20px;
	border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;}
	.commentBlock { padding: 40px 0 0;}
	.commentBlock .comment:not(:last-child) { padding-bottom: 2em;}		
	.commentBlock h4 { font-size: 1.3em; padding: 0 3px 6px;}
	.commentBlock .txt, .commentBlock dl { padding:10px 0;}
	.commentBlock dl dt { 
		font-size: 1.1em; padding-bottom: 0.3em;}
	.commentBlock dl dd { font-size: 0.9em; line-height: 1.8em;}

}