/* Decoration styles for blog article bodies. Shared by the public article
   page, the publish preview and the editor, so what is written looks the
   same as what is published. */
.body-text h2, .rte-body h2 { font-family: "Hiragino Maru Gothic ProN", "Yuji Syuku", "M PLUS Rounded 1c", sans-serif; font-size: 21px; line-height: 1.5; color: #006e35; font-weight: 700; margin: 38px 0 16px; padding-bottom: 8px; border-bottom: 3px solid #83d1a2; }
.body-text h3, .rte-body h3 { font-size: 17px; line-height: 1.5; color: #4a4a4a; font-weight: 700; margin: 30px 0 12px; padding-left: 12px; border-left: 5px solid #83d1a2; }
.body-text h2:first-child, .rte-body h2:first-child, .body-text h3:first-child, .rte-body h3:first-child { margin-top: 0; }

.body-text .bx, .rte-body .bx { border-radius: 12px; padding: 18px 22px; margin: 22px 0; }
.body-text .bx > :first-child, .rte-body .bx > :first-child { margin-top: 0; }
.body-text .bx > :last-child, .rte-body .bx > :last-child { margin-bottom: 0; }
.body-text .bx-green, .rte-body .bx-green { background: #eaf7e2; }
.body-text .bx-yellow, .rte-body .bx-yellow { background: #fff6d6; }
.body-text .bx-pink, .rte-body .bx-pink { background: #fdeaf2; }
.body-text .bx-blue, .rte-body .bx-blue { background: #e6f1fb; }

.body-text hr, .rte-body hr { border: none; margin: 30px 0; }
.body-text hr.hr-solid, .rte-body hr.hr-solid { border-top: 1px solid #cfc9b3; }
.body-text hr.hr-dotted, .rte-body hr.hr-dotted { border-top: 3px dotted #83d1a2; }
.body-text hr.hr-thick, .rte-body hr.hr-thick { border-top: 4px solid #83d1a2; border-radius: 2px; }

@media (max-width: 600px) {
  .body-text h2, .rte-body h2 { font-size: 18px; }
  .body-text h3, .rte-body h3 { font-size: 16px; }
  .body-text .bx, .rte-body .bx { padding: 14px 16px; }
}