@charset "UTF-8";
/* ===================================================================
CSS information

file name  : room.css
author     : Ability Consultant
style info : 客室
=================================================================== */
/* font-awesome */
/* -----------------------------------------------------------
	スライド　用
----------------------------------------------------------- */
/*Animate */
/* -----------------------------------------------------------
	ホテル リブランド用
----------------------------------------------------------- */
/* -----------------------------------------------------------
.copy
----------------------------------------------------------- */
.box_rooms:nth-child(n+3)::after {
  background: none;
}

/* -----------------------------------------------------------
.con_reccomend
----------------------------------------------------------- */
/*.con_recommend {
	width: 1200px;
	height: 267px;
	margin: 0 auto 6%;
	@include mq(tab) {
		width: 97%;
	}
	@include mq(sp) {
		width: 95%;
		height: auto;
	}
	.title {
		text-align: center;
		font-size: 30px;
		color: #006bb6;
		margin-bottom: 25px;
		@include mq(sp) {
			font-size: 1.5em;;
			margin-bottom: 2%;
		}
	}
	.box_flex {
		display: flex;
		@include mq(sp) {
			display: block;
		}
		.wrp_content {
			position: relative;
			width: 400px;
			height: 267px;
			overflow: hidden;
			@include mq(tab) {
				width: 33.3%;
				height: auto;
			}
			@include mq(sp) {
				width: 100%;
				height: auto;
				margin-bottom: 2.5%;
			}
			.box_img {
				width: 100%;
				height: 100%;
			}
			.box_text {
				transition-duration:1s;
				position: absolute;
				bottom: -88%;
				left: 0;
				width: 100%;
				height: 100%;
				background-color: rgba(0,107,182,0.8);
				transition: 0.5s;
				color: #fff;
				text-align: center;
				padding: 2px 30px;
				@include mq(tab) {
						bottom: -83%;
						padding: 1% 5%;
					}
				@include mq(sp) {
						bottom: -84%;
						padding: 1% 5%;
					}
				.headline {
					font-size: 20px;
					margin-bottom: 10px;
					@include mq(tab) {
						font-size: 1.2em;
						margin-bottom: 5px;
					}
					@include mq(sp) {
						font-size: 1.5em;
						margin-bottom: 5px;
					}
				}
				&:before {
					@include mq(pc) {
						content: "\f106";
						font-family: FontAwesome;
						font-size: 20px;
						position: absolute;
						top: 0;
						left: 15px;
						transition-duration:0.5s;
					}
					@include mq(tab) {
						content: "\f106";
						font-family: FontAwesome;
						font-size: 1.2em;
						position: absolute;
						top: 1.5%;
						left: 5%;
						transition-duration:0.5s;
					}
					@include mq(sp) {
						content: "\f106";
						font-family: FontAwesome;
						font-size: 1.5em;
						position: absolute;
						top: 1%;
						left: 5%;
						transition-duration:0.5s;
					}
				}
				&:hover {
					@include mq(pc) {
						bottom: 0;
						padding: 40px 30px;
					}
					&:before {
						@include mq(pc) {
							transform: rotate(180deg);
						}
					}
				}
			}
			.box_text.after {
				@include mq(tab) {
					bottom: 0;
					padding: 10% 5%;
				}
				@include mq(sp) {
					bottom: 0;
					padding: 10% 5%;
				}
				&:before {
					@include mq(tab) {
						transform: rotate(180deg);
					}
					@include mq(sp) {
						transform: rotate(180deg);
					}
				}
			}
		}
	}
}*/