@charset "UTF-8";
/******************************************************************************
 * /search/css/map.css
 * 貸事務所ドットコム横浜　地図から探すCSS
 *
 * @author UPGRADE, INC.
 * @copyright 2015 SANESU, INC.
 * @package KASHI-JIMUSHO.COM
 * @version 20150411
 *****************************************************************************/

#frame { background: #fff; } 
#main  { width: 950px; margin: 5px; padding: 0; }

/*-----------------------------------------------------------------------------
 * SEARCH BAR
 *---------------------------------------------------------------------------*/
#searchbar { float: left; width: 196px; min-height: 730px; padding: 4px; }
#searchbar dl { padding: 5px; }
#searchbar dt { line-height: 1.5em; }
#searchbar dd { line-height: 1.5em; }
#searchbar select  { margin-bottom: 5px; }
#searchbar p.title { padding-left: 4px; line-height: 24px; color: #fff; }
#searchbar .data   { width: 188px; margin: 0px; padding: 4px; }
#searchbar .field  { display: block; float: left; width: 30px; line-height: 22px; }

/*-----------------------------------------------------------------------------
 * BUIL LIST
 *---------------------------------------------------------------------------*/
#buillist li { height: 40px; padding: 2px 0; border-bottom: #535353 1px solid; }
#buillist p     { height: 32px; padding: 4px; }
#buillist .ico1 { color: #f17b78; background: #fff url(/images/map/icon_1.gif) no-repeat right center; }
#buillist .ico2 { color: #d893c0; background: #fff url(/images/map/icon_2.gif) no-repeat right center; }
#buillist .ico3 { color: #9b90c2; background: #fff url(/images/map/icon_3.gif) no-repeat right center; }
#buillist .ico4 { color: #7f9dcb; background: #fff url(/images/map/icon_4.gif) no-repeat right center; }
#buillist .ico5 { color: #33a3d9; background: #fff url(/images/map/icon_5.gif) no-repeat right center; }
#buillist .ico6 { color: #69b996; background: #fff url(/images/map/icon_6.gif) no-repeat right center; }
#buillist .ico7 { color: #6bc778; background: #fff url(/images/map/icon_7.gif) no-repeat right center; }
#buillist .ico8 { color: #8e9e24; background: #fff url(/images/map/icon_8.gif) no-repeat right center; }
#buillist .ico9 { color: #d6be08; background: #fff url(/images/map/icon_9.gif) no-repeat right center; }
#buillist .ico0 { color: #9F9F9F; background: #fff url(/images/map/icon_0.gif) no-repeat right center; }
#condview { min-height: 60px; background: #fff; border: solid 1px #999; }

/*-----------------------------------------------------------------------------
 * MAP
 *---------------------------------------------------------------------------*/
#map_box { float: left; overflow: hidden; }
#map_box .attention { padding: 5px; background: #000; text-align: center; font-size: 14px; font-weight: bold; color: #fff; }
#map_canvas { width: 745px; height: 635px; }

/*-----------------------------------------------------------------------------
 * BALLOON
 *---------------------------------------------------------------------------*/
#balloon { text-align: left; width:325px; height:220px; }
#balloon div.title { font-size: 10px; color: #333333; }
#balloon div.address  { font-size: 10px; color: #333333; }
#balloon div.stations { font-size: 10px; text-align: left; margin: 2px 0px; }
#balloon { text-align: left; width:300px; margin-right:25px; }
#balloon div.title { color: #333; }
#balloon div.address  { color: #333; }
#balloon div.stations { text-align: left; margin: 2px 0; }

/*-----------------------------------------------------------------------------
 * LIST
 *---------------------------------------------------------------------------*/
#balloon-list { margin: 5px 0px; }
#balloon-list table.floor { margin-top: 5px; width: 300px; border-collapse: collapse; font-size: 12px; table-layout: fixed; }
#balloon-list table.floor tr.odd  td { background-color: #ffffff; }
#balloon-list table.floor tr.even td { background-color: #ffffcc; }
#balloon-list table.floor th { padding: 2px; text-align: center; border: solid 1px #636363; font-weight: normal; background-color: #abccf9; }
#balloon-list table.floor td { padding: 2px; text-align: center; border: solid 1px #636363; font-weight: normal; }

@media screen and (max-width:640px) {

#main { width: 100% !important; margin: 0; background: #fff !important; }
#scrollbox { display: none !important; }

#searchbar { float: none; clear: both; width: auto; min-height: 10px; margin: 0; padding: 0; background: none; }
.searchbox { }
.searchbox select { background: #fff !important; }
.searchbox .pnl-space  { display: none; }
.searchbox .pnl-fee    { display: none; }
.searchbox .pnl-detail { display: none; }
.searchbox .tabs { display: block; overflow: hidden; }
.searchbox .tabs li { float: left; margin-right: 5px; padding: 5px 20px; border: solid 1px #369; border-radius: 4px 4px 0 0; font-weight: bold; }
.searchbox .tabs li a { color: #333; }
.searchbox .tabs li.on { background: #369; color: #fff; }
.searchbox .tabs li.on a { color: #fff; }
.searchbox .container { display: block; margin-top: -1px; padding: 20px 10px; background: #369; color: #fff; }
.searchbox .pnl-detail p { font-size: 16px; }
.searchbox .pnl-detail * { line-height: 30px; }
.searchbox .btnSearch { margin: 5px 0; }
.searchbox .arealist { background: #fff !important; }
.searchbox div.ftype { margin-bottom: 10px; }
.area-title { font-size: 16px; font-weight: bold; color: #369; }

#balloon { margin: 0; }
#map_box { float: none; width: 100% !important; }
#map_box .attention { font-size: 12px; }
#map_canvas { width: auto !important; margin: 5px; height: 300px !important; }

}