@charset "UTF-8";
/**
 * おでかけナビ　レスポンシブ用
 *
 */
/* wrapper
   ========================================================================== */
/* サーチエリア
=========================================================== */
#searchWrap {
  /* タブ　
  −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
  /* サーチフィルター
  −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
}

#searchWrap #tabMenu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

#searchWrap #tabMenu li {
  margin-right: 5px;
}

#searchWrap #tabMenu li a {
  display: block;
  width: 250px;
  padding: 10px;
  box-sizing: border-box;
  text-align: center;
  border: 1px solid #c9c9c9;
  border-bottom: none;
  text-decoration: none;
  border-radius: 3px 3px 0 0;
  color: #333;
  background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#EFEFEF));
}

#searchWrap #tabMenu li.active a,
#searchWrap #tabMenu li.activeParent a,
#searchWrap #tabMenu li a:hover {
  background: #cdb55f;
  border-color: #cdb55f;
  color: #FFF;
}

#searchWrap #searchFilterParent .searchChild {
  padding: 20px;
}

#searchWrap #searchFilterParent .searchChild .sttl {
  border-left: 5px solid #cdb55f;
  padding-left: 10px;
}

#searchWrap #searchFilterParent .searchChild .search {
  box-sizing: border-box;
}

#searchWrap #searchFilterParent .searchChild .search form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

#searchWrap #searchFilterParent .searchChild .search form input.keyword {
  height: auto;
  border-radius: 5px 0 0 5px;
  width: 100%;
  padding: 9px;
}

#searchWrap #searchFilterParent .searchChild .search form .btn {
  width: 75px;
  border-radius: 0 5px 5px 0;
}

#searchWrap #searchFilterParent .searchChild .calendar,
#searchWrap #searchFilterParent .searchChild .event {
  margin-top: 10px;
  padding-right: 0;
}

#searchWrap #searchFilterParent .searchChild .btns .active .btn,
#searchWrap #searchFilterParent .searchChild .btns .activeParent .btn {
  background: #cdb55f;
  color: #FFF;
}

#searchWrap #searchFilterParent .searchChild .searchChild2 .search {
  padding-top: 0;
}

#searchWrap #searchFilterParent .searchChild .searchChild2 .search input {
  width: 100%;
  padding: 5px 20px;
  min-height: inherit;
}

@media screen and (max-width: 767px) {
  /* 検索部分
  −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
  #searchWrap {
    width: auto;
    /* タブ
    −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
    /* サーチフィルター
    −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
  }
  #searchWrap #tabMenu {
    margin: 0 -20px;
  }
  #searchWrap #tabMenu li {
    margin-right: 0;
    width: 50%;
    box-sizing: border-box;
  }
  #searchWrap #tabMenu li a {
    display: block;
    width: auto;
    border-radius: inherit;
  }
  #searchWrap #searchFilterParent {
    width: auto !important;
    padding: 0 !important;
  }
  #searchWrap #searchFilterParent .searchChild {
    padding: 20px;
  }
  #searchWrap #searchFilterParent .searchChild .sttl {
    display: none;
  }
  #searchWrap #searchFilterParent .searchChild .search {
    display: inherit;
    box-sizing: border-box;
    padding-right: 0;
  }
  #searchWrap #searchFilterParent .searchChild .search form {
    width: 100%;
    display: table;
  }
  #searchWrap #searchFilterParent .searchChild .search form input.keyword {
    float: left;
    min-height: 35px;
    border-radius: 5px 0 0 5px;
    box-sizing: border-box;
    width: 75%;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
  }
  #searchWrap #searchFilterParent .searchChild .search form .btn {
    float: left;
    width: 25%;
    border-radius: 0 5px 5px 0;
    min-height: 35px;
  }
  #searchWrap #searchFilterParent .searchChild .calendar,
  #searchWrap #searchFilterParent .searchChild .event {
    margin-top: 10px;
    display: inherit;
    padding-right: 0;
  }
  #searchWrap #searchFilterParent .searchChild .btns {
    display: block;
    padding-right: 0;
    margin: 10px -2.5px -2.5px -2.5px;
  }
  #searchWrap #searchFilterParent .searchChild .btns li {
    display: block;
    padding: 2.5px;
    width: 50%;
    box-sizing: border-box;
  }
  #searchWrap #searchFilterParent .searchChild .btns .active .btn,
  #searchWrap #searchFilterParent .searchChild .btns .activeParent .btn {
    background: #cdb55f;
    color: #FFF;
  }
  #searchWrap #searchFilterParent .searchChild2 {
    border-bottom: 3px solid #e4e4e4;
    position: relative;
    padding: 10px 20px 10px 85px;
  }
  #searchWrap #searchFilterParent .searchChild2 .sttl {
    position: absolute;
    left: 20px;
    top: 50%;
    margin-top: -1.5em;
  }
  #searchWrap #searchFilterParent .searchChild2 .pulldown ul li {
    margin-bottom: 5px;
  }
  #searchWrap #searchFilterParent .searchChild2 .pulldown ul li:last-child {
    margin-bottom: 0;
  }
  #searchWrap #searchFilterParent .searchChild2 .pulldown ul li span {
    position: relative;
  }
  #searchWrap #searchFilterParent .searchChild2 .pulldown ul li span:before {
    content: '';
    position: absolute;
    z-index: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    bottom: 0;
    right: 10px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3.5px 3.5px 0 3.5px;
    border-color: #666666 transparent transparent transparent;
  }
  #searchWrap #searchFilterParent .searchChild2 .pulldown ul li span select {
    max-width: 9.5em;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    border: 0;
    margin: 0;
    padding: 0;
    background: none transparent;
    vertical-align: middle;
    font-size: inherit;
    color: inherit;
    box-sizing: content-box;
    border: 1px solid #e4e4e4;
    padding: 3px 20px 3px 3px;
    border-radius: 5px;
    box-sizing: border-box;
  }
  #searchWrap #searchFilterParent .searchChild2 .pulldown,
  #searchWrap #searchFilterParent .searchChild2 .search {
    padding: 10px 0 10px 10px;
    display: block;
    border-left: 1px solid #e4e4e4;
  }
  #searchWrap #searchFilterParent .searchChild2 .search {
    padding-top: 0;
  }
  #searchWrap #searchFilterParent .searchChild2 .search input {
    width: 100%;
    padding: 5px;
    min-height: inherit;
  }
  /* 新着スポット
  −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
  div#newWrap {
    border-top: 1px solid #e4e4e4;
    margin: 30px -20px;
    padding: 30px 20px 0 20px;
  }
  div#newWrap ul {
    width: inherit;
    margin: 0;
    border: 1px solid #e4e4e4;
  }
  div#newWrap ul li {
    margin: inherit;
    width: inherit;
    float: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 20px;
    border-bottom: 1px solid #e4e4e4;
  }
  div#newWrap ul li:last-child {
    border-bottom: none;
  }
  div#newWrap ul li .pict,
  div#newWrap ul li .txt {
    float: none;
  }
  div#newWrap ul li .txt {
    padding-left: 10px;
    width: inherit;
  }
  /* イベントリスト
  −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
  #listWrap .searchList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #listWrap .searchList h2,
  #listWrap .searchList .fr,
  #listWrap .searchList .fl {
    width: inherit;
    float: none;
  }
  #listWrap .searchList h2 {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  #listWrap .searchList .fr {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
  #listWrap .searchList .fr .txtBold {
    border: 1px solid #e4e4e4;
    padding: .5em 1em;
  }
  #listWrap .searchList .fr dl.icons dt, #listWrap .searchList .fr dl.icons dd {
    display: inline-block;
  }
  #listWrap .searchList .fl {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    margin-bottom: 20px;
  }
  #listWrap .searchList .fl img {
    width: 100%;
  }
  /* 詳細
  −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
  div#detailWrap {
    /* 詳細部分のイントロ
    −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
    /* 詳細のGoogle Maps
    −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
  }
  div#detailWrap h2 {
    width: inherit;
    background: #e4e4e4;
    border-bottom: none;
    padding: 10px 20px;
    font-size: 138.461538462%;
  }
  div#detailWrap #introWrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  div#detailWrap #introWrap .fr, div#detailWrap #introWrap .fl {
    float: none;
    width: inherit;
  }
  div#detailWrap #introWrap .fl {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  div#detailWrap #introWrap .fl img {
    width: 100%;
    height: auto;
  }
  div#detailWrap #introWrap .fl dl {
    margin-bottom: 10px;
  }
  div#detailWrap #introWrap .fl dl dt {
    margin-top: 0;
  }
  div#detailWrap #introWrap .fl dl.icons {
    margin-bottom: 20px;
  }
  div#detailWrap #introWrap .fl dl.icons dt, div#detailWrap #introWrap .fl dl.icons dd {
    display: inline-block;
  }
  div#detailWrap #introWrap .fr {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  div#detailWrap #introWrap .fr p {
    width: inherit;
  }
  div#detailWrap #introWrap .fr dl {
    border-bottom: none;
  }
  div#detailWrap #introWrap .fr dl dt {
    padding: inherit;
    padding-top: 10px;
  }
  div#detailWrap #introWrap .fr dl dd {
    width: inherit;
    padding: inherit;
    margin: inherit;
    padding-bottom: 10px;
  }
  div#detailWrap #introWrap .fr dl dd:last-child {
    padding-bottom: 0;
  }
  div#detailWrap #mapWrap {
    border-top: 1px solid #e4e4e4;
    margin: 30px -20px;
    padding: 30px 20px 0 20px;
  }
  div#detailWrap #mapWrap .mapBox {
    border: 1px solid #e4e4e4;
  }
  div#detailWrap #mapWrap .mapBox .marker {
    padding: 0 15px 15px 15px;
  }
  div#detailWrap #mapWrap iframe {
    width: 100%;
  }
  /* ダイヤ検索・アクセスなどのリンク
  −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
  .btmBox.fBox {
    padding: 0;
    border: inherit;
  }
  .btmBox.fBox ul li {
    border: 1px solid #e4e4e4;
    display: block;
    padding: 10px;
    background-position: 20px center;
    padding-left: 30px;
  }
  .btmBox.fBox ul li a {
    display: block;
  }
  .btmBox.fBox ul li:last-child {
    margin-bottom: inherit;
  }
  /* ダイヤ検索・アクセスなどのリンク
  −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
  div.otokuTicketBox {
    border-top: 1px solid #e4e4e4;
    margin-bottom: 20px;
  }
  div.otokuTicketBox div.ticketWrap {
    margin-bottom: 0;
    margin-right: 0;
  }
  div.otokuTicketBox div.ticketWrap ul.boxList li {
    width: inherit;
    padding-bottom: 0px !important;
    margin-right: 0;
  }
  /* ページャー
  −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
  #searchWrap + .pager {
    display: none;
  }
  .pager {
    background: #f9f9f9;
    margin: 0 -20px;
    padding: 40px 20px;
    text-align: center;
  }
  .pager .result {
    display: block;
    margin-right: 0;
    margin-bottom: 10px;
  }
  .pager .pagination > * {
    margin: 0 5px;
  }
  .pager .pagination .num {
    border-right: inherit !important;
    padding: inherit !important;
  }
  .pager .pagination .num a {
    display: inline-block;
    background: #FFF;
    border: 1px solid #e4e4e4;
    padding: .5em .8em;
  }
  /* あなたのチェック履歴
  −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− */
  div.checkHistoryBox {
    margin: 30px -20px;
    border-width: 1px 0 0 0;
    padding-bottom: 0;
  }
  div.checkHistoryBox #checkList {
    border: 1px solid #e4e4e4;
  }
  div.checkHistoryBox #checkList li {
    margin: 0 20px;
    padding-bottom: 0;
    background: none;
    border-bottom: 1px solid #e4e4e4;
  }
  div.checkHistoryBox #checkList li:last-child {
    border-bottom: none;
  }
  div.checkHistoryBox #checkList li a {
    display: block;
    padding: 15px 0 15px 15px;
    background-position: 0 center;
  }
}
