/*原作*/
.original .contentsBlock #titleArea {font-weight: 500; text-align:center; border-bottom:solid 1px #000; background-color: #FFFBE3;}
.original .contentsBlock h2 {font-weight: 800;}
.original #read { position: relative; font-weight: 500; text-align:center;}

.calligraphy { position: relative;}
.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; z-index: 10;
}
.calligraphy span img {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
.calligraphy { position: relative;}
#calligraphyArea p {text-align: center; font-size:0.8em; }

.commentArea {width: 100%; position: relative;}
.commentArea {width: 100%; position: relative;}
.commentBlock h3 {font-weight: 700; color:#08914B; background-color: rgba(255,255,255,0.5); border-top:solid 1px #000; border-bottom:solid 1px #000; text-align: center;}
.commentArea .commentBlock h3 .small { font-size: 0.8em;}
.commentBox .phArea .ph_cut { position: relative;}
.commentBlock .ph_cut span {padding-top: -webkit-calc(300 / 300 * 100%); padding-top: calc(300 / 300 * 100%); z-index: 10;}

@media all and (min-width: 768px) {
	.originalBlock { padding: 0;}
	.original .contentsBlock #titleArea { border-top-left-radius: 40px; border-top-right-radius: 40px; padding:25px 0; margin-bottom:60px;}
	
	.original .contentsBlock h2 {font-size: 1.8em; line-height: 1.4em; padding-bottom: 15px; }
	.publisher { font-size: 1.2em;}
	.original #read { font-size: 1.2em; line-height: 1.8em; padding: 20px 0;}
	#calligraphyArea { width: 880px; margin:0 auto 10px; }
	#calligraphyArea p { padding-top: 20px;}
	.calligraphy {width: 450px; margin: 0 auto;}
	.calligraphy::after, .commentArea .commentBlock .commentBox .ph_cut::after {
    content: '';
    display: block;
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(0deg, #f9d4aa, #ee9f9e);
    filter: blur(0px);
    transform: translateY(15px) translateX(15px) scale(1.00);
    mix-blend-mode: multiply;
    opacity: 1;
}
	.originalBlock .txtArea .txt {width: 880px; margin: 0 auto;}
	
	.commentArea  { padding: 0px 0 0px; }
	.commentArea .commentBlock {padding: 0 0 45px;}
	.commentArea .commentBlock h3 {font-size: 1.3em; line-height:1.4em; padding:8px; margin-bottom:1em; }
	.content { padding-top: 60px;}
	.commentArea .commentBlock .commentBox {
		width: 880px; margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	}
	.commentArea .commentBlock .commentBox .ph_cut { width: 300px; height: 300px; margin-right: 40px;}
	.commentArea .commentBlock .txtArea {}
	.commentArea .commentBlock .txtArea p.txt {width: 540px;}
}

@media all and (max-width: 767px) {
.originalBlock { padding:0;}
	.original .contentsBlock #titleArea {border-top-left-radius: 30px; border-top-right-radius: 30px; padding:15px 5px;}
.original .contentsBlock h2 {font-size: 1.3em; line-height: 1.4em; padding-bottom: 10px; }
.original #read { font-size: 1.0em; line-height: 1.6em; padding:1em 0;}
#calligraphyArea { width: 70%; max-width: 450px;margin:1em auto 0;}
	#calligraphyArea p { padding-top: 15px;}
.calligraphy { width: 100%;}
	.calligraphy::after, .commentArea .commentBlock .commentBox .ph_cut::after {
    content: '';
    display: block;
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(0deg, #f9d4aa, #ee9f9e);
    filter: blur(0px);
    transform: translateY(10px) translateX(10px) scale(1.00);
    mix-blend-mode: multiply;
    opacity: 1;
}
	
	.originalBlock .txtArea .txt {padding: 0 1em 1em;}

	.commentArea  { padding:0; }
	.commentArea .commentBlock { padding:1em 0;}
	.content {padding-top: 2em;}
	.commentArea .commentBlock .comment:not(:last-child) { margin-bottom: 1.5em;}
	.commentArea .commentBlock h3 {font-size: 1.2em; line-height:1.4em; padding:5px; margin-bottom:1em; }
	.commentBox .phArea { width: 80%; max-width: 450px; margin:1em auto 2em;}
	.commentArea .commentBlock .txtArea .txt {padding: 0 1em 1em;}
	.commentArea .commentBlock .txtArea p.txt:not(:last-child) { padding: 0 0 1.5em;}

}
