@CHARSET "UTF-8";
html {
	height: 100%;
	overflow: hidden;
}
body {
	height: 100%;
	margin: 0px;
	padding: 0px;
	overflow: hidden;
}

a {
  text-decoration: none;
}

h2 {
    font-size: 1.6em;
    color: #ff6c1b;
    margin: 21px 13px 13px 13px;
}
h2:before {
    content: "";
    border-left: 3px solid #ff6c1b;
    padding-right: 5px;
}
.tenant h2 {
    color: #337FD0;
}
.tenant h2:before{
	border-left:3px solid #337FD0;
}

p{
	margin: 0 5px;
}
.gm-style-iw {
    overflow: hidden ! important;
}
.gm-style-iw div {
    overflow: hidden ! important;
}
.gm-style .gm-style-iw-c {
	padding:0;
}
.gm-style .gm-style-iw-d{
	overflow:hidden;
	margin-top:-48px;
}
#map_canvas, #map{
	height: 100%;width: 100%;padding:0;
}
#map_information_bar{
	overflow:hidden;
	width: 100%;
	text-align: left;
	font-size: 12px;
	color:#444444;/* #00A8FF;*/
	height: 21px;
	z-index:3;
	position: relative;
}
.map_information_bar_rent{
	background: rgba(0,64,220,0.7);
}
.map_information_bar_tenant{
	background: rgba(229,0,17,0.8);
}
#slide_panel {  
	position: absolute;
	right:68px;
	width: calc(30em + 44px);
	/*width: calc(100% - 136px);*/
	height: calc(100% - 175px);
	min-width:300px;
	font-size:12pt;
	z-index: 4;  
}
.slide_open{
	overflow:hidden;
	bottom: 0px;
	animation: ConditionSlideIn 0.8s;
}
.slide_close{
	overflow:hidden;
	bottom: calc(209px - 100%);
	animation: ConditionSlideOut 0.8s;
}
@keyframes ConditionSlideIn {
	0% {
		transform: translateY(calc(100% - 34px));
	}
	100% {
		transform: translateY(0);
	}
}
@keyframes ConditionSlideOut {
	0% {
		transform: translateY(calc(34px - 100%));
	}
	100% {
		transform: translateY(0);
	}
}
.slide_switch {
	position:relative;
	width:100%;
	height: 32px;
	font-size:21px;
	color:#ffffff;
	padding-top: 2px;
	background: #ff6c1b;
	border-top-left-radius:13px;
	border-top-right-radius:13px;
	cursor:pointer;
	text-align:center;
}
.slide_switch_tenant{
	background:#337fd0;
}
.submit-form {
    width: 100%;
    height: 55px;
    text-align: center;
	margin: 34px auto 21px auto;
}
.close_switch{
	font-weight:bold;
	font-size:21px;
    padding: 8px 55px;
    background: #ff6c1b;
    color: white;
    text-decoration: none;
    box-shadow: 0 2px 1px -1px #770202;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
	cursor:pointer;
	text-align: center;
}
.search_button{
	line-height:32px;
}
.condition_frame{
	float:right;
	width: 100%;
	height: calc(100% - 34px);
	margin:0;
	padding:0;
	background:white;
	color:#444444;
	overflow:auto;
	overflow-y: scroll;
	overflow-x:hidden;
	scrollbar-highlight-color:#EEF;
	scrollbar-shadow-color:#b0c4de;
	scrollbar-face-color:#b0c4de;
	scrollbar-arrow-color:black;
}

div.condition div.conditions div select {
    font-size: 100%;
    width:10em;
    margin: 0.2em;
    padding: 3px;
    color: #555;
    border: 1px solid #888;
    height: auto;
    background:white;
    
}

.conditions {
	margin: 21px auto;
}

.conditions > div{
	margin:auto;
	width:calc(100% - 26px);
}
.conditions .condition-title{
	overflow:hidden;
	margin: 13px auto;
	height: 34px;
	line-height:34px;
	font-weight: bold;
	border: 1px solid #ff6c1b;

	background-image: linear-gradient( -45deg, #fff 25%, rgba(255,108,31,0.1) 25%, rgba(255,108,31,0.1) 50%, #fff 50%, #fff 75%, rgba(255,108,31,0.1) 75%, rgba(255,108,31,0.1) );
    background-size: 5px 5px;
}
.tenant .conditions .condition-title{
	border-color:#337FD0;
	background-image: linear-gradient( -45deg, #fff 25%, rgba(0,31,255,0.1) 25%, rgba(0,31,255,0.1) 50%, #fff 50%, #fff 75%, rgba(0,31,255,0.1) 75%, rgba(0,31,255,0.1) );
}
.condition-title div{
	float:left;
	padding: 0 8px;
}
.conditions .condition-clear{
	float:right;
	margin: 6px 8px 0px 0px;
	padding: 0 8px;
	color: #00A8FF;
	background:#ffffff;
	font-size:0.8em;
	line-height:21px;
	border: 1px solid #00A8FF;
	border-radius:5px;
	cursor:pointer;
	text-align:center;
}
.conditions .condition-clear:hover{
	color:#ffffff;
	background: #00A8FF;
}
.checkbox-group {
	overflow:hidden;
}

.checkbox-group > div {
	width: 12em;
	float: left;
	white-space: nowrap;
	height:2em;
	line-height:2em;
}

.building_information_window{
	margin:0;
	padding:0;
	width:100%;
	min-height:180px;
}
.building_information_window .header{
	width:100%;
	height:90px;
}
.building_information_window .header img{
	display: block;
	width:100%;
	height:90px;
	margin: 0;
	object-fit: cover;
}

.building_information_window .contents{
	width:calc(100% - 26px);
	min-width:0px;
	margin: 13px;
	color:#666666;
}
.building_information_window .contents div{
	margin:3px 0;
}
.building_information_window .contents .buildingname{
	font-size:1.175em;
	font-weight:bold;
	margin: 5px 0;
	color:#444444;
}
.building_information_window .contents .rent_value{
	font-size:1.4em;
	font-weight:bold;
	color:red;
}
.building_information_window .contents .rent_unit{
	font-size:0.6em;
	margin-left:0.5em;
	color:#444444;
	/*vertical-align:bottom;*/
}
.building_information_window .contents .strong_value{
	font-size:1.2em;
	font-weight:bold;
}
.building_information_window .contents .semi_strong_value{
	font-weight:bold;
}
.building_information_window .contents .around{
	text-align:center;
	margin:5px 0;
	height:34px;
	line-height:34px;
}
.building_information_window .contents .around a, .building_information_window .contents .around span{
	padding:8px 34px;
	color:#00A8FF;
	border: solid 1px #00A8FF;
	border-radius:50vh;
	cursor:pointer;
}
.building_information_window .contents .around a:hover, .building_information_window .contents .around span:hover{
	color:#ffffff;
	background: #00A8FF;
}
.building_information_window .contents .link{
	margin-top:5px;
}
.building_information_window .contents .link a{
	color: #1d3994;
}
.building_information_window .contents .link a:hover{
	color:#b50101;
}
	.room_information_close_button{
		float:right;
		width:34px;
		height:55px;
		margin-top:34px;
		font-size:34px;
		color:#666666;
		padding:3px	0 0 0;
		background: white;
		border-top-right-radius:8px;
		border-bottom-right-radius:8px;
		cursor:pointer;
	}
	.room_information_close_button .text{
	
	}
	.room_information_close_button:hover{
		color:black;
	}
	.room_information_window{
		float:left;
		width:400px;
		height:100%;
		margin:0;
		padding:0;
		background:white;
		overflow:auto;
	}
	.room_information_window_close{
		overflow:hidden;
		display:block;
		z-index:5;
		position:absolute;
		left:-400px;
		top:21px;
		padding:0;
		width:434px;
		
		animation: SlideOut 0.8s;
	}
	.room_information_window_open{
		overflow:hidden;
		display:block;
		z-index:5;
		position:absolute;
		left:0px;
		top:21px;
		padding:0;
		width:434px;
		
		animation: SlideIn 0.6s;
	}
	@keyframes SlideIn {
		0% {
			transform: translateX(-400px);
		}
		100% {
			transform: translateX(0);
		}
	}
	@keyframes SlideInBottom{
		0% {
			transform: translateY(calc(100% - 30px));
		}
		100% {
			transform: translateY(0);
		}
	}
	@keyframes SlideOut {
		0% {
			transform: translateX(400px);
		 }
		15%{
			transform: translateX(440px);
		 }
		100% {
			transform: translateX(0);
		}
	}
	@keyframes SlideOutBottom {
		0% {
			transform: translateY(calc(64px - 100%));
		 }
		100% {
			transform: translateY(0);
		}
	}
	.room_information_window .header{
		width:100%;
		height:225px;
		overflow:hidden;
	}
	
	.room_information_window div.buildingname{
		width:calc(100% - 16px);
		height:21px;
		margin:13px 8px;
		overflow:hidden;

	}
	.buildingname img{
		float:left;
	}
	.buildingname .text{
		float:left;
		font-size:16px;
		font-weight:bold;
		color: #444444;
	}
	.room_information_window .contents{
		width:100%;
		height:calc(100% - 306px);
		min-width:240px;
		margin: 8px 0;
	}
	.room_information_window .noheader_contents{
		width:100%;
		height:calc(100% - 55px);
		min-width:240px;
		margin: 8px 0;
	}
	@media screen and (max-width: 959px) {
		#slide_panel {
			font-size:10pt;
		}
		.slide_switch,	.close_switch{
			font-size:13px;
		}
		.building_information_window{
			width:100%;
		}
		.building_information_window .header{
			height:60px;
		}
		.building_information_window .header img{
			height:60px;
		}
		.building_information_window .contents .around{
			height:21px;
			line-height:21px;
		}
		.building_information_window .contents .around a{
			padding:2px 21px;
		}
		.room_information_window{
			width:360px;
		}
		.room_information_window_open{
			width:394px;
		}
		.room_information_window_close{
			width:394px;
			left:-360px;
		}
		.room_information_window .header{
			height:170px;
		}
		.room_information_window .contents{
			height:calc(100% - 251px);
		}
		.room_information_window .noheader_contents{
			height:calc(100% - 55px);
		}
	}	
	@media screen and (max-width: 639px) {
		p{
			font-size:10pt;
		}
		div.condition div.conditions div select {
			width:8em;
		}
		#slide_panel {
			font-size:10pt;
		}
		.room_information_window{
			width: 100%;
			height: calc(100% - 24px);
			margin:0;
			overflow:hidden;
		}
		.room_information_window_close{
			width: 100%;
			left:0px;
			top:calc(100% - 34px);
			animation: SlideOutBottom 0.8s;
		}
		.room_information_window_open{
			width: 100%;
			left:0px;
			top:0px;
			animation: SlideInBottom 0.6s;
		}
		.room_information_close_button{
			float:none;
			width:100%;
			height:34px;
			margin-top:0px;
			padding:0;
			border-top-left-radius:13px;
			border-top-right-radius:13px;
			border-bottom-right-radius:0;

		}
		.room_information_close_button .text{
			width:1em;
			height:34px;
			line-height:34px;
			margin: auto;
			font-size:24px;
			transform: rotate(-90deg);
			color: #00A8FF;
		}
		.room_information_window .header{
			
		}
		.room_information_window div.buildingname{
			margin :8px;
		}
		.room_information_window .contents{
			height:calc(100% - 218px);
			margin:0;
		}
	}