/*原作*/
.original .contentsBlock h2, .original #read {
font-family: "sicprintemps", sans-serif;
font-weight: 800;
font-style: normal;
text-align: center;
}
.original #read { position: relative; font-weight: 600; color: #7A4D01;}
.publisher {font-weight: 400; font-size: 0.6em;}

.calligraphy span{ display: block; padding-top: 100%; padding-top: -webkit-calc(1000 / 703 * 100%); padding-top: calc(1000 / 703 * 100%);
background-repeat: no-repeat;
-webkit-background-size: cover;
background-size: cover;
position: relative;
margin: 0 ; height: 0;
border: solid 1px #ccc;
}
.calligraphy span img {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
#calligraphyArea p {text-align: center; font-size:0.8em; padding-top: 5px;}

.commentArea {width: 100%; position: relative;}
.commentArea .commentBlock .commentBox {
	border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    background-image:url(../img/bg_karte.jpg?2);
	background-repeat:repeat; background-position: center top;
	position: relative;}
.commentArea .commentBlock .commentBox .inner { background-color:#fff;}
.commentArea .commentBlock .commentBox .deco.clip span { height:0; padding-top: -webkit-calc(65 / 254 * 100%); padding-top: calc(65 / 254 * 100%); z-index: 100; }

.commentBlock h3 {line-height: 1.5em; margin-bottom: 1.2em; text-align: center;}
.commentBlock h3 span.under {
	background: linear-gradient(transparent 50%, #DFD6C5 50%);
	color: #000;
    padding: 0 5px 5px;}
.commentBlock h4 {
	font-size: 1.6em;
	line-height: 1.0em;
	position: relative;
	display: inline-block;
	padding: 0 0 0 40px;
	margin-bottom: 0.5em;
	color: #000;}
.commentBlock h4:before {
  content: '';
  position: absolute;
  top: 0.5em; left:0;
  display: inline-block;
  width: 30px;
  height: 3px;
  background-color: #7A4D01;
	
}
.commentBlock h4 .small { font-size: 0.8em;}

@media all and (min-width: 768px) {
	.originalBlock { padding: 0;}
	.original .contentsBlock h2 {font-size: 2.2em; line-height: 1.4em; padding-bottom: 20px; }
	.original #read { font-size: 1.5em; line-height: 1.8em; padding: 30px 0;}
	#calligraphyArea { width: 880px; margin:0 auto 10px; }
	.calligraphy {width: 450px; margin: 0 auto;}
	
	.commentArea  { padding:0 0 45px; }
	.commentArea .commentBlock {padding: 30px 30px 45px;}
	.commentBlock h3 { font-size: 1.4em;}
	.commentArea .commentBlock .commentBox { padding: 30px 20px 20px; }
	.commentArea .commentBlock .commentBox .inner { padding:60px 0 20px; }
	.commentArea .commentBlock .commentBox .deco.clip { position: absolute; top:5px; left:50%; margin-left: -127px; width: 254px; }
	.commentArea .commentBlock .comment {width: 900px; margin: 0 auto;}
	.commentArea .commentBlock .comment section.txtArea { margin-bottom: 0;}
	.commentBlock .comment:not(:last-child) { margin-bottom: 3em;}
	.commentBlock .txtArea p.txt {width: auto;
    }
}

@media all and (max-width: 767px) {
.originalBlock { padding:0;}
.original .contentsBlock h2 {font-size: 1.3em; line-height: 1.4em; padding-bottom: 15px; }
.original #read { font-size: 1.1em; line-height: 1.6em; padding:1em 0;}
#calligraphyArea { margin: 0 2% 2%;}
.calligraphy { width: 80%; max-width: 450px; margin: 0 auto 2%;}

	.commentArea  { padding:0; }
	.commentArea .commentBlock { padding:1em 0 2em;}
	.commentBlock h3 { font-size: 1.2em;}
	.commentArea .commentBlock .commentBox { padding: 20px 3% 3%;
	border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;}
	.commentArea .commentBlock .commentBox .inner {padding:45px 3% 25px;}
	.commentArea .commentBlock .commentBox .deco.clip { position: absolute; top:3px; left:50%; margin-left: -90px; width: 180px; }
	.commentBlock .comment {}
	.commentBlock .comment:not(:last-child) { margin-bottom: 2em;}		
	.commentArea .commentBlock h4 { font-size: 1.3em; padding: 0 0 0 30px;}
	.commentBlock h4:before {width: 25px;}

}
@media all and (max-width: 379px) {
	.original .contentsBlock h2 {font-size: 1.2em;}
}