/**
 * basic.css
 * scss: ../scss/basic.scss
 */
/*
 * contents
 */
#yodogawa {
  padding-bottom: 50px; }

/*
 * charactors
 */
#chars {
  top: 0; }
  #chars ul li.char1 {
    top: 20px; }
  #chars ul li.char2 {
    top: 0; }
  #chars ul li.char3 {
    top: 180px; }
  #chars ul li.char4 {
    top: 150px; }

#door {
  top: 50px;
  right: auto;
  left: 25px;
  z-index: 2; }
  #door:hover {
    opacity: 0.6;
    -moz-opacity: 0.6;
    -ms-filter: "alpha(opacity=60)";
    filter: alpha(opacity=60);
    cursor: pointer; }

#banner {
  top: 175px; }

#info {
  position: relative;
  top: auto;
  bottom: auto;
  left: auto;
  right: auto;
  text-align: center; }
  #info .pc, #info .ds {
    display: -moz-inline-stack;
    display: inline-block;
    vertical-align: middle;
    *vertical-align: auto;
    zoom: 1;
    *display: inline;
    margin: 0;
    padding: 0;
    padding: 10px; }

.howto {
  width: 500px;
  margin: 0 auto;
  padding: 25px 0; }
  .ds .howto h2 {
    margin-bottom: 10px; }
  .ds .howto .cap {
    margin-bottom: 50px; }
  .howto h3.attention {
    margin: 50px 0 25px 0; }
  .howto h4 {
    background: url(../images/reader/bg_midashi_pc.png) no-repeat left top;
    height: 60px;
    margin: 50px 0 25px 0;
    font-size: 16px;
    text-align: center;
    line-height: 60px; }
    .ds .howto h4 {
      background: url(../images/reader/bg_midashi_3ds.png) no-repeat left top; }
  .howto p em {
    font-size: 20px;
    font-weight: bold;
    font-style: normal;
    color: #FF0000; }
  .howto .qr {
    margin: 25px 0; }
  .howto .buttons {
    margin: 0;
    padding: 0;
    list-style-type: none;
    letter-spacing: -0.4em; }
    .howto .buttons li {
      display: -moz-inline-stack;
      display: inline-block;
      vertical-align: middle;
      *vertical-align: auto;
      zoom: 1;
      *display: inline;
      margin: 0;
      padding: 0;
      letter-spacing: normal; }
      .howto .buttons li.back {
        padding-left: 20px; }

/*
 * text live
 */
#live .item .comments {
  position: relative; }
  #live .item .comments .icon {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1; }
  #live .item .comments .title {
    height: auto;
    overflow: hidden;
    margin-top: 25px;
    margin-bottom: 25px; }
    #live .item .comments .title .date {
      float: none;
      padding: 0 0 0 20px; }
#live .item .body {
  margin-bottom: 10px; }

.back {
  text-align: center; }

a:hover img.hover {
  opacity: 0.6;
  -moz-opacity: 0.6;
  -ms-filter: "alpha(opacity=60)";
  filter: alpha(opacity=60); }