/* ----------------------------------------------------------------------
	
	トレセン宿泊施設 - 馬主の方へ
	
---------------------------------------------------------------------- */

/* - コンテンツユニット
-------------------------------------------------- */
div.unit {  }

div.unit > p { line-height: 1.6; }


/* - イントロブロック
-------------------------------------------------- */
div.intro {
	display: table;
	width: 100%;
}

div.intro > div.cell {
	display: table-cell;
	vertical-align: top;
}

div.intro > div.cell.img {
	box-sizing: border-box;
	padding-right: 30px;
	width: 470px;
	width: 490px;
	width: 510px;
}

div.intro > div.cell.img img { vertical-align:top; }

/*
div.intro > div.cell.img img {
	width: 100%;
}
*/

#about .caution { font-size: 1.2rem; }

/* ----- ご利用案内 ----- */
table.spec {
	width: 100%;
	margin-top: 20px;
}

table.spec > caption {
	font-size: 1.3rem;
	background-color: #1b521f;
	color: #fff;
	padding: 5px;
}

table.spec tbody tr th,
table.spec tbody tr td {
	border: 1px solid #ddd;
	font-size: 1.3rem;
	padding: 5px 10px;
	vertical-align: middle;
}

/* ----- 部屋の種類・アメニティー ----- */
ul.opt_list {  }

ul.opt_list > li {
	/*display: table;*/
	margin-top: 20px;
}

ul.opt_list > li:first-child {
	/*margin-top: 0;*/
}

/*
ul.opt_list > li > span {
	display: table-cell;
	vertical-align: top;
	line-height: 1.6;
	padding: 2px 0;
}

ul.opt_list > li > span.cap {
	white-space: nowrap;
	padding-right: 0.2em;
}
*/

ul.opt_list > li h4 {
	border-bottom: 1px dotted #ddd;
	padding-bottom: 4px;
	font-size: 1.4rem;
	font-weight: bold;
	color: #555;
}

ul.opt_list > li > p {
	margin-top: 10px;
}



/* - コンテンツユニット
-------------------------------------------------- */

/* ----- 写真・地図ブロック ----- */
.unit > div.main_block {
	display: table;
	width: 100%;
	table-layout: fixed;
}

.unit > div.main_block > div.cell {
	display: table-cell;
	vertical-align: top;
}

.unit > div.main_block > div.cell.img {
	width: 470px;
	padding-right: 30px;
}

.unit > div.main_block > div.cell img { vertical-align: top; }

/* --- 住所 --- */
p.address {
	display: table;
	width: 100%;
	margin-top: 10px;
}

p.address > span {
	display: table-cell;
	vertical-align: middle;
	padding: 6px 8px;
}

p.address > span.cap {
	background-color: #eee;
	width: 2.5em;
	white-space: nowrap;
	font-weight: bold;
	background-color: #1b521f;
	color: #fff;
}

p.address > span.txt { background-color: #f5f5f5; }

p.address > span.txt > span.num { margin-right: 1em; }



/* --- 写真リスト --- */
ul.photo_list {
	font-size: 0;
	margin-top: 30px;
}

ul.photo_list > li {
	font-size: 1.3rem;
	display: inline-block;
	width: 33.33%;
	padding: 0 5px;
	padding: 0 1px;
}

ul.photo_list > li > img { vertical-align: top; }




/* ------------------------------------------------------------

	979px以下

------------------------------------------------------------ */
@media screen and ( max-width : 979px ) {
	
	
	/*
	div.intro > div.cell.img {
		width: 320px;
		width: 40%;
	}
	*/
	
	div.intro {
		display: block;
	}
	
	div.intro > div.cell {
		display: block;
	}
	
	div.intro > div.cell.img {
		text-align: center;
		width: auto;
		padding-right: 0;
	}
	
	div.intro > div.cell.txt {
		margin-top: 20px;
		/*max-width: 500px;*/
		margin: 0 auto;
		margin-top: 20px;
	}
	
	
	
	
	
	.unit > div.main_block > div.cell.img {
		width: 48%;
		padding-right: 20px;
	}
	
	p.address > span.txt > span.num {
		margin-right: 0;
		display: block;
	}
	
	/*
	p.address {
		display: block;
	}
	
	p.address > span {
		display: block;
		
	}
	
	p.address > span.cap {
		width: auto;
		font-size: 1.2rem;
		
	}
	
	*/
	
	
}


/* ------------------------------------------------------------

	767px以下

------------------------------------------------------------ */
@media screen and (max-width : 767px) {
	
	div.intro { display: block; }
	
	div.intro > div.cell { display: block; }
	
	div.intro > div.cell.img {
		width: auto;
		padding-left: 0;
		text-align: center;
		margin-top: 20px;
	}
	
	.unit > div.main_block { display: block; }
	.unit > div.main_block > div.cell {
		display: block;
		text-align: center;
	}
	
	.unit > div.main_block > div.cell.img {
		width: auto;
		padding-right: 0;
	}
	
	.unit > div.main_block > div.cell.img img {  }
	
	p.address {
		margin: 0 auto;
		margin-top: 20px;
		max-width: 470px;
	}
	
	p.address > span { text-align: left; }
	
	.unit > div.main_block > div.cell.map { margin-top: 20px; }
	
}


/* ------------------------------------------------------------

	639px以下

------------------------------------------------------------ */
@media screen and (max-width : 639px) {
	
	/* - 写真リスト
	---------------------------------------------------------------------- */
	ul.photo_list {
		margin-top: 10px;
		max-width: 470px;
		margin: 10px auto 0 auto;
	}
	
	ul.photo_list > li {
		display: block;
		padding: 10px 0;
		width: auto;
	}
	
	
}


/* ------------------------------------------------------------

	479px以下

------------------------------------------------------------ */
@media screen and (max-width : 479px) {
	
	/* - 写真リスト
	---------------------------------------------------------------------- */
	ul.photo_list {
		/*margin-top: 10px;*/
		max-width: none;
		/*margin: 10px auto 0 auto;*/
	}
	
}

/* ------------------------------------------------------------

	359px以下

------------------------------------------------------------ */
@media screen and (max-width : 359px) {
	
	.block_header h3 { font-size: 1.5rem; }
	
	table.spec tbody tr th,
	table.spec tbody tr td { font-size : 1.2rem; }
	
	table.spec tbody tr th { white-space: nowrap; }
	
	
	p.address { display: block; }
	p.address > span { display: block; }
	p.address > span.cap { width: auto; }
	
}