:root {
  font-family:Pretendard, system-ui, sans-serif;
  color:#222;
  font-size:14px;
  --primary:#fb3958;
  --primary-bg:rgba(251, 57, 88, .02);
}

.markdown {
  width:768px;
  max-width:100%;
  margin:auto;
  line-height:1.6;
  font-size:16px;
  letter-spacing:-0.01em;
  word-wrap:break-all;
  color:#333;
}

.markdown hr {
  margin:2em 0;
  border-top:1px solid rgba(0, 0, 0, .1)
}

.markdown a {
  color:var(--primary)
}

.markdown a:hover {
  text-decoration:underline;
}


.markdown h1,
.markdown h2,
.markdown h3,
.markdown h4 {
  font-size:2em;
  font-weight:bold;
  margin-top:2.4em;
  margin-bottom:.6em;
}

.markdown h2 {
  font-size:1.4em;
}

.markdown h3 {
  font-size:1.2em;
}

.markdown h4 {
  font-size:1em;
}

.markdown p {
  margin:1.4em 0;
}

.markdown ul,
.markdown ol {
  list-style:disc;
  padding:0 1.6em;
  margin:1em 0;
}

.markdown ol {
  list-style:number;
}

.markdown li {
  margin:0.2em 0;
}

.markdown pre {
  background:#f9f9f9;
  margin:1em 0;
  padding:1em;
  border-radius:.6em;
  white-space:pre-wrap;
  font-family:monospace;
  font-size:0.9em;
  text-align:left;
}

.markdown code {
  background:#f6f8fa;
  padding:2px .4em;
  border-radius:.4em;
  font-family:monospace;
  font-size:0.9em;
}

.markdown pre code {
  background:none;
  padding:0;
}

.markdown .attr-value,
.markdown .string,
.markdown .string-property {
  color:var(--primary)
}

.markdown .comment {
  color:#999;
}

.markdown blockquote {
  background:var(--primary-bg);
  margin:1.4em 0;
  padding:1.4em;
  border-left:4px solid var(--primary)
}

.markdown blockquote > :first-child {
  margin-top:0;
}

.markdown blockquote > :last-child {
  margin-bottom:0;
}

.markdown strong {
  font-weight:bold;
}

@media (max-width:768px) {
  .markdown {
    font-size:14px;
  }
}
