.par,[class*=" par-"],[class^=par-] { position: relative; display: block; max-width:100%; }

/* ドロップキャップ */
.par-dc > *:first-child:first-letter,
.par-dc:first-letter {
	font-size: 400%;
	line-height: 60%;
	float: left;
	margin: 0 0.125em;
	padding: 0.25em 0;
}

/* 囲み枠 */
.par-rd-back, .par-wrap-back,
.par-rd, .par-wrap, .par-rd-b, .par-wrap-b {
  margin: 3em 0;
  padding: 1em;
  border-style : solid;
  border-width : 1px;
}
/* 囲み角丸枠 */
.par-rd-b, .par-wrap-b { border-width : 2px; }
.par-rd-back, .par-rd, .par-rd-b { border-radius: 8px; }

/* 次の矢印付き */
.par-next { margin: 3rem 0 6rem; }
.par-and-next { margin: 6rem 0 6rem; padding-top: 1rem; padding-bottom: 1rem; background-color: #ffffff;}

.par-and-next:before,
.par-next:before {
  position: absolute;
  content: '';
  display: inline-block;
  left: 50%;
  bottom: -5rem;
  transform: translateX(-50%);
  line-height: 1;
  width: 0.1em;
  height: 3.8rem;
}
.par-and-next:before {
  top: -5rem;
  height: calc(100% + 10rem);
}

.par-and-next:after,
.par-next:after {
  position: absolute;
  content: '';
  display: inline-block;
  left: 50%;
  bottom: -5rem;
  width: 0.8em;
  height: 0.8em;
  transform: rotate(-45deg);
  transform-origin: bottom left;
  box-sizing: border-box;
  border-style : solid;
  border-width : 0 0 0.1rem 0.1rem;
}

/* 縦の４点リーダー */
.par-more { margin: 3rem 0 8rem; }
.par-more:before, .par-more:after {
  position: absolute;
  display: inline-block;
  content: '';
  left: 50%;
  bottom: -4rem;
  width: 5px;
  height: 1.5rem;
  box-sizing: border-box;
  transform: translateX(-50%);
  opacity: 0.8;
  border-style : solid;
  border-width : 5px 0;
}
.par-more:after {  bottom: -6.6rem; opacity: 0.4; }

/* 影付きボックス紙っぽい */
.par-shade {
  padding: 3rem 2rem;
  margin: 3rem 1rem;
  border-style : solid;
  border-width : 0.3px;
  box-shadow: 0 2px 5px #ccc;
}

/* すりがらす */
.par-glass {
	display: flex;
  padding: 2rem 1rem;
  background-color: rgba(222, 222, 222, 0.7)!important; /* 背景色 */
  border: 1px solid rgba(255, 255, 255, 0.4); /* ボーダー */
  border-right-color: rgba(255, 255, 255, 0.2);
  border-bottom-color: rgba(255, 255, 255, 0.2);
  box-shadow: 0 5px 20px rgba(111, 111, 111, 0.3); /* 薄い影 */
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.4);
}
@supports (backdrop-filter: blur(10px)) {
 .par-glass {
   background-color: rgba(255, 255, 255, 0.2)!important; /* 背景色 */
   -webkit-backdrop-filter: blur(8px); /* ぼかしエフェクト数値が高いほどぼける */
   backdrop-filter: blur(8px);
  }
}
.par-glass:hover {
  cursor: move;
  box-shadow: 0 20px 50px rgba(111, 111, 111, 0.5)!important;
}

/* 見手書き風 */
.par-hand {
  padding: 1em;
  border-style : solid;
  border-width : 3.2px;
  border-radius: 6em .2em 1.2em .6em/.5em 2em 3em 9em;
}


/* ノートデザイン */
.par-sub-tape, .note, .par-note, .par-notepad {
  margin: 3rem 1rem;
  background-color: #fff; /* 背景色 */
  background-size: 100% 2.5em; /* 行の高さ */
  line-height: 2.5em; /* 文字の高さ */
  padding: 0 .5rem 1px; /* 最終行の下にも罫線を引く */
}

/* ノートデザイン点線 */
.par-note-dash, .dashed-note {
  margin: 3rem 1rem;
  background-color: #fff; /* 背景色 */
  background-size: 8px 100%, /* 点線1のサイズ */
                   100% 2.5em; /* 点線2のサイズ */
  line-height: 2.5em; /* 文字の高さ */
  padding: 0 .5rem 1px; /* 最終行の下にも罫線を引く */
}


/* メモ　クリップ　Ａ */
.par-clip-r, .par-clip-l {
 margin: 3em auto;
 padding: 35px 35px 15px 35px;
 background-color: #fff; /* ボックス背景色 */
 box-shadow: 1px 1px 1px #acacac; /* 影の色 */
 border: 1px solid #ccc; /* 枠線 */
}

.par-clip-r:before, .par-clip-l:before {
  position: absolute;
  content: '';
  top: -15px;
  height: 55px;
  width: 15px;
  border-radius: 12px;
  box-shadow: 1px 1px 2px #999;
  z-index: 1;
  border-style : solid;
  border-width : 3px;
}
.par-clip-r:after, .par-clip-l:after {
 position: absolute;
 content: '';
 top: 0px;
 width: 10px;
 z-index: 2;
 border-style : solid;
 border-width : 5px;
 border-color: #ffffff; /*背景色と同じ色にする*/
}

.par-clip-r:before { background: none; right: 10px;
 transform: rotate(10deg);
}
.par-clip-l:before { left: 10px;
 transform: rotate(-10deg);
}
.par-clip-r:after { right: 20px; }
.par-clip-l:after { left: 20px; }


/* 見出し付きデザイン */
/* 共通見出し部分 */
.par-sub-banner:after, .par-sub-buble:before, .par-sub-tape:before, .par-on-sub:before, .par-top-sub:before, .par-in-sub:before {
  position: absolute;	  display: inline-block;
  content: attr(data-en);
  top: 0; left: 0;
  padding: 3px 9px;
  line-height: 1;
  height: 1.6rem;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 80%;
  font-size: 0.9rem;
}

@media (min-width: 960px) {
  .par-sub-tape:before, .par-on-sub:before, .par-top-sub:before, .par-in-sub:before { font-size: 1rem; }
}

/*  見出し付き ボーダー上  */
.par-on-sub { margin: 3rem 1rem;  padding: 0.5em 1em;
  border-style : solid;
  border-width : 3px;
  border-radius : 6px;
}
.par-on-sub:before { top: -13px; left: 10px; padding: 0 9px; background-color: #ffffff;}

/*  見出し付き  枠の上 */
.par-top-sub {
  margin: 3rem 1rem;  padding: 0.5em 1em;
  padding: 0.5em 1em;
  border-style : solid;
  border-width : 3px;
}
.par-top-sub:before {
  top: -27px; left: -3px;
  padding: 0 9px;
  height: 25px;
  line-height: 25px;
  border-radius: 5px 5px 0 0;
}

/*  見出し付き  枠の下 */
.par-in-sub {
  margin: 3rem 1rem;
  padding: 25px 10px 7px;
  border-style : solid;
  border-width : 2px;
}
.par-in-sub:before {
    top: -2px; left: -2px;
    padding: 0 9px;  height: 25px;
    line-height: 25px;
}

/* テープ見出し　＋　ノート */
.par-sub-tape {
 padding: 0 1rem 1rem;
 margin: 5rem 2rem 4rem;
}
.par-sub-tape:before {
 top: -4rem; left: -1rem;
 padding: 8px 20px;
 height: auto;
 font-weight: bold;
 background-color: rgba(255,255,255,.4);
 border-left: 2px dotted rgba(0,0,0,.1);
 border-right: 2px dotted rgba(0,0,0,.1);
 box-shadow: 0 0 5px rgba(0,0,0,0.2);
 transform: rotate(-5deg);
 z-index: 2;
}
.par-sub-tape:after {
  position: absolute;
  top: -3rem; left: -2rem;
  content:"";
  display: block;
  width: calc(100% + 4rem); height: calc(100% + 6rem);
  border-style : solid;
  border-width : 0.3px;
  border-color: rgba(0,0,0,.3);
  box-shadow: 10px 10px 40px rgba(0,0,0,.15);
  background-color: #fff;
  z-index: -1;/*影を下の層に持っていく*/
}

/* 見出し吹き出し */
.par-sub-buble {
  position: relative;
  margin: 5rem 0;
  padding: 1rem;
  border-style : solid;
  border-width : 1px;
}
.par-sub-buble:before {
  display: block;
  padding: 1rem 20px;
  height: 3rem;
  top: -3rem; left:-1px;
  min-width: calc(100% + 2px)!important;
}

.par-sub-buble:after {
  position: absolute;
  content: '';
  height: 0;
  top: 0; left: 2rem;
  width: 0;
  border-style : solid;
  border-width : 15px;
  border-color : transparent;
}

.par-sub-banner {
	margin: 3rem 0;
  padding: 2rem;
  border-style : solid;
  border-width : 1px;
}
.par-sub-banner:after {
  top: -0.5rem; left: -0.98rem;
	width: auto; height: 2.2rem;
  padding: 0.7rem 1rem;
  font-size: 2rem 1rem;
  text-align: center;
	border-radius: 12px;
	transform: rotate(-10deg);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
	font-weight: 900;
  z-index: 2;
}

/*　左側の影 */
.par-paper::before {
    left: 5px;
    transform:rotate(-3deg);
}

/*　右側の影 */
.par-paper::after{
    right: 5px;
    transform:rotate(3deg);
}

.par-notepad {
  margin: 6rem 1rem 4rem;
  padding: 0 1rem  3rem;
  border-radius: 0 0 10px 10px;
}

.par-notepad:after {
  position: absolute;
  top: -4rem; left: -1rem;
  content:"";
  display: block;
  z-index: 2;/*影を下の層に持っていく*/
  width: calc(100% + 2rem);  height: 2rem;
  border-radius: 5px 5px 0 0;
}
.par-notepad:before {
  position: absolute;
  top: -4rem; left: -1rem;
  content:"";
  display: block;
  width: calc(100% + 2rem); height: calc(100% + 6rem);
  box-shadow: 10px 10px 40px rgba(0,0,0,.15);
  background-color: #fff;
  z-index: -1;/*影を下の層に持っていく*/
}


/* 背景等カラー設定  */
.par-dc,.pa-subr-tape:before, .par-on-sub:before { color: #000000; }

.par-notepad:after, .par-sub-banner:after, .par-sub-buble:before, .par-and-next:before, .par-next:before, .par-rd-back, .par-wrap-back, .par-in-sub:before, .par-top-sub:before { background-color: #000000; }

.par-sub-banner, .par-hand, .par-more:before, .par-more:after, .par-next:after, .par-and-next:after, .par-shade, .par-rd, .par-wrap, .par-rd-b, .par-wrap-b, .par-clip-r:before, .par-clip-l:before, .par-in-sub, .par-top-sub,.par-on-sub { border-color: #000000; }

.par-sub-buble:after { border-top-color: #000000; }

.par-sub-tape, .par-notepad, .note, .par-note {
  background-image: linear-gradient(180deg, #000000 1px, transparent 1px); /* 罫線の色と太さ  */
}
.par-note-dash, .dashed-note {
  background-image: linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%), /* 点線1の色 */
                    linear-gradient(180deg, #000000 1px, transparent 1px); /* 点線2の色と太さ */
}


/* 文字カラー設定  */
.par-sub-banner:after, .par-sub-buble:before, .par-rd-back, .par-wrap-back, .par-in-sub:before, .par-top-sub:before { color: #ffffff; }


.blk-b .over-b-box, .over-b-box { border-top: solid 2px #000000; border-bottom: solid 2px #000000; }
.blk-b .over-b-box:before, .blk-b .over-b-box:after,
.over-b-box:before, .over-b-box:after { background-color: #000000; }
.blk-b .brackets-box:before,.brackets-box:before { border-left: solid 1px #000000; border-top: solid 1px #000000; }
.blk-b .brackets-box:after,.brackets-box:after { border-right: solid 1px #000000; border-bottom: solid 1px #000000; }


.blk-b.par-dc>*:first-child:first-letter,.blk-b.par-dc:first-letter,.blk-b.pa-subr-tape:before,.blk-b.par-on-sub:before{color:#000}.blk-b.par-notepad:after,.blk-b.par-sub-banner:after,.blk-b.par-sub-buble:before,.blk-b.par-and-next:before,.blk-b.par-next:before,.blk-b.par-rd-back,.blk-b.par-wrap-back,.blk-b.par-in-sub:before,.blk-b.par-top-sub:before{background-color:#000}.blk-b.par-sub-banner,.blk-b.par-hand,.blk-b.par-more:before,.blk-b.par-more:after,.blk-b.par-next:after,.blk-b.par-and-next:after,.blk-b.par-shade,.blk-b.par-rd,.blk-b.par-wrap,.blk-b.par-rd-b,.blk-b.par-wrap-b,.blk-b.par-clip-r:before,.blk-b.par-clip-l:before,.blk-b.par-in-sub,.blk-b.par-top-sub,.par-on-sub{border-color:#000}.blk-b.par-sub-buble:after{border-top-color:#000}.blk-b.par-sub-tape,.blk-b.par-notepad,.blk-b.note,.blk-b.par-note{background-image:linear-gradient(180deg, #000 1px, transparent 1px)}.blk-b.par-note-dash,.blk-b.dashed-note{background-image:linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),linear-gradient(180deg, #000 1px, transparent 1px)}.blk-l.par-dc>*:first-child:first-letter,.blk-l.par-dc:first-letter,.blk-l.pa-subr-tape:before,.blk-l.par-on-sub:before{color:#e0e0e0}.blk-l.par-notepad:after,.blk-l.par-sub-banner:after,.blk-l.par-sub-buble:before,.blk-l.par-and-next:before,.blk-l.par-next:before,.blk-l.par-rd-back,.blk-l.par-wrap-back,.blk-l.par-in-sub:before,.blk-l.par-top-sub:before{background-color:#e0e0e0}.blk-l.par-sub-banner,.blk-l.par-hand,.blk-l.par-more:before,.blk-l.par-more:after,.blk-l.par-next:after,.blk-l.par-and-next:after,.blk-l.par-shade,.blk-l.par-rd,.blk-l.par-wrap,.blk-l.par-rd-b,.blk-l.par-wrap-b,.blk-l.par-clip-r:before,.blk-l.par-clip-l:before,.blk-l.par-in-sub,.blk-l.par-top-sub,.par-on-sub{border-color:#e0e0e0}.blk-l.par-sub-buble:after{border-top-color:#e0e0e0}.blk-l.par-sub-tape,.blk-l.par-notepad,.blk-l.note,.blk-l.par-note{background-image:linear-gradient(180deg, #e0e0e0 1px, transparent 1px)}.blk-l.par-note-dash,.blk-l.dashed-note{background-image:linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),linear-gradient(180deg, #e0e0e0 1px, transparent 1px)}.blu-b.par-dc>*:first-child:first-letter,.blu-b.par-dc:first-letter,.blu-b.pa-subr-tape:before,.blu-b.par-on-sub:before{color:#0d47a1}.blu-b.par-notepad:after,.blu-b.par-sub-banner:after,.blu-b.par-sub-buble:before,.blu-b.par-and-next:before,.blu-b.par-next:before,.blu-b.par-rd-back,.blu-b.par-wrap-back,.blu-b.par-in-sub:before,.blu-b.par-top-sub:before{background-color:#0d47a1}.blu-b.par-sub-banner,.blu-b.par-hand,.blu-b.par-more:before,.blu-b.par-more:after,.blu-b.par-next:after,.blu-b.par-and-next:after,.blu-b.par-shade,.blu-b.par-rd,.blu-b.par-wrap,.blu-b.par-rd-b,.blu-b.par-wrap-b,.blu-b.par-clip-r:before,.blu-b.par-clip-l:before,.blu-b.par-in-sub,.blu-b.par-top-sub,.par-on-sub{border-color:#0d47a1}.blu-b.par-sub-buble:after{border-top-color:#0d47a1}.blu-b.par-sub-tape,.blu-b.par-notepad,.blu-b.note,.blu-b.par-note{background-image:linear-gradient(180deg, #0d47a1 1px, transparent 1px)}.blu-b.par-note-dash,.blu-b.dashed-note{background-image:linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),linear-gradient(180deg, #0d47a1 1px, transparent 1px)}.blu-l.par-dc>*:first-child:first-letter,.blu-l.par-dc:first-letter,.blu-l.pa-subr-tape:before,.blu-l.par-on-sub:before{color:#bbdefb}.blu-l.par-notepad:after,.blu-l.par-sub-banner:after,.blu-l.par-sub-buble:before,.blu-l.par-and-next:before,.blu-l.par-next:before,.blu-l.par-rd-back,.blu-l.par-wrap-back,.blu-l.par-in-sub:before,.blu-l.par-top-sub:before{background-color:#bbdefb}.blu-l.par-sub-banner,.blu-l.par-hand,.blu-l.par-more:before,.blu-l.par-more:after,.blu-l.par-next:after,.blu-l.par-and-next:after,.blu-l.par-shade,.blu-l.par-rd,.blu-l.par-wrap,.blu-l.par-rd-b,.blu-l.par-wrap-b,.blu-l.par-clip-r:before,.blu-l.par-clip-l:before,.blu-l.par-in-sub,.blu-l.par-top-sub,.par-on-sub{border-color:#bbdefb}.blu-l.par-sub-buble:after{border-top-color:#bbdefb}.blu-l.par-sub-tape,.blu-l.par-notepad,.blu-l.note,.blu-l.par-note{background-image:linear-gradient(180deg, #bbdefb 1px, transparent 1px)}.blu-l.par-note-dash,.blu-l.dashed-note{background-image:linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),linear-gradient(180deg, #bbdefb 1px, transparent 1px)}.red-b.par-dc>*:first-child:first-letter,.red-b.par-dc:first-letter,.red-b.pa-subr-tape:before,.red-b.par-on-sub:before{color:#c00}.red-b.par-notepad:after,.red-b.par-sub-banner:after,.red-b.par-sub-buble:before,.red-b.par-and-next:before,.red-b.par-next:before,.red-b.par-rd-back,.red-b.par-wrap-back,.red-b.par-in-sub:before,.red-b.par-top-sub:before{background-color:#c00}.red-b.par-sub-banner,.red-b.par-hand,.red-b.par-more:before,.red-b.par-more:after,.red-b.par-next:after,.red-b.par-and-next:after,.red-b.par-shade,.red-b.par-rd,.red-b.par-wrap,.red-b.par-rd-b,.red-b.par-wrap-b,.red-b.par-clip-r:before,.red-b.par-clip-l:before,.red-b.par-in-sub,.red-b.par-top-sub,.par-on-sub{border-color:#c00}.red-b.par-sub-buble:after{border-top-color:#c00}.red-b.par-sub-tape,.red-b.par-notepad,.red-b.note,.red-b.par-note{background-image:linear-gradient(180deg, #c00 1px, transparent 1px)}.red-b.par-note-dash,.red-b.dashed-note{background-image:linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),linear-gradient(180deg, #c00 1px, transparent 1px)}.red-l.par-dc>*:first-child:first-letter,.red-l.par-dc:first-letter,.red-l.pa-subr-tape:before,.red-l.par-on-sub:before{color:#f8bbd0}.red-l.par-notepad:after,.red-l.par-sub-banner:after,.red-l.par-sub-buble:before,.red-l.par-and-next:before,.red-l.par-next:before,.red-l.par-rd-back,.red-l.par-wrap-back,.red-l.par-in-sub:before,.red-l.par-top-sub:before{background-color:#f8bbd0}.red-l.par-sub-banner,.red-l.par-hand,.red-l.par-more:before,.red-l.par-more:after,.red-l.par-next:after,.red-l.par-and-next:after,.red-l.par-shade,.red-l.par-rd,.red-l.par-wrap,.red-l.par-rd-b,.red-l.par-wrap-b,.red-l.par-clip-r:before,.red-l.par-clip-l:before,.red-l.par-in-sub,.red-l.par-top-sub,.par-on-sub{border-color:#f8bbd0}.red-l.par-sub-buble:after{border-top-color:#f8bbd0}.red-l.par-sub-tape,.red-l.par-notepad,.red-l.note,.red-l.par-note{background-image:linear-gradient(180deg, #f8bbd0 1px, transparent 1px)}.red-l.par-note-dash,.red-l.dashed-note{background-image:linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),linear-gradient(180deg, #f8bbd0 1px, transparent 1px)}.grn-b.par-dc>*:first-child:first-letter,.grn-b.par-dc:first-letter,.grn-b.pa-subr-tape:before,.grn-b.par-on-sub:before{color:#00B900}.grn-b.par-notepad:after,.grn-b.par-sub-banner:after,.grn-b.par-sub-buble:before,.grn-b.par-and-next:before,.grn-b.par-next:before,.grn-b.par-rd-back,.grn-b.par-wrap-back,.grn-b.par-in-sub:before,.grn-b.par-top-sub:before{background-color:#00B900}.grn-b.par-sub-banner,.grn-b.par-hand,.grn-b.par-more:before,.grn-b.par-more:after,.grn-b.par-next:after,.grn-b.par-and-next:after,.grn-b.par-shade,.grn-b.par-rd,.grn-b.par-wrap,.grn-b.par-rd-b,.grn-b.par-wrap-b,.grn-b.par-clip-r:before,.grn-b.par-clip-l:before,.grn-b.par-in-sub,.grn-b.par-top-sub,.par-on-sub{border-color:#00B900}.grn-b.par-sub-buble:after{border-top-color:#00B900}.grn-b.par-sub-tape,.grn-b.par-notepad,.grn-b.note,.grn-b.par-note{background-image:linear-gradient(180deg, #00B900 1px, transparent 1px)}.grn-b.par-note-dash,.grn-b.dashed-note{background-image:linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),linear-gradient(180deg, #00B900 1px, transparent 1px)}.grn-l.par-dc>*:first-child:first-letter,.grn-l.par-dc:first-letter,.grn-l.pa-subr-tape:before,.grn-l.par-on-sub:before{color:#b9f6ca}.grn-l.par-notepad:after,.grn-l.par-sub-banner:after,.grn-l.par-sub-buble:before,.grn-l.par-and-next:before,.grn-l.par-next:before,.grn-l.par-rd-back,.grn-l.par-wrap-back,.grn-l.par-in-sub:before,.grn-l.par-top-sub:before{background-color:#b9f6ca}.grn-l.par-sub-banner,.grn-l.par-hand,.grn-l.par-more:before,.grn-l.par-more:after,.grn-l.par-next:after,.grn-l.par-and-next:after,.grn-l.par-shade,.grn-l.par-rd,.grn-l.par-wrap,.grn-l.par-rd-b,.grn-l.par-wrap-b,.grn-l.par-clip-r:before,.grn-l.par-clip-l:before,.grn-l.par-in-sub,.grn-l.par-top-sub,.par-on-sub{border-color:#b9f6ca}.grn-l.par-sub-buble:after{border-top-color:#b9f6ca}.grn-l.par-sub-tape,.grn-l.par-notepad,.grn-l.note,.grn-l.par-note{background-image:linear-gradient(180deg, #b9f6ca 1px, transparent 1px)}.grn-l.par-note-dash,.grn-l.dashed-note{background-image:linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),linear-gradient(180deg, #b9f6ca 1px, transparent 1px)}.yll-b.par-dc>*:first-child:first-letter,.yll-b.par-dc:first-letter,.yll-b.pa-subr-tape:before,.yll-b.par-on-sub:before{color:#ff6d00}.yll-b.par-notepad:after,.yll-b.par-sub-banner:after,.yll-b.par-sub-buble:before,.yll-b.par-and-next:before,.yll-b.par-next:before,.yll-b.par-rd-back,.yll-b.par-wrap-back,.yll-b.par-in-sub:before,.yll-b.par-top-sub:before{background-color:#ff6d00}.yll-b.par-sub-banner,.yll-b.par-hand,.yll-b.par-more:before,.yll-b.par-more:after,.yll-b.par-next:after,.yll-b.par-and-next:after,.yll-b.par-shade,.yll-b.par-rd,.yll-b.par-wrap,.yll-b.par-rd-b,.yll-b.par-wrap-b,.yll-b.par-clip-r:before,.yll-b.par-clip-l:before,.yll-b.par-in-sub,.yll-b.par-top-sub,.par-on-sub{border-color:#ff6d00}.yll-b.par-sub-buble:after{border-top-color:#ff6d00}.yll-b.par-sub-tape,.yll-b.par-notepad,.yll-b.note,.yll-b.par-note{background-image:linear-gradient(180deg, #ff6d00 1px, transparent 1px)}.yll-b.par-note-dash,.yll-b.dashed-note{background-image:linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),linear-gradient(180deg, #ff6d00 1px, transparent 1px)}.yll-l.par-dc>*:first-child:first-letter,.yll-l.par-dc:first-letter,.yll-l.pa-subr-tape:before,.yll-l.par-on-sub:before{color:#ffd600}.yll-l.par-notepad:after,.yll-l.par-sub-banner:after,.yll-l.par-sub-buble:before,.yll-l.par-and-next:before,.yll-l.par-next:before,.yll-l.par-rd-back,.yll-l.par-wrap-back,.yll-l.par-in-sub:before,.yll-l.par-top-sub:before{background-color:#ffd600}.yll-l.par-sub-banner,.yll-l.par-hand,.yll-l.par-more:before,.yll-l.par-more:after,.yll-l.par-next:after,.yll-l.par-and-next:after,.yll-l.par-shade,.yll-l.par-rd,.yll-l.par-wrap,.yll-l.par-rd-b,.yll-l.par-wrap-b,.yll-l.par-clip-r:before,.yll-l.par-clip-l:before,.yll-l.par-in-sub,.yll-l.par-top-sub,.par-on-sub{border-color:#ffd600}.yll-l.par-sub-buble:after{border-top-color:#ffd600}.yll-l.par-sub-tape,.yll-l.par-notepad,.yll-l.note,.yll-l.par-note{background-image:linear-gradient(180deg, #ffd600 1px, transparent 1px)}.yll-l.par-note-dash,.yll-l.dashed-note{background-image:linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),linear-gradient(180deg, #ffd600 1px, transparent 1px)}.blw-b.par-dc>*:first-child:first-letter,.blw-b.par-dc:first-letter,.blw-b.pa-subr-tape:before,.blw-b.par-on-sub:before{color:#5d4037}.blw-b.par-notepad:after,.blw-b.par-sub-banner:after,.blw-b.par-sub-buble:before,.blw-b.par-and-next:before,.blw-b.par-next:before,.blw-b.par-rd-back,.blw-b.par-wrap-back,.blw-b.par-in-sub:before,.blw-b.par-top-sub:before{background-color:#5d4037}.blw-b.par-sub-banner,.blw-b.par-hand,.blw-b.par-more:before,.blw-b.par-more:after,.blw-b.par-next:after,.blw-b.par-and-next:after,.blw-b.par-shade,.blw-b.par-rd,.blw-b.par-wrap,.blw-b.par-rd-b,.blw-b.par-wrap-b,.blw-b.par-clip-r:before,.blw-b.par-clip-l:before,.blw-b.par-in-sub,.blw-b.par-top-sub,.par-on-sub{border-color:#5d4037}.blw-b.par-sub-buble:after{border-top-color:#5d4037}.blw-b.par-sub-tape,.blw-b.par-notepad,.blw-b.note,.blw-b.par-note{background-image:linear-gradient(180deg, #5d4037 1px, transparent 1px)}.blw-b.par-note-dash,.blw-b.dashed-note{background-image:linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),linear-gradient(180deg, #5d4037 1px, transparent 1px)}.blw-l.par-dc>*:first-child:first-letter,.blw-l.par-dc:first-letter,.blw-l.pa-subr-tape:before,.blw-l.par-on-sub:before{color:#bcaaa4}.blw-l.par-notepad:after,.blw-l.par-sub-banner:after,.blw-l.par-sub-buble:before,.blw-l.par-and-next:before,.blw-l.par-next:before,.blw-l.par-rd-back,.blw-l.par-wrap-back,.blw-l.par-in-sub:before,.blw-l.par-top-sub:before{background-color:#bcaaa4}.blw-l.par-sub-banner,.blw-l.par-hand,.blw-l.par-more:before,.blw-l.par-more:after,.blw-l.par-next:after,.blw-l.par-and-next:after,.blw-l.par-shade,.blw-l.par-rd,.blw-l.par-wrap,.blw-l.par-rd-b,.blw-l.par-wrap-b,.blw-l.par-clip-r:before,.blw-l.par-clip-l:before,.blw-l.par-in-sub,.blw-l.par-top-sub,.par-on-sub{border-color:#bcaaa4}.blw-l.par-sub-buble:after{border-top-color:#bcaaa4}.blw-l.par-sub-tape,.blw-l.par-notepad,.blw-l.note,.blw-l.par-note{background-image:linear-gradient(180deg, #bcaaa4 1px, transparent 1px)}.blw-l.par-note-dash,.blw-l.dashed-note{background-image:linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),linear-gradient(180deg, #bcaaa4 1px, transparent 1px)}.blk-b.par-sub-banner:after,.blk-b.par-sub-buble:before,.blk-b.par-rd-back,.blk-b.par-wrap-back,.blk-b.par-in-sub:before,.blk-b.par-top-sub:before{color:#fff}.blk-l.par-sub-banner:after,.blk-l.par-sub-buble:before,.blk-l.par-rd-back,.blk-l.par-wrap-back,.blk-l.par-in-sub:before,.blk-l.par-top-sub:before{color:#000}.blu-b.par-sub-banner:after,.blu-b.par-sub-buble:before,.blu-b.par-rd-back,.blu-b.par-wrap-back,.blu-b.par-in-sub:before,.blu-b.par-top-sub:before{color:#fff}.blu-l.par-sub-banner:after,.blu-l.par-sub-buble:before,.blu-l.par-rd-back,.blu-l.par-wrap-back,.blu-l.par-in-sub:before,.blu-l.par-top-sub:before{color:#000}.red-b.par-sub-banner:after,.red-b.par-sub-buble:before,.red-b.par-rd-back,.red-b.par-wrap-back,.red-b.par-in-sub:before,.red-b.par-top-sub:before{color:#fff}.red-l.par-sub-banner:after,.red-l.par-sub-buble:before,.red-l.par-rd-back,.red-l.par-wrap-back,.red-l.par-in-sub:before,.red-l.par-top-sub:before{color:#000}.grn-b.par-sub-banner:after,.grn-b.par-sub-buble:before,.grn-b.par-rd-back,.grn-b.par-wrap-back,.grn-b.par-in-sub:before,.grn-b.par-top-sub:before{color:#fff}.grn-l.par-sub-banner:after,.grn-l.par-sub-buble:before,.grn-l.par-rd-back,.grn-l.par-wrap-back,.grn-l.par-in-sub:before,.grn-l.par-top-sub:before{color:#000}.yll-b.par-sub-banner:after,.yll-b.par-sub-buble:before,.yll-b.par-rd-back,.yll-b.par-wrap-back,.yll-b.par-in-sub:before,.yll-b.par-top-sub:before{color:#fff}.yll-l.par-sub-banner:after,.yll-l.par-sub-buble:before,.yll-l.par-rd-back,.yll-l.par-wrap-back,.yll-l.par-in-sub:before,.yll-l.par-top-sub:before{color:#000}.blw-b.par-sub-banner:after,.blw-b.par-sub-buble:before,.blw-b.par-rd-back,.blw-b.par-wrap-back,.blw-b.par-in-sub:before,.blw-b.par-top-sub:before{color:#fff}.blw-l.par-sub-banner:after,.blw-l.par-sub-buble:before,.blw-l.par-rd-back,.blw-l.par-wrap-back,.blw-l.par-in-sub:before,.blw-l.par-top-sub:before{color:#000}



.par-letter {
  background: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.3);
  margin: 26px auto 0;
  max-width: 90%;
  min-height: 300px;
  padding: 3rem 2rem 5rem;
  position: relative;
  width: 80%;
}
.par-letter:before, .par-letter:after {
  content: "";
  height: 98%;
  position: absolute;
  width: 100%;
  z-index: -1;
}
.par-letter:before {
  background: #fafafa;
  box-shadow: 0 0 8px rgba(0,0,0,0.2);
  left: -5px;
  top: 4px;
  transform: rotate(-2.5deg);
}
.par-letter:after {
  background: #f6f6f6;
  box-shadow: 0 0 3px rgba(0,0,0,0.2);
  right: -3px;
  top: 1px;
  transform: rotate(1.4deg);
}

.par-paper {
  margin: 3rem 0 2rem; background-color: #fefefe; padding: 3rem 2rem;
  border-style : solid;
  border-width : .3px;
  border-color : #ddd;
  box-shadow: 0 1px 1px #ddd;
}
/* 左右の影 */
.par-paper::before, .par-paper::after {
    content:"";
    position: absolute;
    z-index: -1;/*影を下の層に持っていく*/
    bottom: 10px;
    display: block;
    width: 50%;
    height: 50%;
    box-shadow: 0 10px 5px #999;
}