@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);

/*  reset */

html,body,div,span,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
abbr,address,cite,code,
del,dfn,em,img,ins,kbd,q,samp,
small,strong,sub,sup,var,
b,i,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent
}
body {
  line-height:1
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
  display:block
}
nav ul {
  list-style:none
}
blockquote,q {
  quotes:none
}
blockquote:before,blockquote:after,
q:before,q:after {
  contents:none
}
a {
  margin:0;
  padding:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent
}
ins {
  background-color:#ff9;
  color:#000;
  text-decoration:none
}
mark {
  background-color:#ff9;
  color:#000;
  font-style:italic;
  font-weight: 700;
}
del {
  text-decoration:line-through
}
abbr[title],dfn[title] {
  border-bottom:1px dotted;
  cursor:help
}
table {
  border-collapse:collapse;
  border-spacing:0
}
hr {
  display:block;
  height:1px;
  border:0;
  border-top:1px solid #ccc;
  margin:1em 0;
  padding:0
}
input,select {
  vertical-align:middle
}
/*  end of reset */

html {
  font-size: 62.5%;
}

body {
  margin: 0px 0px 20px 0px;
  background-color:#333333;
  text-align: center;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 1.4em;
  font-weight:300;
}

a {
  text-decoration: none;
}

a:link {
  color: #379ff8;
}

a:visited {
  color: #379ff8;
}

a:active {
  color: #8FABBE;
}

a:hover {
  color: #eeeeee;
  text-decoration: underline;
}

blockquote {
  width: 90%;
  margin: 0px auto;
  padding: 5px;
  white-space: pre-wrap;
  border:1px dotted #666;
}

h1, h2, h3 {
  margin: 0px;
  padding: 0px;
  font-weight: 400;
}

form select {
  width: 160px;
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

div#select {
  color: #EEEEEE;
  font-size: small;
  margin: 0 0 0 0;
  padding: 0 0 15px 0;
}

form input.box {
  margin: 15px 0 0 0;
  _margin: 0 0 0 0;
  padding: 0 0 0 0;
  width: 105px;
  _width: 107px;
}
*+html form input.box {
  margin: 0 0 0 0;
}

#container {
  line-height: 140%;
  margin-right: auto;
  margin-left: auto;
  text-align: left;
  padding: 0px;
  width: 760px;
  background-color: #3D4141;
  border: 1px solid #FFFFFF;
}

#banner {
  background-position:left center;
  background-repeat:no-repeat;
  background-image: url("images/banner2.gif");
  background-color: #999999;
  padding: 0px;
  height: 185px;
  border-bottom: 1px solid #FFFFFF;
  font-family: Verdana, Arial, sans-serif;
  color: #EEEEEE;
  text-align: left;
}

#banner-img {
}

#banner a {
  color: #333333;
  text-decoration: none;
}

#banner a:hover {
  color: #999999;
  text-decoration: underline;
}

#banner h1 {
  font-size: 28px;
  /*margin-left: 15px;
  margin-top: 170px;*/
  padding: 5px 15px 1px 10px;
}

#banner h2 {
  color: #000000;
  font-size: 10px;
  padding: 0px 15px 5px 10px;
}

#center {
  float: left;
  width: 560px;
  overflow: hidden;
}

.contents {
  padding: 15px 15px 5px 15px;
  background-color: #3D4141;
  color: #EEEEEE;
  font-size: small;
  font-weight: 100;
  box-sizing: border-box;
}

#right {
  float: left;
  width: 200px;
  background-color: #3D4141;
  overflow: hidden;
}

.contents .content {
  border-top: #999999 1px dotted;
  margin-top: 25px;
  padding-top: 10px;
}
.contents .content ul {
  margin-top: 15px;
  margin-left: 20px;
}

.contents .p {
  color: #EEEEEE;
  font-size: small;
  font-weight: 100;
  line-height: 1.6em;
  text-align: left;
  margin-bottom: 25px;
}

.contents blockquote {
  line-height: 150%;
}

.contents .pagination {
  text-align: center;
  margin-bottom: 25px;
}

.contents h2 {
  color: #EEEEEE;
  font-size: x-small;
  text-align: left;
  font-weight: 700;
  margin-bottom: 10px;
}

.contents h3 {
  color: #EEEEEE;
  font-size: medium;
  text-align: left;
  font-weight: 700;
  margin-top: 4px;
  margin-bottom: 5px;
}

.contents .content p {
  margin-top: 15px;
}

.contents p.posted {
  color: #999999;
  font-size: small;
  border-top: 1px solid #999999;
  text-align: left;
  margin-bottom: 25px;
  line-height: normal;
  padding: 3px;
}

.contents img {
  border:none;
  max-width: 500px;
  height: auto;
}

.sidebar {
  padding: 15px;
}

#calendar {
  line-height: 140%;
  color: #EEEEEE;
  font-size: x-small;
  padding: 2px;
  text-align: center;
  margin-bottom: 30px;
}

#calendar table {
  padding: 2px;
  border-collapse: collapse;
  border: 0px;
  width: 100%;
}

#calendar caption {
  color: #EEEEEE;
  font-size: x-small;
  text-align: center;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .3em;
}

#calendar th {
  text-align: center;
  font-weight: 400;
}

#calendar td {
  text-align: center;
}

.sidebar h2 {
  color: #EEEEEE;
  font-size: x-small;
  text-align: center;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .3em;
}

.sidebar ul {
  padding-left: 0px;
  margin: 0px;
}

.sidebar ul ul {
  margin-bottom: 0px;
}

.sidebar #categories ul {
  padding-left: 15px;
}

.sidebar li {
  color: #EEEEEE;
  font-size: x-small;
  text-align: left;
  line-height: 150%;
  margin-top: 10px;
  list-style-type: none;
}

.sidebar #categories li {
  list-style-type: circle;
}

.sidebar img {
  border: 3px solid #FFFFFF;
}

.photo {
  text-align: left;
  margin-bottom: 20px;
}

.link-note {
  font-size: x-small;
  line-height: 150%;
  text-align: left;
  padding: 2px;
  margin-bottom: 15px;
}

#powered {
  font-size: x-small;
  line-height: 150%;
  text-align: left;
  color: #EEEEEE;
  margin-top: 50px;
}

#comment-data {
  float: left;
  width: 180px;
  padding-right: 15px;
  margin-right: 15px;
  text-align: left;
  border-right: 1px dotted #BBB;
}

textarea[id="comment-text"] {
  width: 80%;
}

.commenter-profile img {
  vertical-align: middle;
  border-width: 0;
}

img.r {
  float: right;
  border: none;
  margin-right:4px;
  margin-top:4px;
  vertical-align:top;
}

img.l {
  float: left;
  border: none;
  margin-right:4px;
  margin-top:4px;
  vertical-align:top;
}

img {
  border: none;
  margin-right:4px;
  margin-top:4px;
}

/* ç”»åƒç”¨ç‰¹æ®Šãƒªãƒ³ã‚¯è‰² */

a.hid {
  color:#222;
  display:none;
  text-decoration:none;
  width:1px;
  height:1px;
  font-size:5px;
  text-indent:-9999px;
  overflow:hidden;
}
.contents ul {
  margin-left: 20px;
  font-size: 12px;
}

.contents ul {
  margin-left: 20px;
  font-size: 12px;
}

.contents ul li {
  padding-bottom: 8px;
  line-height: 150%;
  font-size: small;
  white-space: pre-line;
}

.entry-ads td {
  vertical-align: top;
}

.contents #more {
  margin-top:25px;
}

.contents .categories {
    margin-bottom: 10px;
}

#zenback-widget li.zenback-module-item {
  white-space: inherit;
}

@media screen and (orientation: portrait) { 
  #container {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
  }
  #banner{
    background-size: cover;
    height: 100px;
  }
  #center {
    width: 100%;
  }
  #right {
    display: none;
  }
  .content img.mt-image-none {
    max-width: 100%;
    height: auto;
  }
  iframe[width="560"] {
    width: 100%;
  }
}

#search {
  width: 120px;
}