@charset "utf-8";

/*
	=====================================================================
	REC住宅情報
	
	Style Info	:	おすすめ売買物件情報画面スタイル
	File Name	:	/common/css/sec/recommend/recommend.css
	first Update:	2010.01.20
	Last Update	:	2010.01.30
	Auth		:	株式会社インタープロ
	=====================================================================
*/

/* a:hover(background-color解除)
---------------------------------------------------------------------- */
#contents .pager a:hover,
#contents .back a:hover,
#contents .detail a:hover {
	background: none;
	}

/* h3
---------------------------------------------------------------------- */
#contents h3 {
	margin: 0;
	padding: 0;
	background: none;
	}

/* pager-upper
---------------------------------------------------------------------- */
#contents .pager-upper {
	padding-bottom: 21px;
	background: url(../../../img/union/line_dashed.jpg) bottom left repeat-x;
	}
	
/* pager-lower */
#contents .pager-lower {
	padding-top: 20px;
	}
	
	/* pager
	------------------------------------------------------------ */
	#contents .pager {
		float: right;
		color: #333;
		font-size: 85%;
		}
		
		/* ul
		-------------------------------------------------- */
		#contents .pager ul {
			list-style: none;
			}
			
			/* li
			---------------------------------------- */
			#contents .pager ul li {
				float: left;
				margin-right: 3px;
				font-family: arial;
				font-style: italic;
				font-weight: bold;
				}
			
			/* prev next
			---------------------------------------- */
			#contents .pager ul li.prev,
			#contents .pager ul li.next {
				}
				
				/* a
				------------------------------ */
				#contents .pager ul li a {
					position: relative;
					display: block;
					padding: 5px 8px;
					color: #333;
					border: 1px #e4e4e4 solid;
					}
				
				/* a:link a:visited
				------------------------------ */
				#contents .pager ul li a:link,
				#contents .pager ul li a:visited {
					text-decoration: none;
					}
				
				/* a:hover a:active
				------------------------------ */
				#contents .pager ul li a:hover,
				#contents .pager ul li a:active {
					color: #DE0005;
					border: 1px #DE0005 solid;
					background: none;
					text-decoration: none;
					}
				
				/* prev a next a
				------------------------------ */
				#contents .pager ul li.prev a,
				#contents .pager ul li.next a {
					padding: 9px 8px;
					}
				
				/* em
				------------------------------ */
				#contents .pager ul li em {
					display: block;
					padding: 5px 8px;
					background-image: url(../../../img/union/bg_slash_gray.gif);
					color: #fff;
					border: 1px #e4e4e4 solid;
					}

/* article
---------------------------------------------------------------------- */
#contents .article {
	width: 740px;
	background: url(../../../../recommend/img/line_dashed_2column.gif) top left repeat-y;
	}
	
	/* article-inner
	------------------------------------------------------------ */
	#contents .article-inner {
		width: 740px;
		padding: 21px 0;
		background: url(../../../img/union/line_dashed.jpg) bottom left repeat-x;
		}
		
		/* article-left
		-------------------------------------------------- */
		#contents .article-left {
			float: left;
			width: 350px;
			}
		
		/* article-right
		-------------------------------------------------- */
		#contents .article-right {
			float: right;
			width: 350px;
			}
			
			/* h3
			---------------------------------------- */
			#contents .article h3 {
				font-size: 75%;
				font-weight: normal;
				margin-bottom: 3px;
				padding: 0 0 0 23px;
				line-height: 15px;
				background: url(../../../img/union/icon_house.jpg) center left no-repeat;
				}
			
			/* h4
			---------------------------------------- */
			#contents .article h4 {
				color: #333;
				font-size: 100%;
				margin: 0 0 12px 0;
				padding: 0;
				}
			
			/* data
			---------------------------------------- */
			#contents .article .data {
				
				}
				
				/* thumbnail
				------------------------------ */
				#contents .article .thumbnail {
					float: left;
					position: relative;
					width: 100px;
					height: 100px;
					top: 0;
					text-align: center;
					}
					
					/* photo
					-------------------- */
					#contents .article .thumbnail img.photo {
						z-index: 0;
						}
					
					/* frame
					-------------------- */
					#contents .article .thumbnail img.frame {
						z-index: 1;
						position: absolute;
						top: 0;
						left: 0;
						}
				
				/* p
				------------------------------ */
				#contents .article p {
					float: right;
					width: 235px;
					color: #333;
					font-size: 75%;
					line-height: 160%;
					}
					
					/* em
					-------------------- */
					#contents .article p em {
						font-style: normal;
						margin-right: 5px;
						padding: 0 3px 2px 3px;
						background-color: #efefef;
						/*
						background: url(../../../../recommend/img/em.gif) bottom left repeat-x;
						border-bottom: 7px solid #FFF209;
						*/
						}

/* utility-upper
---------------------------------------------------------------------- */
#contents .utility-upper {
	margin-bottom: 17px;
	}
	
#contents .utility-lower {
	}
	
	/* back
	------------------------------------------------------------ */
	#contents .back {
		float: left;
		}
	
	/* detail
	------------------------------------------------------------ */
	#contents .detail {
		float: right;
		}

/* detail-upper
---------------------------------------------------------------------- */
#contents .detail-upper {
	width: 740px;
	padding-bottom: 8px;
	background: url(../../../img/union/line_dashed.jpg) bottom left repeat-x;
	}
	
	/* point
	------------------------------------------------------------ */
	#contents .detail-upper .point {
		margin-bottom: 13px;
		padding-bottom: 7px;
		background: url(../../../img/union/line_dashed.jpg) bottom left repeat-x;
		}
		
		/* h3
		-------------------------------------------------- */
		#contents .detail-upper .point h3 {
			font-size: 75%;
			padding: 3px 0 3px 23px;
			background: url(../../../img/union/icon_house.jpg) center left no-repeat;
			}
	
	/* title
	------------------------------------------------------------ */
	#contents .detail-upper .title {
		margin-bottom: 7px;
		padding-bottom: 10px;
		border-bottom: 1px solid #333;
		/*
		background: url(../../../img/union/line_dashed.jpg) bottom left repeat-x;
		*/
		}
		
		/* h4
		-------------------------------------------------- */
		#contents .detail-upper .title h4 {
			color: #333;
			font-size: 150%;
			margin: 0;
			padding: 0;
			/*
			background: url(../../../img/union/icon_attention.jpg) center left no-repeat;
			*/
			}
			
			/* span
			---------------------------------------- */
			#contents .detail-upper .title h4 span {
				background: url(../../../../recommend/img/em.gif) bottom left repeat-x;
				}
	
	/* p
	------------------------------------------------------------ */
	#contents .detail-upper p {
		color: #333;
		font-size: 75%;
		line-height: 140%;
		}
		
		/* em
		-------------------------------------------------- */
		#contents .detail-upper p em {
			font-style: normal;
			margin-right: 10px;
			padding: 0 3px 2px 3px;
			background: url(../../../../fair/img/em.gif) bottom left repeat-x;
			/*
			background-color: #efefef;
			*/
			}

/* detail-middle
---------------------------------------------------------------------- */
#contents .detail-middle {
	width: 740px;
	background: url(../../../../recommend/img/detail_center_bg.jpg) top left repeat-y;
	}
	
	/* detail-middle-upper
	------------------------------------------------------------ */
	#contents .detail-middle-upper {
		padding: 20px 0;
		background: url(../../../img/union/line_dashed.jpg) bottom left repeat-x;
		}
		
		/* gmap
		-------------------------------------------------- */
		#contents .detail-middle-upper .gmap {
			float: left;
			width: 420px;
			}
			
			/* h4
			---------------------------------------- */
			#contents .detail-middle-upper .gmap h4 {
				margin-bottom: 20px;
				}
			
			/* MAP
			---------------------------------------- */
			#contents .detail-middle-upper .gmap #MAP {
				width: 418px;
				height: 233px;
				border: 1px solid #333;
				margin-bottom: 10px;
				}
			
			/* img
			---------------------------------------- */
			#contents .detail-middle-upper .gmap img {
				border: 1px solid #333;
				margin-bottom: 10px;
				}
			
			/* h4 img
			---------------------------------------- */
			#contents .detail-middle-upper .gmap h4 img {
				margin: 0;
				border: 0;
				}
			
			/* img.nomap
			---------------------------------------- */
			#contents .detail-middle-upper .gmap img.nomap {
				border: 0;
				}
			
			/* a
			---------------------------------------- */
			#contents .detail-middle-upper .gmap a {
				font-size: 75%;
				}
		
		/* photo
		-------------------------------------------------- */
		#contents .detail-middle-upper .photo {
			float: right;
			width: 280px;
			}
			
			/* h4
			---------------------------------------- */
			#contents .detail-middle-upper .photo h4 {
				margin-bottom: 20px;
				}
			
			/* exterior
			---------------------------------------- */
			#contents .detail-middle-upper .photo .exterior {
				position: relative;
				width: 280px;
				height: 235px;
				top: 0;
				text-align: center;
				margin-bottom: 10px;
				}
			
				/* photo
				------------------------------ */
				#contents .detail-middle-upper .photo .exterior img.photo {
					z-index: 0;
					}
				
				/* frame
				------------------------------ */
				#contents .detail-middle-upper .photo .exterior img.frame {
					z-index: 1;
					position: absolute;
					top: 0;
					left: 0;
					}
			
			/* a
			---------------------------------------- */
			#contents .detail-middle-upper .photo a {
				font-size: 75%;
				}
	
	/* detail-middle-lower
	------------------------------------------------------------ */
	#contents .detail-middle-lower {
		padding: 20px 0;
		background: url(../../../img/union/line_dashed.jpg) bottom left repeat-x;
		}
		
		/* memo
		-------------------------------------------------- */
		#contents .detail-middle-lower .memo {
			float: left;
			width: 420px;
			}
			
			/* h4
			---------------------------------------- */
			#contents .detail-middle-lower .memo h4 {
				margin-bottom: 20px;
				}
			
			/* p
			---------------------------------------- */
			#contents .detail-middle-lower .memo p {
				color: #333;
				font-size: 75%;
				line-height: 140%;
				padding: 10px;
				background-color: #f7f7f7;
				}
		
		/* contact
		-------------------------------------------------- */
		#contents .detail-middle-lower .contact {
			float: right;
			width: 280px;
			}
			
			/* h4
			---------------------------------------- */
			#contents .detail-middle-lower .contact h4 {
				margin-bottom: 20px;
				}
			
			/* h5
			---------------------------------------- */
			#contents .detail-middle-lower .contact h5 {
				color: #333;
				font-size: 85%;
				margin-bottom: 5px;
				padding-bottom: 7px;
				background: url(../../../img/union/line_dashed.jpg) bottom left repeat-x;
				}
			
			/* number
			---------------------------------------- */
			#contents .detail-middle-lower .contact .number {
				color: #333;
				font-size: 75%;
				line-height: 140%;
				}
				
				/* address
				------------------------------ */
				#contents .detail-middle-lower .contact .number address {
					font-style: normal;
					}
				
				/* em
				------------------------------ */
				#contents .detail-middle-lower .contact .number em {
					font-size: 131.25%;
					font-family: arial;
					font-weight: bold;
					}

/* detail-lower
---------------------------------------------------------------------- */
#contents .detail-lower {
	width: 740px;
	margin-bottom: 20px;
	padding: 20px 0 1px 0;
	background: url(../../../img/union/line_dashed.jpg) bottom left repeat-x;
	}
	
	/* h4
	------------------------------------------------------------ */
	#contents .detail-lower h4 {
		margin-bottom: 20px;
		}
	
	/* table
	------------------------------------------------------------ */
	#contents .detail-lower table {
		margin: 0;
		}
		
		/* th
		-------------------------------------------------- */
		#contents .detail-lower table th {
			color: #666;
			width: 20%;
			text-align: left;
			}
		
		/* noline
		-------------------------------------------------- */
		#contents .detail-lower table .noline {
			border: 0;
			}