/*
Theme Name: Required
Author: 8BIT
*/

/*
     HTML5 Reset :: style.css
*/
/*-------------------------------------------------------------------------------*
* Let's default this puppy out
-------------------------------------------------------------------------------*/
.youtube2 {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube2 iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
.nav-sin {
    padding: 30px 0;
    position: relative;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
}
.nav-sin .sep {
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    border-left: 1px dashed #444;
}
.nav-sin:after {
clear: both;
}
.nav-sin a {
    font-size: 12px;
    display: block;
    font-weight: bold;
    text-decoration: none;
    text-transform: uppercase;
color: #333333;
}
.nav-sin a:hover {
    color: #1111cc;
}
.nav-left {
    float: left;
    width: 36%;
    padding: 0 7%;
    text-align: center;
}
.nav-right {
    float: right;
    width: 36%;
    padding: 0 7%;
    text-align: center;
}
.catebox {
position: relative;
}
li {
list-style: none;
}

#hidari {
          float: left;
     padding-left:20px;
}

#migi {
          float: right;
     padding-right:20px;
  text-align: right;
}

.site-title a {
color: #ffffff;
border: 3px solid #ffffff;
padding: 5px;
}

.site-description {
color: #ffffff;
}
.site-title a:hover {
color: #000000;
border: 3px solid #000000;
padding: 5px;
text-decoration: none;
transition: color 0s ease-in-out;
}
.menu ul li a {
color: #ffffff;
  font-size: 11px;
}
.menu ul li a:hover {
color: #fff;
background: #5a5a58;
padding-left: 12px;
opacity: .4;
}
ul li a:hover {
color: #fff;
background: #5a5a58;
opacity: .4;
}
p {line-height:1.8em;
letter-spacing: 0.1em;
}
p a{color:#1111cc;
text-decoration:none;}
p a:hover{text-decoration:underline;}
* {
  word-wrap: break-word;
}
a:hover{text-decoration:underline;}
#sample4 {
  width:90%;
  font-size: 16px;
  color:#333333;
  padding:20px;
}
#sample4 li {
  list-style-type : none;
  color:#333333;
  border-top:1px solid #fff;
  border-bottom:1px solid #999;
}
#sample4 li:first-child{
  border-top:0px;
}
#sample4 li:last-child{
  border-bottom:0px;
}
#sample4 li a{
  text-decoration:none;
  color:#333333;
  display:block;
  padding:5px 10px;
  -moz-transition-property: all;
  -moz-transition-duration: 0.2s;
  -moz-transition-timing-function: linear;
  -webkit-transition: all 0.2s linear 0;
}
#sample4 li a:hover{
  color:#1111cc;
  padding:5px 8px 5px 12px;
  background:rgba(255,255,255,0.5);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#99ffffff', endColorstr='#99ffffff');
}
.related-all {
padding-bottom:30px;
padding-top:20px;
}


.related-post {
  width:100%;
  overflow:hidden;
  margin-top:5px;
}
.related-entry {
  vertical-align: top;
padding-bottom: 20px;
  width:150px;
  font-size: 12px;
  min-height: 150px;
  margin: 0;
  padding-right: 20px;
display: inline-block;

}
.related-entry img{
  width:150px;
  display: block;
}

.related-entry moji{
  display: block;
text-decoration:none;
bottom: 0;
}


.entry-content li{
  width:90%
  overflow:hidden;
  margin-top:5px;
height: 30px;
}

.google {
  padding-bottom: 20px;
}

.widget h2 {
font-size: 17px;
margin-top:35px;
margin-bottom:2px;
}
.wpp-list ul {
  list-style: none;
}


.widget li {
  list-style-type : none;
  color:#333333;
  border-top:1px solid #fff;
  border-bottom:1px solid #999;
  padding:5px 10px;
}
.widget li:first-child{
  border-top:0px;
}
.widget li:last-child{
  border-bottom:0px;
}
.widget li a{
  text-decoration:none;
  color:#333333;
  display:block;
  -moz-transition-property: all;
  -moz-transition-duration: 0.2s;
  -moz-transition-timing-function: linear;
  -webkit-transition: all 0.2s linear 0;
}
.widget li a:hover{
  color:#1111cc;

  background:rgba(255,255,255,0.5);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#99ffffff', endColorstr='#99ffffff');
}


.blogrank {
margin-bottom: 40px;
}

.twi a {
color: #ffffff;

}

.box2 {padding: 10px;
margin: 1em 0;
border: 1px solid #ddd;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
    line-height: 1.8em;
    letter-spacing: 0.1em;
}
.box2 p {line-height:1.8em;
letter-spacing: 0.1em;
margin-bottom: 0em;
}
.box2 img {
     float: left;
     margin: 0px 10px 0px 0px;
}
.box1 {background-color: #DCDCDC;
     overflow: auto;
     line-height:1.5;
     padding: 16px;
}
.box1 p {
     overflow: auto;     /* for modern browser */
     zoom: 1;     /* for ie6 */
     line-height: 1.5;

}
.box img {
     float: left;
     margin: 0px 10px 0px 0px;
}


html,
body,
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,
figure,
footer,
header,
menu,
nav,
section,
time,
mark,
audio,
video,
details,
summary {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
/* consider resetting the default cursor: https://gist.github.com/murtaugh/5247154 */
article,
aside,
figure,
footer,
header,
nav,
section,
details,
summary {
  display: block;
}
/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
   If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */
img,
object,
embed {
  max-width: 100%;
  height: auto;
}
/* force a vertical scrollbar to prevent a jumpy page */
html {
  overflow-y: scroll;
}
/* we use a lot of ULs that aren't bulleted.
     don't forget to restore the bullets within content. */
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
del {
  text-decoration: line-through;
}
abbr[title],
dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help;
}
/* tables still need cellspacing="0" in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0;
}
th {
  font-weight: bold;
  vertical-align: bottom;
}
td {
  font-weight: normal;
  vertical-align: middle;
}
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}
input,
select {
  vertical-align: middle;
}
pre {
  white-space: pre;
  /* CSS2 */

  white-space: pre-wrap;
  /* CSS 2.1 */

  white-space: pre-line;
  /* CSS 3 (and 2.1 as well, actually) */

  word-wrap: break-word;
  /* IE */

}
input[type="radio"] {
  vertical-align: text-bottom;
}
input[type="checkbox"] {
  vertical-align: bottom;
}
.ie7 input[type="checkbox"] {
  vertical-align: baseline;
}
.ie6 input {
  vertical-align: text-bottom;
}
select,
input,
textarea {
  font: 99% sans-serif;
}
table {
  font-size: inherit;
  font: 100%;
}
small {
  font-size: 85%;
}
strong {
  font-weight: bold;
}
td,
td img {
  vertical-align: middle;
}
/* Make sure sup and sub don't screw with your line-heights
     gist.github.com/413930 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
/* standardize any monospaced elements */
pre,
code,
kbd,
samp {
  font-family: monospace, sans-serif;
}
/* hand cursor on clickable elements */
.clickable,
label,
input[type=button],
input[type=submit],
input[type=file],
button {
  cursor: pointer;
}
/* Webkit browsers add a 2px margin outside the chrome of form elements */
button,
input,
select,
textarea {
  margin: 0;
  max-width: 100%;
}
/* make buttons play nice in IE */
button {
  width: auto;
  overflow: visible;
}
/* scale images in IE7 more attractively */
.ie7 img {
  -ms-interpolation-mode: bicubic;
}
/* let's clear some floats */
.clearfix:before,
.clearfix:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden;
}
.clearfix:after {
  clear: both;
}
.clearfix {
  zoom: 1;
}
/* Colors
-------------------------------------------------------------------------------*/
/* Typography
-------------------------------------------------------------------------------*/
body {

font-family: 'Source Sans Pro',"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif;
  color: #333;
  line-height: 1.5;
  font-size: 100%;
overflow-x: hidden;

}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 300;
  letter-spacing: 1px;
  margin-bottom: 26px;
  line-height: 1.2;
  font-family: 'Lato', 'Helvetica Neue', Helvetica, sans-serif;
}
h6 {
  font-size: 2px;
}
h5 {
  font-size: 12px;
}
h4 {
  font-size: 22px;
}
h3 {
  font-size: 32px;
}
h2 {
  font-size: 42px;
}
h1 {
  font-size: 30px;
color: #FFFFFF;
}
a {
  color: #9e9d98;
  text-decoration: none;
}

p {
  margin: 0 0 30px;
}
/* Image alignment - Thanks http://www.wpfill.me/
-------------------------------------------------------------------------------*/
.alignleft {
  float: left;
  margin: 0 15px 30px 0;
}
.aligncenter {
  display: block;
  margin: 0 auto 30px auto;
}
.alignright {
  float: right;
  margin: 0 0 30px 15px;
}
.alignnone {
  float: none;
  display: block;
  margin: 0 0 30px 0;
}
.size-full {
  margin: 0 0 30px 0;
}
p .alignleft {
  float: left;
  margin: 5px 15px 30px 0;
}
p .aligncenter {
  display: block;
  margin: 5px auto 30px auto;
}
p .alignright {
  float: right;
  margin: 5px 0 30px 15px;
}
p .alignnone {
  float: none;
  display: block;
  margin: 5px 0 30px 0;
}
.wp-caption {
  max-width: 100%;
  background: #f1f1f1;
}
.wp-caption .wp-caption-text {
  text-align: center;
  color: #777;
  padding: 8px 20px;
  font-size: 14px;
  margin-bottom: 0;
}
.wp-caption img {
  width: 100%;
  margin-bottom: 0;
}
/* Theme styles
-------------------------------------------------------------------------------*/
#wrapper {
  width: 100%;
padding-bottom: 30px;
}
#sidebar {
  background-color: rgb(97, 96, 93);
    position: absolute;
  left: 0;
  top: 0;
}
#topwara {
width: 90%;
margin: 0 auto;
}

#topbarmigi{
          float: right;
     padding-right:20px;
}
#main {
  width: 900px;
  background: #fff;
  margin-left: 300px;
  padding-top: 0px;
}
#masthead .bio-pic img {
  max-width: 100%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: margin 0.25s ease-in-out;
  -moz-transition: margin 0.25s ease-in-out;
  -o-transition: margin 0.25s ease-in-out;
  -ms-transition: margin 0.25s ease-in-out;
  transition: margin 0.25s ease-in-out;
}
#masthead .bio-pic img:hover {
  margin-top: -5px;
  margin-bottom: 5px;
}
#masthead .site-title {
  font-size: 18px;
  font-weight: 300;
  text-transform: uppercase;
  margin: 20px 0 10px;

}
#masthead .site-description {
  font-size: 12px;
  line-height: 1.4;
}
nav {
  margin-top: 30px;
}
nav ul li {
display: inline-block;
margin: 0 5px;
}
nav ul li a {
  display: block;
  padding: 5px 0;
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  -ms-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}
nav ul li a:hover {
  color: #fff;
  background: rgba(55, 160, 150, 0.4);
  padding-left: 12px;
}
/* Page/post/article/content styles
-------------------------------------------------------------------------------*/
/* page */
.page article {
  border-bottom: none;
}
/* posts */
article {
  margin: 0 0 40px;
  padding: 0 0 90px;
  border-bottom: 1px solid #f1f1f1;
}
article .post-meta {
  font-size: 12px;
  text-transform: uppercase;
  color: #b3c0bf;
  padding: 0 0 10px;
}
article header {
    position: absolute;
    bottom:0px;
margin-bottom: 40px;
    background-color: rgba(97, 96, 93, 0.7);
    opacity: 1.7;

}
article header:hover{
     background-color: rgb(97, 96, 93);
    opacity: 1;
transition: 0.3s;
}

article header .entry-title {
  line-height: 1.2;
  text-transform: uppercase;
  word-spacing: 5px;
  margin: 20px;
  font-weight: 700;

}
article header .entry-title a {
color: #FFFFFF;
}
article header .entry-title a:hover{

text-decoration: none;
}
article .featured-image {
  margin-bottom: 40px;
    position: relative;
}
article .featured-image img:hover {

}
article .featured-image img {

  min-width: 100%;

  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.2);
}
article .twitter-tweet {
  width: 100%;
}
article .post-footer {
  font-size: 12px;
  color: #f1f1f1;
}
article .post-footer a {
  color: #d8d8d8;
}
article .post-footer a:hover {
  color: #37a096;
}
/* Stying of the elements */
.entry-content,
#comments .comment-body {
  padding: 0 0 20px;
}
.entry-content img,
#comments .comment-body img {
  max-width: 100% !important;
  height: auto;
}
.entry-content ol,
#comments .comment-body ol,
.entry-content ul,
#comments .comment-body ul {
  margin-left: 40px;
  margin-bottom: 40px;
  list-style: disc;
}
.entry-content ol ol,
#comments .comment-body ol ol,
.entry-content ul ol,
#comments .comment-body ul ol,
.entry-content ol ul,
#comments .comment-body ol ul,
.entry-content ul ul,
#comments .comment-body ul ul {
  margin-left: 20px;
  margin-bottom: 0;
}
.entry-content dl,
#comments .comment-body dl {
  margin-bottom: 30px;
}
.entry-content dl dt,
#comments .comment-body dl dt {
  font-weight: bold;
}
.entry-content dl dd,
#comments .comment-body dl dd {
  font-size: 14px;
  margin-bottom: 30px;
}

.entry-content blockquote{
    position: relative;
    margin: 0 1em 1.5em;
    padding: 1em;
    border: 3px solid #d7d7d7;
    background-color: #e0e0e0;
    z-index: 1;
}

.entry-content blockquote p{
    position: relative;
    z-index: 3;
}

.entry-content blockquote:before{
    content: "“";
    font-size: 1000%;
    line-height: 0.8em;
    font-family: 'Times New Roman' ,"ＭＳ Ｐゴシック" ,sans-serif;
    color: #F0F0F0;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
}
#comments .comment-body blockquote {
  font-family: georgia, serif;
  font-size: 18px;
  border-left: 10px solid #f1f1f1;
  padding-left: 20px;
  margin-bottom: 30px;
  background: #fff;
  width: 80%;
}
.entry-content cite,
#comments .comment-body cite {
  font-family: 'Varela Round', 'Helvetica Neue', Helvetica, sans-serif;
  font-size: 12px;
  color: #b3c0bf;
}
.entry-content address,
#comments .comment-body address {
  font-size: 14px;
  margin-bottom: 30px;
}
.entry-content acronym,
#comments .comment-body acronym,
.entry-content abbr,
#comments .comment-body abbr {
  border-bottom: 1px dotted #37a096;
  cursor: help;
}
.entry-content code,
#comments .comment-body code,
.entry-content pre,
#comments .comment-body pre {
  color: #666;
  background: #f1f1f1;
  padding: 2px 8px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}
.entry-content pre,
#comments .comment-body pre {
  margin-bottom: 30px;
  padding-left: 20px;
}
.entry-content q,
#comments .comment-body q {
  font-style: italic;
}
/* Comments
-------------------------------------------------------------------------------*/
#respond {
  margin: 60px 0;
}
#respond form > p {
  margin-bottom: 10px;
}
#respond textarea {
  border-color: #b3c0bf;
  width: 100%;
  box-sizing: border-box;
  min-height: 150px;
  padding: 10px;
}
#respond input[type="text"] {
  border: 1px solid #b3c0bf;
  padding: 10px;
  width: 100%;
  box-sizing: border-box;
}
#respond label {
  font-size: 12px;
}
#respond .comment-notes {
  font-size: 12px;
  display: none;
}
#respond #reply-title {
  font-size: 16px;
}
#respond #cancel-comment-reply-link {
  color: red;
}
#respond #cancel-comment-reply-link:hover {
  color: rgba(255, 0, 0, 0.6);
}
.comment #respond {
  margin: 20px 40px;
}
#comments .comment-list {
  list-style: none;
}
#comments .comment .comment {
  margin-left: 10px;
}
#comments .comment .comment-body {
  margin-bottom: 10px;
  border: 1px solid #f1f1f1;
  padding: 15px 20px 20px;
}
#comments .comment .comment-body .comment-author {
  position: relative;
  padding-left: 40px;
  margin-bottom: 20px;
}
#comments .comment .comment-body .comment-author img {
  position: absolute;
  left: 0;
  top: 5px;
}
#comments .comment .comment-body .comment-author .fn {
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
}
#comments .comment .comment-body .comment-meta {
  font-size: 12px;
}
/* table styling */
table {
  background: #fff;
  /*margin-bottom: 30px;*/
  /*border: solid 1px #dddddd;*/
}
table thead,
table tfoot {
  background: whitesmoke;
  font-weight: bold;
}
table thead tr th,
table thead tr td,
table tfoot tr th,
table tfoot tr td {
  padding: 8px 15px;
  font-size: 14px;
  text-align: left;
}
table tr th,
table tr td {
  padding: 8px 10px;
  font-size: 14px;
  color: #333;
  /*border-bottom: 1px solid #ddd;*/
}
table thead tr th,
table tfoot tr th,
table tbody tr td,
table tr td,
table tfoot tr td {
  display: table-cell;
  line-height: 1.4;
}
/* pagination */
#secondary-nav {
  text-transform: uppercase;
  font-size: 18px;
  font-weight: 300;
}
.nav-next {
  float: right;
}
#secondary-nav .nav-previous {
  float: left;
}
#secondary-nav .nav-next {
  float: right;
}
/* Footer
-------------------------------------------------------------------------------*/
#site-footer {
  padding: 10px 0;
background-color: rgb(97, 96, 93);
}
#site-footer a {
color: #ffffff;
}
#site-footer #credit {
  font-size: 12px;
  text-align: right;
  padding: 10px 20px;
}
/* archive
-------------------------------------------------------------------------------*/
.archive article,
.search article {
  margin-top: 20px;
  padding-bottom: 20px;
}
.archive article .post-meta {
  font-size: 12px;
  text-transform: uppercase;
  color: black;
  padding: 0 0 10px;
}

.archive article .featured-image,
.search article .featured-image {
  margin-bottom: 0;
  max-height: 150px;
max-width: 150px;
  overflow: hidden;
  text-align: center;
margin-left: 0;
margin-right: 0;
}
.archive article .featured-image img,
.search article .featured-image img {
  background: #f1f1f1;
}
.archive article .entry-content,
.search article .entry-content {
  padding-bottom: 20px;
}
.archive article .entry-content p,
.search article .entry-content p {
  margin-bottom: 10px;
}
.col1 {

}
.col2 {

}
/* Search page template
-------------------------------------------------------------------------------*/
#big-search * {
  box-sizing: border-box;
}
#big-search input[type="search"] {
  width: 80%;
  float: left;
  border: 1px solid #b3c0bf;
  padding: 12px 10px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}
#big-search input[type="submit"] {
  width: 20%;
  float: right;
  background: #333;
  color: #fff;
  border: none;
  padding: 13px 15px;
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  -ms-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}
#big-search input[type="submit"]:hover {
  background: rgba(55, 160, 150, 0.5);
}
#widget-area {
  margin: 40px 0;
}
#widget-area h2 {
  font-size: 18px;
}
#widget-area .col1 {

}
#widget-area .col2 {

}
/* Error 404 page
-------------------------------------------------------------------------------*/
.error404 h1 {
  color: red;
}
.error404 article {
  border-bottom: none;
}
/* Jetpack
-------------------------------------------------------------------------------*/
.tiled-gallery {
  margin-bottom: 40px !important;
}
.infinite-scroll #secondary-nav {
  display: none;
}
#infinite-footer .container {
  width: 100%;
  background: transparent;
  border: none;
}
#infinite-footer .blog-info {
  display: none;
}
#infinite-footer .blog-credits {
  width: auto;
}
#infinite-handle {
  width: 100%;
  margin-bottom: 40px;
}
#infinite-handle span {
  color: #37a096;
  background: transparent;
  border: 1px solid #b3c0bf;
  text-align: center;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  text-transform: uppercase;
  display: block;
  opacity: 1;
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  -ms-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}
#infinite-handle span:hover {
  opacity: 0.5;
}
/* Media Queries
-------------------------------------------------------------------------------*/
/* Tablet devices vertical */

@media only screen and (max-width: 100000px) {
  #sidebar {
    float: none;
    width: 100%;
    height: auto;
    position: relative;
    text-align: center;
  }
#topbar {
    float: left;
    padding-left: 20px;
}
table tr td {
  padding: 8px 10px;
  font-size: 16px;
  color: #333;
  /*border-bottom: 1px solid #ddd;*/
}
article .featured-image {
  margin-bottom: 55px;
  margin-left: -100px;
  margin-right: -100px;
}
  #main {
    float: none;
    width: 750px;
    margin: 0 auto; 
    text-align: left;
padding-top: 0px;
  }
}
#topwara {
width: 900px;
margin: 0 auto;
}
@media only screen and (max-width: 1000px) {
#topwara {
width: 90%;
margin: 0 auto;
}

  #sidebar {
    float: none;
    width: 100%;
    height: auto;
    position: relative;
    text-align: center;
  }
article .featured-image {
  margin-bottom: 55px;
  margin-left: -50px;
  margin-right: -50px;
}
article .deka-image {
  margin-left: -50px;
  margin-right: -50px;
}
  .entry-title {
    font-size: 20px;
  }

  nav ul li a:hover {
    padding-left: 0;
  }
  #main {
    float: none;
    width: 90%;
    padding: 0px 5% 0;

  }
h2 {
  font-size: 30px;
}
}
/* Mobile devices vertical */
@media only screen and (max-width: 500px) {
#topwara {
    width: 100%;
}

#topbar {
 float:;
padding-left: 10px;
}
article header {
    position: absolute;
    bottom: 0px;
    margin-bottom: 10px;
    opacity: 1.7;
}
article header .entry-title {
    line-height: 1.2;
    text-transform: uppercase;
    word-spacing: 5px;
    margin: 10px;
    font-weight: 700;
}
  #sidebar {
    float: none;
    width: 100%;
    height: auto;
    position: relative;
    text-align: center;

  }
  .entry-title {
    font-size: 15px;
  }
.related-entry {
  vertical-align: top;
padding-bottom: 20px;
  width:80px;
  font-size: 12px;
  min-height: 100px;
  margin: 0;
  padding-right: 20px;
display: inline-block;

}
.related-entry img{
  width:100px;
  display: block;
}
article .featured-image {
  margin-bottom: 40px;
  margin-left: -27px;
  margin-right: -27px;
}
article .deka-image {
  margin-left: -27px;
  margin-right: -27px;
}
  nav ul li a:hover {
    padding-left: 0;
  }
  #main {
    float: none;
    width: 90%;
    padding: 0px 5% 0;
    margin-left: 0;
  }
  .entry-title {
    font-size: 15px;
  }
h1 {
  font-size: 22px;
}


h2 {
    margin: 0 0 1.5em;
    padding: 0.8em;
    border-top: 3px double #000000;
    border-bottom: 3px double #000000;
    font-size: 1.143em;
    font-weight: bold;
}
#hidari {
          float: center;
}
h3 {
  font-size: 20px;
font-weight: bold;
}

#migi {
          float: left;
  text-align: left;
padding-left: 20px;
}
nav {
  margin-bottom: 0px;
margin-top: 0px;
}
  #respond #respond input[type="text"] {
    width: 100%;
  }
}



.hatena-asin-detail:after { display: block; visibility: hidden; font-size: 0; height: 0; clear: both; content: "."; }
.hatena-asin-detail .hatena-asin-detail-image { float: left; margin-right: 15px; }
.hatena-asin-detail .hatena-asin-detail-title { margin-top: 0; font-weight: bold; margin: 0 0 .3em 0; }  .hatena-asin-detail p { text-indent: 0; margin: 0px; }
.hatena-asin-detail .hatena-asin-detail-foot { clear: left; }
.hatena-asin-detail ul {
list-style: none;
margin: 0;
padding: 0;
}
.hatena-asin-detail {
  border: none;
  background: #f7f7f7;
  color: #4d4d4d;
  padding: 20px;
}
.hatena-asin-detail li {
  line-height: 1.4;
height: auto;
margin-top: 0px;
}

/* mixins
-------------------------------------------------------------------------------*/
/* required
-------------------------------------------------------------------------------*/
.sticky, .gallerry-caption .bypostauthor, .gallery-caption {}