@charset "utf-8";
/* CSS Document */


.scrollin {
    opacity : 0;
    transform : translate(0, -30px);
    transition : opacity 1200ms, transform 1200ms;
    }
 
.scrollin.on {
    opacity : 1;
    transform : translate(0, 0);
    }

.icon_list li,
.tab_wrap ul.tab li:not(.on){
	cursor:pointer;
	}
.remarks{
	font-size: 85%!important;
	margin-top: 10px !important;
	text-indent: -1em;
	margin-left: 1em;
	text-align: left !important;
	padding-left: 7px;
	line-height: 1.45em;
	}
.remarks + .remarks{
	margin-top:5px!important;
	}

/* pc */
@media screen and (min-width: 801px),screen and (orientation: landscape), print {

	
#contents {
	margin-bottom: 200px;
	width: auto;
	margin-top: 0;
	}
	
	
	#title{
		height:935px;
		background-image:url(../images/title_bg.jpg);
		background-position:center;
		background-size:cover;
		position:relative;
		}
		#title_wrap h2{
			margin-top:-200px;
			width:300px;
			display:block;
			margin-left:auto;
			margin-right:auto;
			text-align:center;
			position:relative;
			z-index:1;
			font-weight:normal;
			}
			#title_wrap h2 > span{
				width:100%;
				padding-top:25px;
				padding-bottom:70px;
				box-sizing:border-box;
				display:inline-block;
				background:rgba(0,0,0,0.8);
				font-size: 18px;
				line-height: 2em;
				letter-spacing: 0.1em;
				color:#fff;
				}
				#title_wrap h2 > span span{
					display:block;
					font-size: 12px;
					margin-bottom: 10px;
					}
		/*
		#title h2{
			text-align:center;
			position:absolute;
			bottom:-50px;
			width:100%;
			}
			#title h2 > span{
				width:200px;
				padding-top:25px;
				height:353px;
				box-sizing:border-box;
				display:inline-block;
				background:rgba(0,0,0,0.8);
				}
			#title h2 > span img{
				width:118px;
				}
			*/
	.intro{
		line-height: 3em;
		text-align: center;
		margin: 40px auto 100px;
		font-size: 14px;
		width:800px;
		}
		
	.tab_wrap{
		}
		/* タブ */
		.tab_wrap ul.tab{
			max-width:1200px;
			margin-right:auto;
			margin-left:auto;
			padding-left:50px;
			padding-right:50px;
			}
		.tab_wrap ul.tab li{
			width:50%;
			box-sizing:border-box;
			text-align:center;
			font-size:17px;
			letter-spacing:0.5em;
			}
		.tab_wrap ul.tab li:nth-of-type(1){
			float:left;
			}
		.tab_wrap ul.tab li:nth-of-type(2){
			float:right;
			}
			
		.tab_wrap ul.tab li.on{
			background-color:#F6F4E9;
			padding:20px;
			}
		.tab_wrap ul.tab li:not(.on){
			padding:10px;
			}
			.tab_wrap ul.tab li:not(.on) span{
				background-color:#000;
				color:#fff;
				padding:10px;
				display:block;
				transition:background-color  1000ms;
				-webkit-transition:background-color  1000ms;
				}
			.tab_wrap ul.tab li:not(.on) span:hover{
				background-color:#F6F4E9;
				color:#494949;
				transition:background-color  1000ms;
				-webkit-transition:background-color  1000ms;
				}
				
		/* タブ 中身 */
		.shinkan{
			/*display:none;*/
			}
		.tab_content{
			background-color:#F6F4E9;
			padding:50px;
			padding-bottom:130px;
			}
			.tab_content_ele.on{
				display:block;
				}
			.tab_content_ele.off{
				display:none;
				}
			/* tab アイコンリスト */
			.icon_list{
				margin:20px 0 90px;
				text-align:right;
				}
				.icon_list > ul > li:not(:first-child){
					margin-left:20px;
					}
				.icon_list > ul > li{
					display:inline-block;
					background:url(../images/arrow_icon.png) left center no-repeat;
					padding-left:15px;
					background-size:8px;
					font-size:12px;
					transition:opacity 500ms;
					-webkit-transition:opacity 500ms;
					}
				.icon_list ul li:not(.active){
					opacity:0.5;
					}
				.icon_list ul li:hover{
					opacity:1;
					transition:opacity 500ms;
					-webkit-transition:opacity 500ms;
					}
					.icon_list .bedtype{
						position:relative;
						z-index:2;
						}
					.icon_list .bedtype span{
						display:inline-block;
						position:relative;
						padding-right:15px;
						}
						.icon_list .bedtype span img{
							-webkit-transform: rotateX(0deg);
							transform: rotateX(0deg);
							width:6px;
							transition:transform 800ms;
							-webkit-transition:transform 800ms;
							position:absolute;
							top:50%;
							right:0;
							margin-top:-3px;
							}
						.icon_list .bedtype:hover span img{
							-webkit-transform: rotateX(180deg);
							transform: rotateX(180deg);
							transition:transform 800ms;
							-webkit-transition:transform 800ms;
							}
						/*
						.icon_list .bedtype span::after{
							content:"";
							top:50%;
							right:0;
							margin-top:-3px;
							position:absolute;
							width: 4px;
							height: 4px;
							border-top: 1px solid #000;
							border-right: 1px solid #000;
							-webkit-transform: rotate(135deg);
							transform: rotate(135deg);
							transition:transform 500ms;
							-webkit-transition:transform 500ms;
							}
						.icon_list .bedtype:hover span::after{
							-webkit-transform: rotate(-45deg);
							transform: rotate(-45deg);
							transition:transform 500ms;
							-webkit-transition:transform 500ms;
							}
						*/
					.icon_list .bedtype ul{
						height:0;
						display:block!important;
						overflow:hidden;
						position:absolute;
						width:9em;
						right:0;
						top:100%;
						transition:height 500ms;
						-webkit-transition:height 500ms;
						}
					.icon_list .bedtype:hover ul.h5{
						height:8em;
						transition:height 500ms;
						-webkit-transition:height 500ms;
						}
					.icon_list .bedtype:hover ul.h3{
						height:4em;
						transition:height 500ms;
						-webkit-transition:height 500ms;
						}
						
			/* tab 最初の画像 */
			.tab_img1{
				position:relative;
				margin-top: 30px;
				}
			.tab_img1 img{width:100%;}
				.tab_content .honkan .tab_intro{
					position:absolute;
					display:block;
					width:560px;
					padding:25px 45px 24px 85px;
					box-sizing:border-box;
					background:rgba(0,0,0,0.8);
					color:#fff;
					left:-50px;
					top:-50px;
					}
				.tab_content .shinkan .tab_intro{
					position:absolute;
					display:block;
					width:560px;
					padding:25px 85px 24px 45px;
					box-sizing:border-box;
					background:rgba(0,0,0,0.8);
					color:#fff;
					right:-50px;
					top:-50px;
					}
				.tab_content .tab_intro h3{
					font-size:27px;
					width: auto!important;
					margin: 0!important;
					font-weight:normal;
					letter-spacing:0.5em;
					line-height:1.2em;
					}
				.tab_content .tab_intro p{
					margin-top:15px;
					line-height: 1.6em;
					}
			/* tab 2枚目の画像 */
			.tab_img2{
				margin-top:70px;
				}
			.tab_img2 h4.border{
				text-align:center;
				margin-bottom:22px;
				}
				.tab_img2 h4.border span{
					display:inline-block;
					font-size:21px;
					border-left:1px solid #CBC9C1;
					border-right:1px solid #CBC9C1;
					padding:0 20px;
					font-weight:normal;
					}
			.tab_img2 img{width:100%;}
			.tab_img2 p{
				text-align:center;
				margin-top:15px;
				font-size: 16px;
				}
			/* tab 画像リスト */
			.tab_img3{
				margin-top:70px;
				}
			.tab_img3 h4.border{
				text-align:center;
				margin-bottom:22px;
				}
				.tab_img3 h4.border span{
					display:inline-block;
					font-size:21px;
					border-left:1px solid #CBC9C1;
					border-right:1px solid #CBC9C1;
					padding:0 20px;
					font-weight:normal;
					}
				.img_list{
					text-align:center;
					margin-left:-2px;
					margin-top:-25px;
					}
				.img_list figure{
					position:relative;
					display:inline-block;
					margin-top:25px;
					width:calc(100%/3 - 3px);
					margin-left:2px;
					vertical-align:top;
					}
				.img_list.suite figure{
					width:100%;
					}
				.img_list figure img{width:100%;}
				.img_list figure figcaption p.room_name{
					text-align:center;
					margin-top:5px;
					font-size:16px;
					}
				.img_list figure figcaption .pos_div{
					opacity:0;
					position:absolute;
					width:100%;
					height:100%;
					left:0;
					top:0;
					background:rgba(0,0,0,0.8);
					color:#fff;
					text-align:center;
					display:table;
					transition: opacity 800ms;
					-webkit-transition: opacity 800ms;
					will-change: opacity;
					-webkit-will-change: opacity;
					}
				.img_list figure figcaption .pos_div:hover{
					opacity:1;
					transition: opacity 800ms;
					-webkit-transition: opacity  800ms;
					}
				.img_list figure figcaption .table_cell{
					display:table-cell;
					width:100%;
					height:100%;
					vertical-align:middle;
					text-align:center;
					}
				.img_list figure figcaption .dis_inl_b{
					display:inline-block;
					max-width:306px;
					}
				.img_list figure figcaption .dis_inl_b table{
					width:100%;
					border-collapse:separate;
					border-spacing: 7px 0px;
					font-size:13px;
					}
				.img_list figure figcaption .dis_inl_b table th,
				.img_list figure figcaption .dis_inl_b table td{
					padding:8px 0;
					}
					.img_list figure figcaption .dis_inl_b.s_size table th,
					.img_list figure figcaption .dis_inl_b.s_size table td{
						padding:6px 0;
						}
				.img_list figure figcaption .dis_inl_b table th{
					border-top:1px solid rgba(255,255,255,0.5);
					width:85px;
					text-align:left;
					}
				.img_list figure figcaption .dis_inl_b table td{
					border-top:1px solid rgba(255,255,255,0.2);
					text-align:right;
					width:185px;
					}
				.img_list figure figcaption .dis_inl_b table tr:last-child th{
					border-bottom:1px solid rgba(255,255,255,0.5);
					}
				.img_list figure figcaption .dis_inl_b table tr:last-child td{
					border-bottom:1px solid rgba(255,255,255,0.2);
					}
				.img_list figure figcaption .dis_inl_b table td sup{
					font-size:8px;
					}
					.img_list figure figcaption .dis_inl_b .to_detail{
						padding: 0 7px;
						margin-top:20px;
						}
					.img_list figure figcaption .dis_inl_b .to_detail a{
						display:block;
						width:100%;
						font-size:15px;
						text-align:left;
						padding:15px 10px;
						box-sizing:border-box;
						background:url(../images/arrow.png) no-repeat #fff center right 17px; 
						}
				
		/* タブ 中身　end */
		
		
		/* 平面図 */
		#contents .type_wrap {
			max-width:100%;
			margin:auto;
			width:1028px;
			}
		#contents .type {
			position: relative;
			z-index:10;
			margin-top: 80px;
			margin-bottom: 50px;
			padding: 20px 10px;
			border-top: solid 1px #d5d5d3;
			border-bottom: solid 1px #d5d5d3;
		}
		#contents .type li {
			float: left;
			line-height: 1;
			padding-left: 68px;
			margin-left: 20px;
		}
		#contents .type li:first-child {
			margin-left:0px;
			}
		#contents .type li.standard {
			background: url(../images/color_standard.gif) no-repeat left top;
		}
		#contents .type li.superior {
			background: url(../images/color_superior.gif) no-repeat left top;
		}
		#contents .type li.deluxe {
			background: url(../images/color_deluxe.gif) no-repeat left top;
		}
		#contents .type li.suite {
			margin-right: 0px;
			background: url(../images/color_suite.gif) no-repeat left top;
		}

		.map_link{
			text-align:center;
			margin-top:70px;
			}
			.map_link img{
				max-width:100%;
				}
	
}

/* sp =============================================================================================*/
@media only screen and (max-width: 800px) and (orientation: portrait) {

	
#contents {
	margin-bottom: 200px;
	}
	
	/*
	#title{
		height:400px;
		background-image:url(../images/title_bg.jpg);
		background-position:center;
		background-size:cover;
		position:relative;
		position:relative;
		}
		#title h2{
			text-align:center;
			position:absolute;
			bottom:-50px;
			width:100%;
			}
			#title h2 > span{
				max-width:80%;
				width:200px;
				box-sizing:border-box;
				display:inline-block;
				background:rgba(0,0,0,0.8);
				box-sizing:border-box;
				padding:25px 20px 60px;
				}
			#title h2 > span img{
				width:118px;
				max-width:100%;
				}
	*/
	
	
	#title{
		height:400px;
		background-image:url(../images/title_bg.jpg);
		background-position:center;
		background-size:cover;
		position:relative;
		}
		#title_wrap{
			position:relative;
			}
		#title_wrap h2{
			display:block;
			margin-left:auto;
			margin-right:auto;
			text-align:center;
			position:absolute;
			bottom:-50px;
			width:100%;
			z-index:1;
			}
			#title_wrap h2 > span{
				max-width:80%;
				padding:15px 5% 20px;
				background:rgba(0,0,0,0.8);
				box-sizing:border-box;
				display:inline-block;
				font-size: 16px;
				line-height: 2em;
				letter-spacing: 0.1em;
				color:#fff;
				}
				#title_wrap h2 > span span{
					display:block;
					font-size: 12px;
					margin-bottom: 10px;
					}
		
	.intro{
		line-height: 1.8em;
		margin: 90px auto 100px;
		font-size: 14px;
		padding-left:30px;
		padding-right:30px;
		}
		
	.tab_wrap{
		}
		/* タブ */
		.tab_wrap ul.tab{
			margin-right:auto;
			margin-left:auto;
			padding-left:10px;
			padding-right:10px;
			}
		.tab_wrap ul.tab li{
			width:50%;
			box-sizing:border-box;
			text-align:center;
			font-size:13px;
			letter-spacing: 0.5em;
			}
		.tab_wrap ul.tab li:nth-of-type(1){
			float:left;
			}
		.tab_wrap ul.tab li:nth-of-type(2){
			float:right;
			}
			
		.tab_wrap ul.tab li.on{
			background-color:#F6F4E9;
			padding:15px;
			}
		.tab_wrap ul.tab li:not(.on){
			padding:10px;
			}
			.tab_wrap ul.tab li:not(.on) span{
				background-color:#000;
				color:#fff;
				padding:5px 10px;
				display:block;
				transition:background-color  1000ms;
				-webkit-transition:background-color  1000ms;
				}
			.tab_wrap ul.tab li:not(.on) span:hover{
				background-color:#F6F4E9;
				color:#494949;
				transition:background-color  1000ms;
				-webkit-transition:background-color  1000ms;
				}
				
		/* タブ 中身 */
		.shinkan{
			/*display:none;*/
			}
		.tab_content{
			background-color:#F6F4E9;
			padding:30px 10px 100px;
			}
			.tab_content_ele.on{
				display:block;
				}
			.tab_content_ele.off{
				display:none;
				}
			/* tab アイコンリスト */
			.icon_list{
				margin:20px 0 30px;
				text-align:right;
				}
				.icon_list > ul > li:not(:first-child){
					margin-left:12px;
					}
				.icon_list > ul > li{
					display:inline-block;
					}
				.icon_list > ul > li span{
					display:inline-block;
					background:url(../images/arrow_icon.png) left center no-repeat;
					font-size: 12px;
					padding-left:15px;
					background-size:9px;
					transition:opacity 500ms;
					-webkit-transition:opacity 500ms;
					}
				.icon_list li:not(.active) span{
					opacity:0.5;
					}
				.icon_list li li:not(.active){
					opacity:0.5;
					}
				.icon_list ul li:hover,
				.icon_list ul li:hover span{
					opacity:1;
					transition:opacity 500ms;
					-webkit-transition:opacity 500ms;
					}
					.icon_list .bedtype{
						position:relative;
						z-index:2;
						}
					.icon_list .bedtype span{
						display:inline-block;
						position:relative;
						padding-right:15px;
						}
						.icon_list .bedtype span img{
							-webkit-transform: rotateX(0deg);
							transform: rotateX(0deg);
							width:6px;
							transition:transform 800ms;
							-webkit-transition:transform 800ms;
							position:absolute;
							top:50%;
							right:0;
							margin-top:-1px;
							}
						.icon_list .bedtype span.open img{
							-webkit-transform: rotateX(180deg);
							transform: rotateX(180deg);
							transition:transform 800ms;
							-webkit-transition:transform 800ms;
							}
						/*
						.icon_list .bedtype span::after{
							content:"";
							top:50%;
							right:0;
							margin-top:-3px;
							position:absolute;
							width: 4px;
							height: 4px;
							border-top: 1px solid #000;
							border-right: 1px solid #000;
							-webkit-transform: rotate(135deg);
							transform: rotate(135deg);
							transition:transform 500ms;
							-webkit-transition:transform 500ms;
							}
						.icon_list .bedtype span.open::after{
							-webkit-transform: rotate(-45deg);
							transform: rotate(-45deg);
							transition:transform 500ms;
							-webkit-transition:transform 500ms;
							}
						*/
					.icon_list .bedtype ul{
						background-color:#F6F4E9;
						display:none;
						position:absolute;
						width:9em;
						right:0;
						top:2em;
						border: 1px solid #ccc;
						padding:10px;
						}
					
			/* tab 最初の画像 */
			.tab_img1{position:relative;}
			.tab_img1 img{width:100%;}
				.tab_content .tab_intro{
					width:100%;
					padding: 30px;
					box-sizing:border-box;
					background:rgba(0,0,0,0.8);
					color:#fff;
					}
				.tab_content .tab_intro h3{
					font-size:18px;
					font-weight: normal;
					letter-spacing: 0.5em;
					}
				.tab_content .tab_intro p{
					margin-top:15px;
					font-size:13px;
					line-height:1.8em;
					}
			/* tab 2枚目の画像 */
			.tab_img2{
				margin-top:60px;
				}
			.tab_img2 h4.border{
				text-align:center;
				margin-bottom:22px;
				}
				.tab_img2 h4.border span{
					display:inline-block;
					font-size:18px;
					border-left:1px solid #CBC9C1;
					border-right:1px solid #CBC9C1;
					padding:0 20px;
					font-weight:normal;
					}
			.tab_img2 img{width:100%;}
			.tab_img2 p{
				text-align:center;
				margin-top:15px;
				}
			/* tab 画像リスト */
			.tab_img3{
				margin-top:60px;
				}
			.tab_img3 h4.border{
				text-align:center;
				margin-bottom:22px;
				}
				.tab_img3 h4.border span{
					display:inline-block;
					font-size:18px;
					border-left:1px solid #CBC9C1;
					border-right:1px solid #CBC9C1;
					padding:0 20px;
					font-weight:normal;
					}
				.img_list{
					margin-top:-40px;
					}
				.img_list figure{
					display:block;
					margin-top:60px;
					vertical-align:top;
					}
				.img_list figure img{width:100%;}
				.img_list figure figcaption p.room_name{
					text-align:center;
					margin-top:15px;
					}
				.img_list figure figcaption .pos_div{
					margin-top:10px;
					text-align:center;
					display:table;
					width:100%;
					}
				.img_list figure figcaption .table_cell{
					display:table-cell;
					width:100%;
					vertical-align:middle;
					text-align:center;
					}
				.img_list figure figcaption .dis_inl_b{
					}
				.img_list figure figcaption .dis_inl_b table{
					border-collapse:separate;
					border-spacing: 7px 0px;
					font-size:13px;
					width:100%;
					}
				.img_list figure figcaption .dis_inl_b table th,
				.img_list figure figcaption .dis_inl_b table td{
					padding:8px 0;
					}
				.img_list figure figcaption .dis_inl_b table th{
					border-top:1px solid rgba(0,0,0,0.2);
					width:85px;
					text-align:left;
					font-weight: normal;
					}
				.img_list figure figcaption .dis_inl_b table td{
					border-top:1px solid rgba(0,0,0,0.1);
					text-align:right;
					}
				.img_list figure figcaption .dis_inl_b table tr:last-child th{
					border-bottom:1px solid rgba(0,0,0,0.2);
					}
				.img_list figure figcaption .dis_inl_b table tr:last-child td{
					border-bottom:1px solid rgba(0,0,0,0.1);
					}
				.img_list figure figcaption .dis_inl_b table td sup{
					font-size:8px;
					}
					.img_list figure figcaption .dis_inl_b .to_detail{
						padding: 0 7px;
						margin-top:20px;
						}
					.img_list figure figcaption .dis_inl_b .to_detail a{
						display:block;
						width:100%;
						text-align:left;
						/*
						font-size:15px;
						padding:15px 10px;
						*/
						box-sizing:border-box;
						color:#fff;
						background:url(../images/arrow_w.png) no-repeat #000 center right 17px;
						padding: 15px 40px 15px 10px;
						font-size:13px;
						}
		
		/* 平面図 */
		#contents .type {
			position: relative;
			z-index:10;
			margin-top: 40px;
			margin-bottom: 30px;
			padding: 15px 10px 20px;
			border-top: solid 1px #d5d5d3;
			border-bottom: solid 1px #d5d5d3;
			}
			#contents .type li {
				float: left;
				line-height: 1;
				padding-left: 68px;
				margin-right: 20px;
				margin-top:5px;
			}
			#contents .type li.suite {
				background: url(../images/color_suite.gif) no-repeat left top;
			}
			#contents .type li.deluxe {
				background: url(../images/color_deluxe.gif) no-repeat left top;
			}
			#contents .type li.superior {
				background: url(../images/color_superior.gif) no-repeat left top;
			}
			#contents .type li.standard {
				background: url(../images/color_standard.gif) no-repeat left top;
			}
			.map_link img{
			width:100%;
			}

}