body {
  background-color: white;
  color: black;
  padding: 20 5% 20 5%;
}
a:link {
  color: blue;
}
a:visited {
  color: #800080;
}
p {
  margin-top: 0.1em;
  margin-bottom: 0.1em;
  text-indent: 1em;
  line-height: 160%;
}
h1.maintitle {
  /* フォント */
  font-family:
    "Meiryo",
    "MS PGothic",
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    "Yu Gothic",
    "Yu Gothic UI",
    sans-serif;
  font-weight: 1200;              /* ぶっといゴシック体 */
  font-size: 2.5rem;             /* お好みで調整 */
  color: #0000cc;                /* 文字色青 */
  background: none;              /* 背景色なし */
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
  margin: 0.5em 0;
  letter-spacing: 0.05em;
}

h1:not(.maintitle) {
  color: white;
  font-size: large;
  background: #666666;
  padding-top: 2px;
  border-top: #cccccc 2px solid;
  border-bottom: #333333 2px solid;
  padding-bottom: 2px;
  padding-left: 1em;
  border-left: #cccccc 2px solid;
  border-right: #333333 2px solid;
  padding-right: 2px;
}
h2 {
  color: white;
  font-size: medium;
  background: #666666;
  padding-top: 2px;
  border-top: #cccccc 2px solid;
  border-bottom: #333333 2px solid;
  padding-bottom: 2px;
  padding-left: 1em;
  border-left: #cccccc 2px solid;
  border-right: #333333 2px solid;
  padding-right: 2px;
  margin-right: 30%;
}
h2.note {
  font-size: medium;
  background: #666688;
  padding-top: 2px;
  border-top: #ddcccc 2px solid;
  border-bottom: #443333 2px solid;
  padding-bottom: 2px;
  padding-left: 1em;
  border-left: #ddcccc 2px solid;
  border-right: #443333 2px solid;
  padding-right: 2px;
  margin-right: 30%;
}
h3 {
  color: white;
  font-size: medium;
  background: #666666;
  padding-top: 2px;
  border-top: #cccccc 2px solid;
  border-bottom: #333333 2px solid;
  padding-bottom: 2px;
  padding-left: 1em;
  border-left: #cccccc 2px solid;
  border-right: #333333 2px solid;
  padding-right: 2px;
  margin-right: 50%;
}
blockquote {
  color: navy;
}
dt {
  font-weight: bolder;
}
strong {
  font-size: 1.2em;
}
pre.code {
  background: #ccffff;
  margin-left: 2em;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 30px;
  display: table;
  border: outset thin #ccffff;  
}

pre.console {
  color: #ffffff;
  background: #000000;
  margin-left: 2em;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 30px;
  display: table;
}
div.notice {
  background: #ccccff;
  margin-left: 8%;
  margin-right: 8%;
  border: outset thin #ccccff;
}
div.note {
  background: #ddddff;
  border: outset thin #ccccff;
  border-top: 0px;
  border-left: 0px;
}
ul.footnote {
  font-size: small;
}
pre.mail {
  background: #ffffcc;
  border: outset thin #ffffcc;
}
pre.reply {
  background: #ffccff;
  border: outset thin #ffccff;
}
table {
  margin-top: 20px;
  margin-bottom: 20px;
  border-collapse: collapse;
}
table th, table td {
  border: solid 1px black;
}
table th {
  background: whitesmoke;
  text-align: left;
}

table.linenumbertable {
  margin-left: 2em;
  background: #ccffff;
  border-right: solid 1px #99cccc;
  border-bottom: solid 1px #99cccc;
}

table.linenumbertable pre {
  margin-top: 0px;
  margin-bottom: 0px;
}

td.linenumber-left-td {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 3px;
  border: none;
  color: #0000ff;
}

td.linenumber-right-td {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 30px;
  border: none;
}

table.affiliate {
  border: none;
}

table.affiliate td {
  border: none;
  vertical-align: top;
}

span.upperdot {
  -webkit-text-emphasis: filled circle;
  text-emphasis-style: dot;
}