@charset "UTF-8";
/* =====
 * 駐車場検索ページ　レイアウト
============================================================================= */
body {
  margin: 0;
  padding: 0;
}
/* -----
 * ページヘッダー
----------------------------------------------------------------------------- */

/* -----
 * MainContents
----------------------------------------------------------------------------- */
#MainContents .section {
  margin-top: 60px;
}

#MainContents .section:first-child {
  margin-top: 0;
}

#MainContents .section.center,
#MainContents .section .center {
  text-align: center;
}

#MainContents .section span.note {
  font-size:0.8rem;
}
#MainContents .section p.note {
  font-size:0.8rem;
  text-indent: -1.6rem;
  padding-left: 1.6rem;
}
#MainContents .section .note.note__red {
  color: #cc0000;
}

#gmap {
  width:960px;
  height:620px;
  margin:0 auto;
  padding:0;
  overflow:hidden;
  border:0;
}

#mapContainer {width:960px; height:600px; border-collapse:collapse; margin:0; padding:0;}
#mapContainer td {vertical-align:top; margin:0; padding:0;}
#mapContainer td.colL {width:700px; height:600px;}
#mapContainer td.colL #map {width:600px; height:600px; margin:0 100px 0 0;}
#mapContainer td.colR {width:260px; height:600px;}
#mapContainer td.colR #searchParking {width:260px; height:40px; margin:20px 0;}
#mapContainer td.colR #searchParking #address {width:120px;}
#mapContainer td.colR #searchParking .mark_loupe {padding:3px 0 3px 18px; background: url(../images/common/icon-loupe.png) no-repeat 0 1px;}
#mapContainer td.colR #parkinglist {width:260px; height:500px; margin:0; border:solid 1px #CCCCCC; overflow-x:hidden; -webkit-box-sizing:border-box; box-sizing:border-box;}
#mapContainer td.colR #parkinglist #resultItems {width:100%;}
#mapContainer td.colR #parkinglist #resultItems td {text-align:left; padding:8px 8px 8px 10px; background:#ffffff;}
#mapContainer td.colR #parkinglist #resultItems td a {text-decoration:none;}
#mapContainer td.colR #parkinglist #resultItems td.on {background:#f7f7f7;}
#map p{margin:0;}
#map p.xsmall{font-size:85%;}
#map p.fBold{font-weight:bold;}
#map .infodata {}
#map .infodata_img {float:left;}
#map .infodata_text {margin:5px 0 0 10px; float:left;}

/* -----
 * responsive
----------------------------------------------------------------------------- */
@media screen and (min-width: 944px) {
  /* PC */
}

@media screen and (min-width: 768px) and (max-width: 943px) {
  /* tablet */
}

@media screen and (max-width: 767px) {
  /* smart phone */
  /* -----
   * MainContents
  ----------------------------------------------------------------------------- */
  #MainContents .section {
    margin-top: 40px;
  }
  #gmap {
    width:100%;
    height:980px;
  }
  #mapContainer {width:100%; height:980px;}
  #mapContainer td {display:block;}
  #mapContainer td.colL {width:100%; height:360px; margin:0 0 20px 0;}
  #mapContainer td.colL #map {width:100%; height:360px; margin:0 0 0 0;}
  #mapContainer td.colR {width:100%; height:600px;}
  #mapContainer td.colR #searchParking {width:100%; height:auto; margin:10px 0;}
  #mapContainer td.colR #searchParking #address {width:120px;}
  #mapContainer td.colR #searchParking .mark_loupe {padding:3px 0 3px 18px; background: url(../images/common/icon-loupe.png) no-repeat 0 1px;}
  #mapContainer td.colR #parkinglist {width:100%; height:500px;}
  #mapContainer td.colR #parkinglist #resultItems {width:100%;}
  #map .infodata {width:100%;}
  #map .infodata_text {margin:5px 0 0 5px; width:calc(100% - 85px);}
}