@charset "utf-8";

/*------------------------------------------------------------------------------
Css name: content.css
Css info: 各ページスタイル
------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------
index
--------------------------------------------------------------------------*/
.index .mobi_g_nav .gNav_v00 a{
    background: #eb5e69;
	color: #fff;
	padding: 4px 1em;
}
/*--------------------------------*/
.index .main_img{
	max-width: 1800px;
	margin: 0 auto 60px;
	background: url(../img/index/main01.jpg) center top no-repeat fixed;
	background-size: 100% auto;
	padding-top: 62.5%;
	position: relative;
}
.ios.index .main_img{
	background: url(../img/index/main01.jpg) center top no-repeat scroll;
	background-size: 100% auto;
}
.index .header{
	position: absolute;
	top: 0;
}
.index .content_tit{
	text-align: center;
	font-family: Georgia, "Yu Mincho", YuMincho,"Hiragino Mincho ProN" ,HGS明朝E ,serif;
	font-weight: bold;
	font-size: 1.625em;/*26pt*/
	letter-spacing: 0.1em;
}
.index .content_tit span{
	display: inline-block;
}
	.index .content_tit span::after{
		display: block;
		content: "";
		height: 6px;
		margin: 20px auto 30px;
		background: #FFE114;
		border-radius: 2px;
	}
@media only screen and (max-width: 600px) {
	.index .main_img{
		background: url(../img/index/main01.jpg) center top no-repeat scroll;
		background-size: 100% auto;
		max-width: 100%;
		margin: 0 auto 40px;
	}
	.index .header{
		position: absolute;
		top: 0;
	}
	.index .content_tit{
		font-size: 1.5em;/*24pt*/
	}
}
/* ローズヒルはなぜ選ばれるのか？ -----------------------------*/
.index .index_about{
	text-align: center;
	margin-bottom: 80px;
}
@media only screen and (max-width: 600px) {
	.index .index_about{
		text-align: left;
		margin: 0 auto 40px;
		width: 90%;
	}
}
/* サービス -----------------------------*/
.index_point_box{
	width: 980px;
	margin: 0 auto 60px;
}
	.index_point_img{
		display: block;
		border-radius: 2px;
	}
	.index_point_box:nth-child(even) .index_point_img{
		float: left;
		box-shadow: 100px 20px #f2f2f2;
	}
	.index_point_box:nth-child(odd) .index_point_img{
		float: right;
		box-shadow: -100px 20px #f2f2f2;
	}
	.index_point_txt{
		 width: 620px;
	 }
	.index_point_box:nth-child(even) .index_point_txt{ float: right; }
	.index_point_box:nth-child(odd) .index_point_txt{ float: left; }
		.index_point_txt h3{
			font-size:1.125em;/*18pt*/
			color: #0A963B;
			margin: 30px 0 40px;
		}

		.index_point_box .btn_service{
			display: block;
			margin-top: 16px;
			width: 240px;
			height: 44px;
			line-height: 40px;
			font-size: 0.875em;/*14px*/
			color: #eb5e69;
			padding-left: 16px;
			border: 2px solid #eb5e69;
			border-radius: 22px;
			background: #fff url(../img/common/arrow.png) 95% center no-repeat;
			background-size: 10px 18px;
			transition: .2s;
		}
			.index_point_box .btn_service:hover{
				background: #fef7f7 url(../img/common/arrow.png) 97% center no-repeat;
				background-size: 10px 18px;
			}

@media only screen and (max-width: 980px) {
	.index_point_box{
		width: 90%;
		margin: 0 auto 60px;
	}
		.index_point_img{
			width: 30%;
			height: auto;
		}
		.index_point_txt{
			 width: 65%;
		 }
}
@media only screen and (max-width: 600px) {
	.index_point_box{
		width: 90%;
		margin: 0 auto 40px;
	}
		.index_point_img{
			width: 100%;
			max-width: 300px;
			height: auto;
			margin: 0 auto 30px;
		}
		.index_point_box:nth-child(even) .index_point_img{
			float: none;
			box-shadow: 30px 10px #f2f2f2;
		}
		.index_point_box:nth-child(odd) .index_point_img{
			float: none;
			box-shadow: -30px 10px #f2f2f2;
		}
		.index_point_txt{
			 width: 100%;
		 }
		.index_point_box:nth-child(even) .index_point_txt,
		.index_point_box:nth-child(odd) .index_point_txt{ float: none; }
			.index_point_txt h3{
				font-size:1.125em;/*18pt*/
				line-height: 1.4;
				color: #f2959c;
				margin: 0 0 10px;
			}

			.index_point_box .btn_service{
				margin: 16px auto 0;
				width: 70%;
			}
}
/* ナビゲーション -----------------------------*/
.index_nav_list{
	width: 100%;
	max-width: 1800px;
	margin:  auto;
}
	.index_nav_list li{
		height: 440px;
	}
		.index_nav_list .service{
			background: url(../img/index/bg_service.jpg) center center no-repeat;
			background-size: cover;
		}
		.index_nav_list .facility{
			background: url(../img/index/bg_facility.jpg) center center no-repeat;
			background-size: cover;
		}
		.index_nav_list .flow{
			background: url(../img/index/bg_flow.jpg) center center no-repeat;
			background-size: cover;
		}
		.index_nav_list .wrapper{
			width: 980px;
			margin: 0 auto;
		}
			.index_nav_list .wrapper h3{
				display: inline-block;
				font-family: Georgia, "Yu Mincho", YuMincho,"Hiragino Mincho ProN" ,HGS明朝E ,serif;
				font-size: 1.375em;/*22pt*/
				color: #464646;
				background: #FFE114;
				padding: 0 20px;
				line-height: 50px;
				margin: 60px 0 10px;
			}
			.index_nav_list .wrapper p{
				width: 580px;
				margin-bottom: 50px;
				font-size: 0.938em;/*15px*/
				color: #464646;
				line-height: 1.8;
				background: rgba(255,255,255,0.8);
				padding: 5px 22px;
			}
			.index_nav_list .wrapper .btn_index_nav{
				display: block;
				width: 200px;
				height: 44px;
				line-height: 40px;
				font-size: 0.875em;/*14px*/
				color: #0A963B;
				text-align: center;
				border: 2px solid #0A963B;
				border-radius: 22px;
				background: #fff url(../img/common/arrow.png) 95% center no-repeat;
				background-size: 10px 18px;
				transition: .2s;
			}
				.index_nav_list .wrapper .btn_index_nav:hover{
					background: #fef7f7 url(../img/common/arrow.png) 97% center no-repeat;
					background-size: 10px 18px;
				}
		.index_nav_list li:nth-child(even) .wrap_box{
			float: right;
			text-align: right;
		}
			.index_nav_list li:nth-child(even) h3{
				text-align: right;
			}
			.index_nav_list li:nth-child(even) p{
				text-align: left;
			}
			.index_nav_list  li:nth-child(even) .btn_index_nav{
				float: right;
			}

.index_nav_list .effort{
	background: url(../img/index/bg_effort.jpg) center center no-repeat;
			background-size: cover;
}
	.index_nav_list li.effort .wrap_box{
			float: right;
			text-align: right;
		}
		.index_nav_list li.effort h3{
			text-align: right;
		}
		.index_nav_list li.effort p{
			text-align: left;
		}
		.index_nav_list  li.effort  .btn_index_nav{
			float: right;
		}
		.index_nav_list  li.effort  .btn_index_nav img{
			vertical-align: middle;
		}
@media only screen and (max-width: 980px) {
			.index_nav_list .wrapper{
				width: 90%;
				margin: 0 auto;
			}
				.index_nav_list .wrapper p{
    				max-width: 100%;
					margin-bottom: 50px;
					font-size: 0.938em;/*15px*/
					line-height: 1.8;
					padding: 5px 22px;
				}
}
@media only screen and (max-width: 600px) {
	.index_nav_list .wrapper p{
		width: 100%;
		max-width: 100%;
		margin-bottom: 50px;
	}
	.index_nav_list .wrapper .btn_index_nav{
		margin: 0 auto;
	}
	.index_nav_list  li:nth-child(even) .btn_index_nav,
	.index_nav_list  li.effort  .btn_index_nav{
    	float: none;
	}
}

/* アクセス・お問い合わせ -----------------------------*/
.index_contact{
	width: 100%;
	margin: 0 auto 60px;
	border-bottom: 1px solid #ccc;
	font-family: Georgia, "Yu Mincho", YuMincho,"Hiragino Mincho ProN" ,HGS明朝E ,serif;
	font-weight: bold;
	font-size: 1.375em;/*22pt*/
	text-align: center;
}
	.index_contact li{
		width: 50%;
		float: left;
	}
		.index_contact li a{
			padding: 70px 0;
			display: block;
			width: 100%;
			height: 100%;
			transition: .2s;
		}
	.index_contact .access{
		border-right: 1px solid #ccc;
	}
		.index_contact .access h3::before{
			display: block;
			content: "";
			width: 33px;
			height: 40px;
			background: url(../img/common/ico_access.png);
			background-size: 100%;
			margin: 0 auto 30px;
			transition: .2s;
		}
	.index_contact .contact{
	}
		.index_contact .contact h3::before{
			display: block;
			content: "";
			width: 40px;
			height: 39px;
			background: url(../img/common/ico_contact.png);
			background-size: 100%;
			margin: 0 auto 31px;
			transition: .2s;
		}

		.index_contact a:hover{
			padding: 65px 0 70px;
		}
		.index_contact .access:hover h3::before{
			margin: 0 auto 35px;
		}
		.index_contact .contact:hover h3::before{
			margin: 0 auto 36px;
		}
		.index_contact .access h3::after,
		.index_contact .contact h3::after{
			display: block;
			content: "";
			width: 10px;
			height: 9px;
			background: url(../img/common/nw_bk.png) right center no-repeat;
			margin: 10px auto 0;
		}


@media only screen and (max-width: 600px) {
	.index_contact{
		width: 100%;
		margin: 0 auto 40px;
		font-size: 1.25em;/*20pt*/
	}
		.index_contact li{
			width: 50%;
			float: left;
		}
			.index_contact li a{
				padding: 45px 0;
			}
		.index_contact .access{
		}
			.index_contact .access h3::before{
				display: block;
				content: "";
				width: 25px;
				height: 30px;
				background: url(../img/common/ico_access.png);
				background-size: 100%;
				margin: 0 auto 20px;
				transition: .2s;
			}
		.index_contact .contact{
		}
			.index_contact .contact h3::before{
				display: block;
				content: "";
				width: 30px;
				height: 29px;
				background: url(../img/common/ico_contact.png);
				background-size: 100%;
				margin: 0 auto 21px;
				transition: .2s;
			}

			.index_contact a:hover{
				padding: 45px 0;
			}
			.index_contact .access:hover h3::before{
				margin: 0 auto 20px;
			}
			.index_contact .contact:hover h3::before{
				margin: 0 auto 21px;
			}
}
/* お知らせ -----------------------------*/
.index_info{
	width: 980px;
	margin: 0 auto 100px;
}
	.index_info li{
		line-height: 1.8;
		margin-bottom: 10px;

	}
		.index_info .date{
			display: inline-block;
			font-weight: bold;
			color: #0a963b;
			width: 15.3%;
			vertical-align: top;
		}
		.index_info .title{
			display: inline-block;
			width: 84.7%;
		}
			.index_info .title a{
				padding-bottom: 2px;
				border-bottom: 1px dotted #333;
			}
			.index_info .title a:hover{
				border-bottom: 1px dotted #fff;
			}
			.index .btn_info_list{
				display: block;
				width: 200px;
				height: 44px;
				margin: -70px auto 100px;
				line-height: 40px;
				font-size: 0.875em;/*14px*/
				color: #0A963B;
				text-align: center;
				border: 2px solid #0A963B;
				border-radius: 22px;
				background: #fff url(../img/common/arrow.png) 95% center no-repeat;
				background-size: 10px 18px;
				transition: .2s;
			}
				.index .btn_info_list:hover{
					background: #e6f4eb url(../img/common/arrow.png) 97% center no-repeat;
					background-size: 10px 18px;
				}
@media only screen and (max-width: 980px) {
	.index_info{
		width: 90%;
	}
		.index_info .date{
			width: 25%;
		}
		.index_info .title{
			width: 75%;
		}
}

@media only screen and (max-width: 600px) {
	.index_info{
		width: 90%;
		margin: 0 auto 60px;
	}
		.index_info li{
			line-height: 1.6;
			margin-bottom: 16px;

		}
			.index_info .date{
				display: block;
				font-weight: bold;
				color: #f2959c;
				width: 100%;
				vertical-align: top;
			}
			.index_info .title{
				display: block;
				width: 100%;
			}
				.index_info .title a{
					padding-bottom: 2px;
					border-bottom: 1px dotted #333;
				}
				.index_info .title a:hover{
					border-bottom: 1px dotted #fff;
				}
			.index .btn_info_list{
				margin: -30px auto 60px;
			}
}

/*------------------------------------------------------------------------
ローズヒルのサービス
--------------------------------------------------------------------------*/
.service .gNav_v01 a:after{
	width: 100%;
	height: 4px;
	background-color: #FFE114;

}
.service .title_img{
	background: url(../img/service/h1_service.jpg) center center no-repeat;
	background-size: cover;
}

.service .mobi_g_nav .gNav_v01 a{
    background: #eb5e69;
	color: #fff;
	padding: 4px 1em;
}
/*--------------------------------*/
.service_txt,
.service_event_list{
	width: 660px;
	float: right;
}
.service_txt_l{
    width: 100%;
}
.service_img{
	float: left;
	display: block;
	border-radius: 2px;
	box-shadow: 70px 20px #fffce7;
}
.service .inst_nav{
	float: right;
	display: block;
	width: 550px;
	line-height: 36px;
	text-align: center;
	padding: 10px 16px;
	border: 1px solid #eb5e69;
	border-radius: 2px;
	margin-top: 20px;
	transition: .2s;
}
	.service .inst_nav:hover{
		background: #fdeff0;
	}

/* 1週間 */
.service_schedule{
	width: 100%;
}
	.service_schedule th,
	.service_schedule td{
		padding: 0 8px;
		vertical-align: middle;
		font-size: 1.5rem;
		text-align: center;
		line-height: 1.4;
		border: 2px solid #fff;
	}
	.service_schedule th{
		background: #ffe114;
	}
	.service_schedule .day th{
		width: calc(( 100vw - 100px ) / 7);
		border-radius: 16px 16px 0 0;
	}
	.service_schedule th.time_top{
		padding: 8px;
		width: 100px;
	}
	.service_schedule th.time::before {
		display: inline-block;
		height: 56px;
		content: "";
		vertical-align: middle;
	}
	.service_schedule td{
		background: #f1f1ec;
	}
	.service_schedule td.bg_y{
		background: #fff089;
	}


.service_event_list{
	margin-top: 16px;
}
	.service_event_list th,
	.service_event_list td{
		border-top: 1px solid #a2a2a2;
		border-bottom: 1px solid #a2a2a2;
		padding: 8px 1em;
		line-height: 1.6;
	}
	.service_event_list th{
		width: 80px;
		color: #0A963B;
		text-align: center;
		font-weight: bold;
		vertical-align: top;
	}
.service_club_txt{
	width: 100%;
	margin-bottom: 16px;
}
.service_club_img li{
	float: left;
	margin-right: 45px;
}
	.service_club_img img{
		display: block;
		border-radius: 2px;
		box-shadow: 30px 10px #fffce7;
	}
	.service_club_img li:last-child{
		margin-right: 0;
	}


@media only screen and (max-width: 900px) {
	.service_txt,
	.service_event_list{
		width: 70%;
	}
	.service_txt_l{
        width: 100%;
    }
	.service_img{
		width: 25%;
		height: auto;
		box-shadow: 50px 10px #fffce7;
	}
	.service .inst_nav{
		max-width: 100%;
	}
		.service .inst_nav span{
			display: none;
		}

	.service_club_img li{
		width: 28.8888%;
		margin-right: 5%;
	}
		.service_club_img img{
			width: 100%;
			height: auto;
			box-shadow: 15px 10px #fffce7;
		}
		.service_club_img li:last-child{
			margin-right: 0;
		}
}

@media only screen and (max-width: 600px) {
	.service_txt,
	.service_event_list{
		width: 100%;
		float: none;
	}
	.service_img{
		float: none;
		width: 60%;
		box-shadow: 20px 10px #fffce7;
		margin: 0 auto 20px;
	}
	/* 1週間 */
	.service_schedule{
		width: 660px;
	}
		.service_schedule th,
		.service_schedule td{
			padding: 0 6px;
		}
		.service_schedule .day th{
			width: calc(100% / 8);
		}
		.service_schedule th.time_top{
			width: auto;
		}

	.service_club_img li{
		float: none;
		width: 80%;
		max-width: 300px;
		margin: 0 auto 15px;
	}
		.service_club_img img{
			width: 100%;
			height: auto;
			box-shadow: 20px 6px #fffce7;
		}
		.service_club_img li:last-child{
			margin-right: auto;
		}
}

/*------------------------------------------------------------------------
施設案内・料金
--------------------------------------------------------------------------*/
.facility .gNav_v02 a:after{
	width: 100%;
	height: 4px;
	background-color: #FFE114;

}
.facility .title_img{
	background: url(../img/facility/h1_facility.jpg) center center no-repeat;
	background-size: cover;
}

.facility .mobi_g_nav .gNav_v02 a{
    background: #eb5e69;
	color: #fff;
	padding: 4px 1em;
}
/*--------------------------------*/
.facility .h3_box{
    margin-bottom: 20px;
}
    .facility_img{
    	display: block;
    	float: left;
    	width: 20%;
    	height: auto;
    	border-radius: 2px;
    	box-shadow: 20px 10px #fdeff0;
    }
    .facility .txt_box{
        float: right;
        width: 74.444%;
        margin-top: 10px;
    }
        .facility .txt_box h3{
            font-size: 1em;
        }

.facility_img_l{
    display: block;
    width: 100%;
    height: auto;
}
.facility_charge_date{
	margin: -30px 0 30px;
	color: #0a963b;
	font-size: 1.4rem;
}
@media only screen and (max-width: 600px) {
    .facility .h3_box{
        margin-bottom: 40px;
    }
        .facility_img{
        	float: none;
        	width: 80%;
        	margin: 0 auto 20px;
        }
        .facility .txt_box{
            float: none;
            width: 100%;
        }
            .facility .txt_box h3{
                text-align: center;
            }
	.facility_charge_date{
		margin: -20px 0 30px;
	}
}

/* 料金--------------------------------*/
.facility .h2_box a{
	border-bottom: 1px dotted;
}
.table_box{
	position: relative;
	margin-bottom: 20px;
}

.facility_service_tit{
    color: #f2959c;
    margin-bottom: 1em;
}
.facility_price{
	width: 900px;
}
	.facility_price th,
	.facility_price td{
		border: 1px solid #a2a2a2;
		padding: 1em;
		vertical-align: middle;
		text-align: center;
	}
	.facility_price01 th{
    	width: 50%;
	}
	.facility_price02 td{
    	text-align: right;
    	width: 27%;
	}

	.facility_price02 td.num{
    	width: 1%;
    	text-align: center;
	}
	.facility_price02 .t_center{
    	text-align: center;
	}
@media only screen and (max-width: 900px) {
	.facility_price{
		min-width: 100%;
		width: auto;
	}
	.facility_price th,
	.facility_price td{
		width: auto;
	}
}
@media only screen and (max-width: 600px) {
	.table_box{
		overflow-x: scroll;
	}
	.table_box::before{
		display: block;
		content: "この表は横にスクロールします";
		margin-bottom: 6px;
		padding-left: 48px;
		text-align: left;
		font-size: 1.4rem;
		line-height: 18px;
		background: url(../img/common/ico_scroll_x.svg) 0 center no-repeat;
		background-size: auto 18px;
	}
	.facility_price{
		width: 500px;
	}

}

/* 運営規程・重要事項説明書 -------------------------------*/
.facility .data_list li{
	list-style: disc outside;
	margin-left: 1em;
	line-height: 1.6;
	margin-bottom: 7px;
}
.facility .data_list li a{
	background: url(../img/common/nw_bk.png) right center no-repeat;
	padding-right: 14px;
}
@media only screen and (max-width: 600px) {
	.facility .data_list li{
		line-height: 1.6em;
		margin-bottom: 8px;
	}
}


/*------------------------------------------------------------------------
入所について
--------------------------------------------------------------------------*/
.flow .gNav_v03 a:after{
	width: 100%;
	height: 4px;
	background-color: #FFE114;

}
.flow .title_img{
	background: url(../img/flow/h1_flow.jpg) center center no-repeat;
	background-size: cover;
}

.flow .mobi_g_nav .gNav_v03 a{
    background: #eb5e69;
	color: #fff;
	padding: 4px 1em;
}
/*--------------------------------*/

.flow .property_list{
	margin-bottom: 1em;
}
.flow .property_list li{
	list-style: disc outside;
	margin-left: 1em;
	line-height: 2em;
}
.flow .notice{
	margin-top: 1em;
	color: #ef7c85;
}

.flow .bath_txt{
	float: left;
	width: 62.778%;
	margin-right: 5%;
}
.bath_img{
	display: block;
	float: left;
	width: 28.889%;
	height: auto;
	border-radius: 2px;
	box-shadow: 30px 10px #fdeff0;
}
.flow_box{
	width: 100%;
	height: 500px;
	background: #b3b3b3;
}
@media only screen and (max-width: 600px) {
	.flow .property_list li{
		line-height: 1.6em;
		margin-bottom: 6px;
	}

	.flow .bath_txt{
		float: none;
		width: 100%;
		margin: 0 0 1em 0;
	}
	.bath_img{
		display: block;
		float: none;
		width: 80%;
		box-shadow: 20px 10px #fdeff0;
		margin: 0 auto;
	}
	.flow_box{
		width: 100%;
		height: 500px;
		background: #b3b3b3;
	}
}