@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Source+Serif+Pro);
@import url(https://fonts.googleapis.com/css?family=Noto+Sans);

/* ditai_reset */
* { margin: 0; padding: 0; }
body { -webkit-text-size-adjust: 100%; }
ul, li { list-style: none; }
img { border: 0; }
br { letter-spacing: 0; }
a { text-decoration: none; outline: none; }

::selection { color: #000; background: #ddd; }
::-moz-selection { color: #000; background: #ddd; }

/* basic */
html { font-size: 62.5%; }

body {
  font-family: 'Source Serif Pro', 'Times New Roman', 'Times', 'ƒqƒ‰ƒMƒm–¾’© ProN', 'Hiragino Mincho ProN', 'MS P –¾’©', 'MS PMincho', serif;
  font-size: 1.5em;
  line-height: 1.9;
  color: #333;
  background: #eee;
  background-size: 200px auto;
}
.cap { max-width: 160px; }
.title, .cap {
  display: table;
  width: 100%;
  margin: 0 auto;
}

a:hover { color: #255eae; }
a { color: #333; }

.mkj li a {
  position: relative;
  display: inline-block;
  margin-left: .3em;
}
.mkj li a:after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  content: '';
  border-bottom: 1px solid #ddd;
}
.mkj li a:after { bottom: 7px; }

footer a {
  margin: 0 .5em;
  padding: 2px 4px;
  background: #eee;
}

/* contents-soto */
header, .container, section, .mkj, .text {
  margin: 0 auto;
}
header { max-width: 820px; }
.container {
  width: 84%;
  max-width: 700px;
  padding: 1em 60px 100px;
  background: rgba(255, 255, 255, .75);
}
.cover {
  border-top: 14px solid #eee;
  border-bottom: 12px solid #eee;
  background: rgba(255, 255, 255, .8);
}
section {
  margin: 10px 0;
  padding: 20px 0;
}
.text {
  font-family: 'Noto Sans', 'ƒqƒ‰ƒMƒmŠpƒS ProN W3', 'Hiragino Kaku Gothic ProN', '‚l‚r ‚oƒSƒVƒbƒN', 'MS P Gothic', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
  line-height: 2.0;
  max-width: 800px;
  padding: 30px;
}
ul.kabe {
  font-family: inherit;
  color: #888;
  margin: 3em 0;
}
.kabe li {
  position: relative;
  margin-bottom: 1em;
  padding-left: 2.6em;
  list-style: none;
}
.kabe li:last-child { margin-bottom: 0; }
.kabe li:before {
  position: absolute;
  left: 0;
  content: '\\';
  letter-spacing: -.0750001em;
}
footer {
  font-family: 'Source Serif Pro', 'Times New Roman', 'Times', 'Ÿà–¾’©', 'YuMincho', 'Ÿà–¾’©‘Ì', 'Yu Mincho', 'ƒqƒ‰ƒMƒm–¾’© ProN', 'Hiragino Mincho ProN', 'MS P –¾’©', 'MS PMincho', serif;
  margin: 20px 0 40px;
  padding: 20px 0 40px;
  text-align: center;
}
.meta { text-align: right; }
.meta, .bottom {
  font-size: 1.2rem;
  color: #bbb;
}
.bottom { margin-bottom: 50px; }

/* contents-mokuji */
ol.mkj li {
  margin: 0 0 1em 1.66em;
  list-style-type: decimal-leading-zero;
}
.mkj li span.date {
  float: right;
  color: #bbb;
}

/* typo */
h1, h2, h3 {
  font-family: 'Source Serif Pro', serif;
  font-weight: bold;
  letter-spacing: 2px;
}
h2 {
  font-size: 2.0rem;
  line-height: 1.25;
  margin-bottom: 2rem;
}
h3 {
  font-size: 2.5rem;
  margin: 30px 0 20px;
  text-align: center;
}
h3:after, footer:before {
  display: block;
  width: 60px;
  height: 1px;
  margin: 30px auto 60px;
  content: '';
  background: #ccc;
}


/* device */
@media (max-width: 970px) {
  .container { width: 78%; padding: 1em 11% 100px; }
  .text { width: 80%; padding: 60px 5%; }
}
@media (max-width: 550px) {
  .title { margin: 0 auto; }
}
@media (max-width: 360px) {
  .mkj li span.date { display: none; }
}