/*はじめに*/

.ph_cut {margin: 0;}
.about .contentsBlock h2, .about #read {
	font-weight: 700;
	text-align: center;
}
.about .contentsBlock h3 {color: #18328E;}
.tsume {letter-spacing: -0.05em;}
.phArea {background-image: url(../img/about/bg_photo.jpg); background-position: top center; background-size: contain;}


@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; padding: 15px;}
	.ph_cut, .ph_cut span {
    width: 600px;
    height: 840px;
    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.1em; line-height: 1.6em; max-width:18em; padding-bottom: 15px; }
.about .contentsBlock h3 {font-size: 1em; line-height: 1.6em; }
.about #read { font-size: 0.9em; 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 0; padding: 7px;}
	
	.ph_cut span {
    height: 0;
    padding: 140% 0 0;
    position: relative;
}
	.txtSm { font-size: 0.8em;}
	.notes { line-height: 1.5em;}

}

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

.commentBlock .comment {}
.commentBlock h4 {
	font-weight: 700;
	font-size: 1.6em;
	line-height: 1.0em;
	position: relative;
	display: inline-block;
	padding: 0 0 0 40px;}
.commentBlock h4:before {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 30px;
  height: 3px;
  background-color: #136325;
	left:0;
}
.commentBlock h4 .small { font-size: 0.8em;}



@media all and (min-width: 768px) {
	.commentArea { margin-bottom: 2em;}
	.commentArea .button {width: 300px; height: 80px;}

	.commentBlock { padding: 40px 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: 225px; height: 60px;}
	.commentBlock { padding: 40px 0 0;}
	.commentBlock .comment:not(:last-child) { padding-bottom: 2em;}		
	.commentBlock h4 { font-size: 1.3em; padding: 0 0 0 35px;}
	.commentBlock h4:before {width: 25px;}
	.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;}

}
