html {
  background: hsl(110, 15%, 92%);
  color: hsl(0, 0%, 49%);
}

body {
  font: 1em;
  font-family: '微软雅黑', 'メイリオ', 'Meiryo', 'Lucida Sans Unicode','Trebuchet MS',helvetica,Garamond,Arial;
  margin: 0 auto;
  padding-top: 40px;
  width: 42em;
}

h1 {
  font: 420% Georgia;
  padding: 0;
  position: fixed;
  top: -45px;
  color: hsl(0, 0%, 100%);
  text-shadow: 0 -1px 1px hsla(0, 0%, 0%, 0.25);
  background: rgb(233, 238, 232);
  background: rgba(233, 238, 232, 0.9);
  width: 700px;
}

/* entry
---------*/

h2 {
  border-bottom: 2px dashed hsl(0, 0%, 100%);
  color: hsl(196, 20%, 52%);
  padding: 4px 0;
  font-size: 1.4em;
  font-weight: bold;
  display: inline-block;
}

a {
  text-decoration: none;
}

a img {
  border: none;
  vertical-align: text-bottom;
}

article a {
  color: hsl(0, 0%, 100%);
  background-color: hsl(192, 56%, 70%);
  padding: 0 4px;
  border-radius: 3px;
}

[role] {
  float: left;
  width: 700px;
  padding-top:35px;
}

div.NinjaEntryCommercial {
  display: none;
}

div.entry_body img {
  padding: 1px;
  border: 1px solid hsl(0, 0%, 80%);
}

blockquote {
  background: hsl(240, 33%, 95%);
  width: 90%;
  padding: 0.5em;
  border-left: 2px dotted hsl(0, 0%, 80%);
  border-top: 1px solid hsl(0, 0%, 87%);
  border-bottom: 1px solid hsl(0, 0%, 87%);
  white-space: normal;
  overflow: auto;
  font: 1.0em Arial;
}

blockquote:hover {
  border-left: 2px solid hsl(0, 0%, 60%);
}

abbr, acronym {
  border-bottom: .1em dotted hsl(0, 100%, 50%);
  cursor: help;
  padding: 0 0 1px;
}

code {
  color: #990000;
  font-family: 'Courier New', Courier, monospace;
  font-size: 1em;
}

/* maru
--------*/

ul {
  width: 1em;
  padding: 0;
  float: right;
  list-style: none;
}

ul li {
  width: 2.5em;
  height: 2.5em;
  overflow: hidden;
  float: right;
  text-align: right;
  background: hsl(210, 100%, 64%);
  -webkit-border-radius: 2.5em;
  -moz-border-radius: 2.5em;
  border-radius: 2.5em;
}

ul a {
  opacity: 0;
  float: right;
  color: hsl(57, 99%, 68%);
  background: hsl(210, 100%, 64%);
  padding: 0 5px;
  margin: 9px 5px;
  display: inline;
  -webkit-border-radius: 2.5em;
  -moz-border-radius: 2.5em;
  border-radius: 2.5em;
}

ul li:hover {
  width: 8em;
}

ul li,[role]>*>*:not(h2),ul li:hover a {
  -webkit-transition: ease-out .1s;
  -moz-transition: ease-out .1s;
  -o-transition: ease-out .1s;
  transition: ease-out .1s;
  opacity: 1;
}

/* paginate
------------*/

nav {
  padding: 10px 0;
  text-align: right;
}

/* response
------------*/

dl.post {
  background: hsl(0, 0%, 80%);
  border-radius: 5px;
  padding-bottom: 10px;
  padding-top: 10px;
}

dl.post dt, dl.res dt {
  margin: 8px 10px;
}

dl.post dd, dl.res dd {
  margin: 0 10px 8px;
}

dl.res {
  background: hsl(0, 0%, 87%);
  color: hsl(0, 0%, 22%);
  border-radius: 5px;
  padding-bottom: 10px;
  padding-top: 10px;
}

/* comment
-----------*/

h3#comments {
  margin-bottom: 20px;
  padding: 0 30px 0;
  color: hsl(212, 100%, 15%);
}

div.comment {
  margin: 0 22px;
}

div.comment form {
  margin: 0 10px;
}

div.comment input, div.comment textarea {
  margin-top: 2px;
  padding: 1px 2px;
  border: 1px solid hsl(0, 0%, 80%);
  background: hsl(0, 0%, 100%);
}

#name, #mail, #url, #comment, #tb_url {
  width: 400px;
}

#pass {
  width: 100px;
}

input#submit {
  width: 60px;
  height: 20px;
  background: hsl(0, 0%, 93%);
  font-size: 13px;
}

dl.com_form {
  margin: 20px;
}

dl.com_form dt {
  float: left;
  clear: left;
  width: 60px;
  font-size: 11px;
}

div.com_post {
  padding: 0;
}

/* trackback
-------------*/

h3#trackbacks {
  margin-bottom: 10px;
  padding: 0 30px 0;
  color: hsl(212, 100%, 15%);
}

div.trackback {
  padding: 0 22px 30px;
}

div.trackback p {
  margin: 0 10px 20px;
  font-size: 11px;
}

div.trackback input {
  margin-top: 2px;
  padding: 1px 2px;
  border: none;
  background: hsl(0, 0%, 100%);
  font-size: 11px;
}

div.trackback dl {
  margin-top: 3px;
  padding: 8px 10px;
  border: 1px solid hsl(0, 0%, 87%);
  background: hsl(0, 0%, 97%);
}

div.trackback dt {
  margin-bottom: 5px;
  font-size: 11px;
}

div.trackback dd {
  font-size: 77%;
}

/* footer
----------*/

footer {
  clear: both;
  width: 104%;
  font-size: 80%;
  margin-top: 48px;
  padding: 5px 0;
  border-top: 1px solid hsl(0, 0%, 80%);
  -moz-box-shadow: 0 -4px 4px -4px hsl(0, 0%, 78%);
  -webkit-box-shadow: 0 -4px 4px -4px hsl(0, 0%, 78%);
  box-shadow: 0 -4px 4px -4px hsl(0, 0%, 78%);
}

#analyze {
  text-align:center;
}

p.copyright, p.copyright a {
  color: hsl(214, 38%, 35%);
}
#top {
  float: right;
}