記事の表示のされ方をチェックする為の記事

body {
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  @media (max-width: 768px) {
    padding-bottom: 62px;
  }
}

ul {
  list-style: none;
}

a {
  color: var(--accent);
  text-decoration: none;
}

button:focus {
  outline: none;
}

.light {
  --accent: #52de97;
  --bg: #fff;
  --bg-panel: rgb(248, 249, 249);
  --bw: #000;
  --wb: #fff;
  --hover: #fff;
  --hover-shadow: rgba(0,0,0,.15);
  --txt: rgba(0,0,0,0.87);
  --subTxt: rgba(0,0,0,0.54);
  --btn-txt: #fff;
  --btn-bg: #2c3948;
  --hr: #f3f3f3;
}

.dark {
  --accent: #52de97;
  --bg: #202b38;
  --bg-panel: #2c3948;
  --bw: #fff;
  --wb: #000;
  --hover: #000;
  --hover-shadow: rgba(0,0,0,.5);
  --txt: rgba(255,255,255,1);
  --subTxt: rgba(255,255,255,.7);
  --btn-txt: #333333;
  --btn-bg: #fff;
  --hr: #8899a6;
}

body.transition,
body.transition *,
body.transition *:before,
body.transition *:after {
  transition: all 750ms !important;
  transition-delay: 0 !important;
}

.dark img {
  opacity: .75!important;
  transition: opacity .5s ease-in-out;
}

main {
  background: var(--bg);
}