.sp {
  display: block;
}
.pc {
  display: none;
}

/* First View -------------------- */
#first-rap {
  background-position: center 90px;
  background-size: 100% auto;
  height: auto;
  margin-bottom: 30px;
  padding-top: 20px;
  width: 100%;
}
#first-rap>img {
  width: 100%;
}
#first-content {
  padding-top: 90px;
}
#question {
  width: 40px;
}
#first-content p {
  font-size: 13pt;
  padding: 0 20px;
}
#first-content a {
  display: inline-block;
  float: left;
  width: 50%;
}
#first-content a img {
  width: 100%;
}

/* Layout -------------------- */
#wrap {
  padding-top: 25px;
}
.rap {
  padding: 0 10px;
  width: auto;
}
.home #content {
  height: 4000px;
}

/* Header -------------------- */
#site-head {
  background-position: center 60px;
  background-size: 80% auto;
  height: auto;
  padding: 10px 0 20px;
}
  #site-head h1 {
    left: 0;
    position: static;
  }
    #site-head h1 img {
      width: 100%;
    }

/* Navigation -------------------- */
#site-nav {
  display: none;
}
#sp-site-nav {
  display: block;
  max-width: 510px;
  margin: 40px auto 0;
}
#sp-site-nav>ul {
  display: none;
  margin: 0 10px;
}
#sp-site-nav>ul>li>a {
  background-image: linear-gradient(0deg, #f6c719, #ffd647);
  color: #8d1517;
  font-size: 9pt;
  font-weight: bold;
  display: block;
  padding: 10px;
  text-decoration: none;
}
#sp-site-nav ul>li .childe {
  position: static;
}
#sp-site-nav ul>li .childe a {
  background: #e8b500;
  color: #8d1517;
  display: block;
  padding: 10px;
  text-decoration: none;
}
#menu_open {
  background: #ffd647;
  background-image: linear-gradient(0deg, #f6c719, #ffd647);
  border-radius: 5px;
  margin: 0 10px;
}
#menu_open a {
  color: #600c0e;
  display: block;
  font-family: 'Raleway', sans-serif;
  font-size: 9pt;
  font-weight: bold;
  padding: 15px 0;
  text-align: center;
  text-decoration: none;
}

/* Sub Nav -------------------- */
#sub-nav {
  height: 25px;
}
#sub-nav .rap {
  padding: 0;
}
  #sub-nav li img {
    height: 25px;
  }

/* Content -------------------- */
#content-rap {
}
  #content-rap:before,
  #content-rap:after {
    height: 0;
  }
  #content-middle {
    background: none;
    background: #3c1917;
    border: 2px solid #736755;
    border-radius: 10px;
    margin: 0 auto;
    max-width: 470px;
    padding-top: 20px;
  }
  .tbox {
    margin: 0;
    padding: 0;
  }
  #box2 img,
  #box4 img,
  #box5 img,
  #box6 img,
  #box7 img,
  #box8 img,
  #box10 img,
  #box11 img,
  #box12 img,
  #box13 img {
    width: 100%;
  }
  #box9 {
    background: #4f3c30;
    border: 2px solid #886830;
    padding-bottom: 20px;
  }
  #box9 .txtbox1,
  #box9 .txtbox2 {
    padding: 10px;
  }
  #box9 .txtbox1 a img,
  #box9 .txtbox2 a img {
    width: 130px;
  }
  #box9 li {
    float: left;
    width: 50%;
  }
  .txtbox2 {
    clear: both;
  }
  #box9 .txtbox2 ul {
    padding: 0;
  }
/* Footer -------------------- */
#left-foot {
  float: none;
}
  #left-foot h3 {
    text-align: center;
  }
  #left-foot h3 img {
    max-width: 493px;
    width: 100%;
  }
#right-foot {
  background: none;
  float: none;
  margin-bottom: 20px;
  text-align: center;
  width: auto;
}
  #right-foot a {
    color: #fff;
  }
  #right-foot address {
    white-space: normal;
  }
#foot-nav a {
  display: inline-block;
  padding: 10px;
}
#last .rap {
  padding: 0;
}
#copy {
  background: #3e1917;
  color: #fff;
  display: block;
  text-align: center;
}

#container {
  width: 100% !important;
}
.item-photo {
  margin: 0 !important;
}

#shop-title-box {
  height: auto;
  margin-bottom: 0;
  padding-top: 50px;
  width: auto;
}
#shop-title-box h2 {
  overflow: hidden;
  width: 100%;
}
#shop-title-box h2 img {
  width: 220%;
}
#filters {
  position: relative;
  top: 0;
  right: 0;
}
#filters li {
  float: left;
  width: 50%;
}
#filters li img {
  width: 100%;
}
.page-id-38 #leadtxt {
  clear: both;
  position: relative;
  top: -30px;
}
.page-id-35 #leadtxt {
  clear: both;
  margin-bottom: 30px;
  position: relative;
  top: 10px;
}
.item p {
  width: auto;
}

/* 店舗詳細 
===================================================== */
#sushi-title { background: #d2c7b0 url(../img/title/sp/shop-title-bg-01.png) center 5px no-repeat; background-size: auto 30px; }
#grilled-meat-title { background: #d2c7b0 url(../img/title/sp/shop-title-bg-02.png) center 5px no-repeat; background-size: auto 30px; }
#tavern-title { background: #d2c7b0 url(../img/title/sp/shop-title-bg-03.png) center 5px no-repeat; background-size: auto 30px; }
#noodles-title { background: #d2c7b0 url(../img/title/sp/shop-title-bg-04.png) center 5px no-repeat; background-size: auto 30px; }
#western-title { background: #d2c7b0 url(../img/title/sp/shop-title-bg-05.png) center 5px no-repeat; background-size: auto 30px; }
#snack-title { background: #d2c7b0 url(../img/title/sp/shop-title-bg-06.png) center 5px no-repeat; background-size: auto 30px; }
#bar-title { background: #d2c7b0 url(../img/title/sp/shop-title-bg-07.png) center 5px no-repeat; background-size: auto 30px; }
#karaoke-title { background: #d2c7b0 url(../img/title/sp/shop-title-bg-08.png) center 5px no-repeat; background-size: auto 30px; }
.shop-title {
  font-size: 12pt;
  line-height: 140%;
  height: auto;
  padding: 45px 10px 5px;
  text-align: center;
}
.shop-title span {
  display: block;
  font-size: 8pt;
  margin: 0;
}
#shop-option {
  background: #c6b696;
  border: 1px solid #fff;
  padding: 5px 5px 0;
  position: static;
}
#shop-option img {
  height: 25px;
  line-height: 100%;
}
#shop-left,
#shop-right {
  clear: both;
  float: none;
  margin: 0 auto;
  width: auto;
}
#shop-left #large-photo {
  margin-bottom: 20px;
  margin-left: 0;
  width: auto;
}
#shop-left .bottom-thumb {
  margin-bottom: 10px;
}
#shop-left img {
  line-height: 100%;
  margin: 0;
}
.detail-box p {
  font-size: 8pt;
  line-height: 160%;
}
.detail-box p:first-child {
  padding: 10px 0;
}
.detail-box p:first-child span {
  font-size: 10pt !important;
}
#detail-talbe {
  float: none;
  padding: 0;
  width: 100%;
}
#detail-talbe table {
  float: none;
  table-layout: fixed;
}
#detail-talbe th,
#detail-talbe td {
  background: #d1c8b2;
  font-size: 8pt;
  padding: 5px;
  word-break: break-all;
}
#coupon-img {
  float: none;
  padding: 20px 0;
  width: auto;
}
#coupon-img img {
  display: block;
  margin: 0 auto;
}
#coupon-img>p {
  text-align: center;
}

#votebox {
  height: auto;
  background-size: 180px auto;
  padding: 50px 0 0;
}
#couponbox td {
  display: block;
  padding: 0 5px;
}
#couponbox td p {
  margin-bottom: 5px;
}

#couponbox.detail-box p:first-child {
  padding: 0;
}

/* Hub Page 
===================================================== */
#hub-pages {
  margin: 0;
  width: auto;
}
#hub-pages h2 {
  overflow: hidden;
}
#hub-pages h2 img {
  width: 220%;
}
#hub-pages .itembox {
  font-size: 8pt;
  height: auto;
  line-height: 140%;
  margin: 0 4% 4% 0;
  padding: 1%;
  width: 45%;
}
#hub-pages .itembox:nth-child(even) {
  margin-right: 0;
}
#hub-pages .itembox img {
  width: 100%;
}

/* Common Page 
===================================================== */
.around-right,
.around-left {
  float: none;
  margin: 0;
}
.txtbox h2 {
  font-size: 12pt;
  font-weight: bold;
  line-height: 140%;
  text-align: center;
}
.postbox {
  border-bottom: 1px dashed #666;
  padding-bottom: 10px;
}
.postbox:last-child {
  border: none;
  margin-bottom: 10px;
  padding: 0;
}
.postbox img {
  height: auto;
  width: 100%;
}
.postbox h3,
.postbox h3.serif,
.postbox h4.serif {
  font-size: 12pt;
  font-weight: bold;
  line-height: 140%;
  margin-bottom: 10px;
}
.postbox,
.postbox p,
.postbox address {
  font-size: 9pt;
  line-height: 160%;
}
.around-txt {
  overflow: visible;
}
.grayarea {
  margin-bottom: 20px;
  padding: 8px !important;
}
.postbox.grayarea {
  border: 1px solid #aaa;
}

.page-id-273 .postbox h4 {
  margin: 0 !important;
}
.postbox td,
.postbox th {
  font-size: 8pt;
}

/* レンガ横丁 
===================================================== */
#beige-bg.renga {
  padding: 9px;
}
#renga_lead {
  height: auto;
  width: auto;
}
#renga_lead h2 img {
  width: 100%;
}
#renga_lead #description {
  height: auto;
  position: static;
  width: auto;
}
#renga_lead #description p {
  line-height: 140%;
}
#renga_lead #description .large_font {
  font-size: 12pt;
}
#renga_lead #description .small_font {
  font-size: 8pt;
}
#renga_lead #description p:last-child {
  background: #ccc;
  padding: 10px;
  text-align: left;
}
#renga_lead #description p:last-child span {
  display: block;
  font-size: 9pt;
  margin: 0 0 5px;
  position: static;
}
#renga_lead+p {
  display: none;
}

#renga_map {
  background: none;
  height: auto;
  width: auto;
}
#renga_map ul {
  display: none;
}
.renga_detail {
  display: block;
  height: auto;
  margin: 0 0 10px;
  padding: 5px;
  position: static;
  width: auto;
}
.renga_detail h3 {
  background: #fcaa52;
  font-size: 11pt;
  height: auto;
  padding: 5px;
  width: auto;
}
.renga_detail h3 span {
  font-size: 8pt;
  display: block;
}
.detail_txt {
  float: none;
  height: auto;
  margin-bottom: 5px;
  width: auto;
}
.detail_img {
  float: none;
  margin: 0 auto;
  max-width: 220px;
  width: 100%;
}

/* はなまシュラン 
===================================================== */
#c-crown {
  display: block;
  margin: 0 auto;
  max-width: 238px;
  width: 100%;
}
#c-leadtxt {
  margin-bottom: 20px;
}
#c-leadtxt h3 {
  font-size: 12pt;
  margin: 10px 0;
}
#c-leadtxt p {
  font-size: 9pt;
  line-height: 140%;
}
#choice img {
  height: 15px;
  margin: 5px;
  width: auto;
}
.hanamachelin h2.img-h2 img {
  width: 100%;
}

.ranking-box>.clearfix>img {
  display: block;
  margin: 0 auto 10px;
  max-width: 230px;
  width: 100%;
}
.ranking-detail h3 {
  font-size: 11pt;
  text-align: center;
  width: auto;
}
.rd-left,
.rd-right,
#ranking4 .rd-left {
  float: none;
  width: auto;
}
.star {
  display: none;
}
.rd-left table {
  margin-bottom: 10px;
  table-layout: fixed;
  width: 100%;
}
.rd-left td,
.rd-left th {
  word-break: break-all;
}

/* おすすめナイトプラン 
===================================================== */
.plan-column .txtbox>img {
  height: auto;
  width: 100%;
}
.plan-column .postbox h3 {
  height: auto;
  overflow: hidden;
  width: 100%;
}
.plan-column .postbox h3 img {
  width: 150%;
}
.column-childe {
  float: none;
  height: auto;
  margin: 0 auto;
  max-width: 242px;
  width: 100%;
}
.column-childe img {
  display: block;
  width: 100%;
}

.ankake h2.img-h2,
.otaru-sushi h2.img-h2,
.soup h2.img-h2 {
  height: auto;
  overflow: hidden;
  width: 100%;
}
.ankake h2.img-h2 img,
.otaru-sushi h2.img-h2 img,
.soup h2.img-h2 img {
  width: 150%;
}
.ankake .postbox h3+img,
.otaru-sushi .postbox h3+img,
.soup .postbox h3+img {
  display: block;
  margin: 0 auto 10px;
  max-width: 242px;
  width: 100%;
}
.ankake .both img,
.otaru-sushi .both img,
.soup .both img {
  margin-bottom: 10px;
}
.ankake .both p.align-right,
.otaru-sushi .both p.align-right,
.soup .both p.align-right {
  margin-top: 0 !important;
}

/* 新着トピックス 
===================================================== */
.topics h2 img {
  width: 100%;
}
.topics .topics-left,
.topics .topics-right {
  float: none;
  width: auto;
}
.topics-sub-name {
  height: auto;
}
.topics-sub-name span {
  display: block;
}
.topics-left img {
  margin: 0 auto;
  max-width: 250px;
  width: 100%;
}

/* 小樽都市伝説 
===================================================== */
.smallarea {
  width: auto;
}
.urban-legend .title-img {
  height: auto;
  left: none;
  position: static;
  width: 100%;
}
.smallarea img.around-left {
  display: block;
  margin: 0 auto;
  max-width: 193px;
  width: 100%;
}
.smallarea .around-txt h3 img {
  height: auto;
  width: 100%;
}
.smallarea .around-txt p {
  font-size: 9pt;
  line-height: 160%;
}

/*　花街へのアクセス 
===================================================== */
.access .postbox table {
  word-break: break-all;
}
.access .postbox table a {
  display: block;
  padding: 5px 0;
}
.access .postbox:last-child>div {
  padding-left: 10px !important;
}

/* ホテル情報 
===================================================== */
.hotel h2.img-h2 img {
  height: auto;
  margin-bottom: 10px;
  width: 100%;
}
.h2-overlap-txt {
  margin: 0;
  padding: 0;
}
.h2-overlap-txt p {
  line-height: 160%;
}
.hotel .postbox .thin-color {
  float: none;
  margin-top: 0;
  table-layout: fixed;
}
.hotel .postbox .thin-color td {
  font-size: 7pt;
  padding: 5px 2px;
}
.thin-color tr td:first-child {
  width: 50px;
}

/* 駐車場情報 
===================================================== */
.parkingbox {
  display: none;
  width: auto;
}
.map-txt {
  border-bottom: 1px dashed #aaa;
  display: block;
  padding: 15px 0;
}
#mp7txt {
  margin-bottom: 30px;
}

/* 花街への掲載 
===================================================== */
.about-post .w834 {
  width: auto;
}
.about-post .w834 img:nth-child(1) {
  width: 99px;
}

/* フォトギャラリー 
===================================================== */
#pgbox {
  margin: 0;
  width: auto;
}
#pgbox a {
  border: none;
  margin: 2%;
  width: 46%;
}

#pgbox a img {
  width: 100%;
}