/*はじめに*/

.ph_cut {margin: 0;}
.about #intro{font-family: noto-sans-cjk-jp, sans-serif;
font-weight: 700;
font-style: normal;
font-size: 1.1em;
line-height: 1.8em;}
.about #read{font-family: noto-sans-cjk-jp, sans-serif;
font-weight: 900;
font-style: italic;
color: #0070c6;
font-size: 1.5em;
line-height: 1.8em;
text-align: center;
padding-top: 0.5em;}
.txtArea { padding: 0px 0px;}

.tsume {letter-spacing: -0.05em;}
.phArea::after {
  /* 疑似要素で同じ大きさのboxを作り、position: absoluteで背面に表示 */
  content: '';
  display: block;
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;

  /* ①疑似要素のボックスを影色で塗りつぶし */
 background: linear-gradient(rgba(255,245,76,1), rgba(0,172,81,1));
  /* ②ブラーフィルターでぼかす */
  filter: blur(0px);
  /* ③位置やサイズを調整 */
  transform: translateY(15px) translateX(15px) scale(1.00);
  /* ④乗算で重ねる */
		mix-blend-mode: multiply;
	opacity: 0.5;}

.charaBlock strong {font-weight: 800; font-size: 1.05em;}


@media all and (min-width: 768px) {
	.aboutBlock { padding-bottom: 2em;}
	
	.charaBlock { padding-top: 30px;}

	.phArea {width: 800px; margin: 30px auto;}
	.ph_cut, .ph_cut span {
    width: 800px;
    height: 564px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
	
}
	.charaBlock .phArea {width: 600px;}
	.charaBlock .ph_cut, .charaBlock .ph_cut span {width: 600px; height: 514px;}
	.charaBlock#cast05 .ph_cut, .charaBlock#cast05 .ph_cut span {width: 600px; height: 562px;}
	.txtSm { font-size: 0.9em;}
	
	
}
@media all and (max-width: 767px) {
	.aboutBlock { padding-bottom: 2em;}
	.about #intro{font-size: 0.9em;}
	.about #read{font-size: 1.0em;}


.notes {font-size: 0.5em; line-height: 1.5em; }
.spacing {letter-spacing: -.2em;}
	
	.charaBlock { padding-top: 1em;}
	
	.phArea {margin: 20px auto; width: 100%;}
	.phArea::after {transform: translateY(8px) translateX(8px) scale(1.00);}
	
	.ph_cut span {
    height: 0;
    padding: 70.5% 0 0;
    position: relative;
}
	.charaBlock .phArea {width: 90%;}
	.charaBlock .ph_cut span {width: 100%; height: 0px; padding-top:85.666%; }
	.charaBlock#cast05 .ph_cut span {width: 100%; height: 0px; padding-top:93.666%;}
	
	.txtSm { font-size: 0.8em;}
	.notes { line-height: 1.5em;}

}

/*	comment
============================== */
/*アコーディオン*/
.button {
  cursor: pointer;
}
.content {
  display: none;
}
.commentArea .button{
    text-align: center;
    margin: 0 auto;
	padding: 15px 0;
	font-family: noto-sans-cjk-jp, sans-serif;
	font-weight: 900;
	font-style: italic;
	color: #fff100;
	font-size: 1.5em;
	display: block;
	transition:0.5s;
	background-image: url(../img/bg_btn.png);
}
.commentArea .button:hover {filter: brightness(1.1);}
.commentArea .button span {background-image: url(../img/arrow_down.png);
	background-repeat:no-repeat;
	background-position: left center;
	background-size: 24px 26px;
	padding-left: 40px;
display: inline-block; min-height: 26px;}

.commentBlock .comment {border-top: solid 2px #000;}
.commentBlock h4 { display: inline-block; background-image: url(../img/bg_line.png);
	font-family: noto-sans-cjk-jp, sans-serif;
	font-weight: 700;
	font-style: italic;
	color: #fff;
	font-size: 1.4em; line-height: 1.5em; padding:0 15px 5px; margin-bottom: 5px;}
.commentBlock h4 .small { font-size: 0.8em;}
.commentBlock dl dt { 
	font-family: kinto-sans, sans-serif;
	font-style: normal;
	font-weight: 700;
	color: #288048; font-size: 1.15em; line-height: 1.6em; padding-bottom: 0.3em;}
.commentBlock dl dd { line-height: 2.0em;}


@media all and (min-width: 768px) {
	.commentArea { margin-bottom: 2em;}
	.commentArea .button{
	font-size: 1.5em;
}
	.commentBlock { padding: 40px 0 0;}
	.commentBlock .comment:not(:last-child) { padding-bottom: 3em;}
	.commentBlock .txt, .commentBlock dl { padding: 10px 0;}
	
}

@media all and (max-width: 767px) {
	.commentArea { margin-bottom: 1.5em;}
	.commentArea .button{
		font-size: 1.3em;
		padding: 12px 0;
	}
	.commentArea .button span {
	background-size: 20px 22px;
	padding-left: 30px;}
	.commentBlock { padding: 20px 0 0;}
	.commentBlock .comment:not(:last-child) { padding-bottom: 2em;}		
	.commentBlock h4 { font-size: 1.2em; padding:0 12px 3px;}
	.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;}

}