@charset "Shift_JIS";
/* 有料記事　共通 */
.paid-back { font-size: 0.75rem; margin-bottom: 30px; }



/* ---------------------------------------------------------------------------------------------------------------------- */
.article { font-family: var(--text-SanSerif); text-align: justify; text-justify: distribute-all-lines;
    border: 1px solid #000000; padding: 10px; margin: 10px; }
.article h2 { font-family: var(--text-Serif); border: 1px solid #000000; padding: 5px; margin: 10px 0px 50px; }
.article h3 { font-family: var(--text-Serif); font-size: 1.25rem; border-bottom: 1px solid #000000; }
.article h4 { font-family: var(--text-Serif); font-size: 1rem; margin-top: 10px; }
.article h4:first-letter { color: var(--main-purple); font-size: 1.25rem; }
.article a { color: var(--main-purple); }
.article p { line-height: 180%; text-indent: 0em; }
.article p a { line-height: 1; }
.article img { padding: 5px; }
.article img:hover { opacity: 1; }
.article .outline { border: 1px solid #000000; margin: 50px 100px; }
.article .outline h3 { padding: 3px 5px; }
.article .outline ul { list-style: none; padding: 0px; margin: 10px; }
.article .outline ul ul { margin: 10px 1em; }
.article .outline li a { display: block; border: 1px solid #000000; padding: 5px; margin: 10px 0px; }
.article .outline li a:hover { border-color: var(--main-purple); }


.article .codoc-entry .codoc-btn { color: var(--main-pink) !important; background-color: #ffffff; border: solid 1px var(--main-pink); }
.article .codoc-entry .codoc-btn:hover { color: var(--main-purple) !important; background-color: var(--main-purple-pale) !important; border: solid 1px var(--main-purple); }
.article .codoc-entry img { box-sizing: border-box; }
.article .codoc-buy-price { color: var(--main-purple); }
.article .codoc-subscription-price { color: var(--main-purple); }
.article .codoc-entry-body-after { margin-top: 50px; }
.article .codoc-support { background-color: #ffffff; border: solid 1px #000000; }
.article .codoc-support-title { color: #000000 !important; font-weight: normal !important; }
.article .codoc-subscription-articlelist a { color: var(--main-purple); padding: 3px 3px 3px 16px; }
.article .codoc-subscription-articlelist a:before { margin: 3px; }
.article .codoc-subscription-articlelist a:hover { color: var(--main-purple); }
.article .codoc-like-btn:hover { background-color: transparent; }


/* ---------------------------------------------------------------------------------------------------- */
/* スマホ対応用 */
@media (max-width: 480px) {
    .article .outline { margin: 50px 10px; }
}
/* ---------------------------------------------------------------------------------------------------- */