@media screen and (max-width: 1024px) { 
	.inner {
		padding: 6rem 4rem;
	}
	.pcbr {
		display: none;
	}
	.spbr {
		display: block;
	}
	/*----------------------------------------------------------
	* ハンバーガーメニュー
	------------------------------------------------------------*/
	.menubutton, #navsp {
		display: block;
	}
	#navpc {
		display: none;
	}
	header {
		margin-bottom: 0;
	}
	header .inner {
		padding: 0;
	}
	header h1 {
		width: 20%;
	}
	.menuButton {
		display: block;
		height: 50px;
		width: 50px;
		position: fixed;
		top: 5px;
		right: 0;
		z-index: 3;
	}
	.menuButton div {
		height: 1px;
		width: 60%;
		background: #4a4a4a;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		transition: .3s;
	}
	.menuButton div:nth-of-type(1) {
		transform: translate(-50%,-10px);
	}
	.menuButton div:nth-of-type(3) {
		transform: translate(-50%,10px);
	}
	.menuButton.active div:nth-of-type(1) {
		transform: rotate(45deg) translate(-50%,0);
		transform-origin: 0% 50%;
	}
	.menuButton.active div:nth-of-type(2) {
		opacity: 0;
	}
	.menuButton.active div:nth-of-type(3) {
		transform: rotate(-45deg) translate(-50%,0);
		transform-origin: 0% 50%;
	}
	#navsp {
		display: block;
		transform: translateX(100%);
		transition: .3s;
		position: fixed;
		top: 0;
		right: 0;
		z-index: 2;
		background: #97c497;
		font-size: 20px;
		padding: 80px 0 0;
		width: 60vw;
		height: 100vh;
		max-height: 100vh;
		overflow: auto;
	}
	#navsp ul {
		padding: 6rem 0;
		margin: 0;
	}
	#navsp li {
		text-align: center;
		border-bottom: 1px dotted #FFFFFF;
		width: 80%;
		margin: 0 auto;
		line-height: 1;
		padding: 20px 0;
	}
	#navsp ul li a {
		color: #fff;
	}
	#navsp ul li:not(:first-of-type) {
		margin-top: 0;
	}
	#navsp.active {
		transform: translateX(0%);
	}
	.mask {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 2;
		width: 100%;
		height: 100%;
		background-color: #000;
		opacity: 0;
		visibility: hidden;
		transition: .3s;
	}
	.mask.active {
		opacity: 0.7;
		visibility: visible;
	}
	/* ------------------------------------------------------------------------
	* header2
	-------------------------------------------------------------------------- */
	#header2 {
		background: #fafafa;
		padding: 0;
	}
	/* ------------------------------------------------------------------------
	* mainvisual
	-------------------------------------------------------------------------- */
	.topbg {
		padding: 0 0 6rem;
	}
	.mv-img {
		width: 90%;
		border-radius: 30px 0 0 30px;
		height: 40vh;
	}
}
@media screen and (max-width: 960px) { 
	/* ------------------------------------------------------------------------
	* mainvisual
	-------------------------------------------------------------------------- */
	.mv-img {
		height: 50vh;
	}
	.main-text img {
		height: 90%;
	}
	/* ------------------------------------------------------------------------
	* ブログ
	-------------------------------------------------------------------------- */
	.blog-box {
		display: flex;
		flex-wrap: wrap;
	}
	.blog-wrap {
		width: 45%;
	}
	.blog-item img {
		height: 200px;
	}
	/* ------------------------------------------------------------------------
	* 1日の流れ
	-------------------------------------------------------------------------- */
	.timeimg {
		width: 15%;
	}
	/* ------------------------------------------------------------------------
	* ご利用をお考えの方へ
	-------------------------------------------------------------------------- */
	.user-item {
		gap: 5rem;
	}
	.user-item img {
		width: 20%;
	}
	/* ------------------------------------------------------------------------
	* ご利用の流れ
	-------------------------------------------------------------------------- */
	#guide {
		background-size: 15%;
		background-position: 85% 5%;
	}
	.guide-box {
		background-image: none;
	}
	/* ------------------------------------------------------------------------------------------------
	* single-page
	-------------------------------------------------------------------------------------------------- */
	.thumbnail img {
		height: 300px;
	}
	/* ------------------------------------------------------------------------
	* S-pecについて
	-------------------------------------------------------------------------- */
	.about-box img {
		width: 50%;
	}
	.mean-box {
		display: block;
	}
	.mean-item {
		width: 100%;
	}
}
@media screen and (max-width: 560px) {
	/* ------------------------------------------------------------------------
	* 全体
	-------------------------------------------------------------------------- */
	.inner {
		padding: 6rem 2rem;
	}
	h1 {
		font-size: 2.5rem;
	}
	h2 {
		font-size: 2rem;
	}
	h3 {
		font-size: 1.8rem;
	}
	p, a, li {
		font-size: 1.6rem;
	}
	.line {
		width: 50%;
		margin-bottom: 4rem;
	}
	/* ------------------------------------------------------------------------
	* header
	-------------------------------------------------------------------------- */
	#navsp ul {
		padding: 0;
	}
	#navsp ul li a {
		font-size: 1.6rem;
	}
	/* ------------------------------------------------------------------------
	* mainvisual
	-------------------------------------------------------------------------- */
	.topbg {
		padding: 0 0 6rem;
	}
	.mv-img {
		width: 90%;
		border-radius: 30px 0 0 30px;
		height: 45vh;
	}
	.main-text {
		left: 5%;
	}
	.main-text img {
		height: 80%;
	}
	/* ------------------------------------------------------------------------
	* ブログ
	-------------------------------------------------------------------------- */
	.blog-box {
		display: block;
	}
	.blog-wrap {
		width: 100%;
		margin-top: 2rem;
	}
	.blog-item img {
		height: 200px;
	}
	.blog-item h3 {
		font-size: 1.6rem;
	}
	.more-btn a {
		font-size: 1.6rem;
	}
	/* ------------------------------------------------------------------------
	* 1日の流れ
	-------------------------------------------------------------------------- */
	#flow {
		background-size: 15%;
	}
	.tab_item {
		font-size: 1.6rem;
		padding: 1rem 0;
	}
	.tab_content {
		padding: 3rem 2rem;
	}
	.time {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
		gap: 3rem;
	}
	.timeimg {
		width: 30%;
	}
	/* ------------------------------------------------------------------------
	* ご利用案内
	-------------------------------------------------------------------------- */
	#user {
		background-size: 25%;
		background-position: 10% 3%;
	}
	.user-item {
		display: block;
	}
	.user-item:last-child {
		margin-top: 3rem;
	}
	.user-item img {
		width: 50%;
	}
	.user-item ul li:first-child {
		text-align: center;
		margin: 1rem 0;
		font-size: 1.8rem;
	}
	/* ------------------------------------------------------------------------
	* ご利用の流れ
	-------------------------------------------------------------------------- */
	#guide {
		background-size: 25%;
		background-position: 95% 2%;
	}
	.guide-box {
		padding: 2rem;
		background-image: none;
	}
	/* ------------------------------------------------------------------------
	* アクセス
	-------------------------------------------------------------------------- */
	#access {
		background-size: 20%;
		background-position: 10% 5%;
	}
	.access-box {
		display: block;
	}
	.access-box img {
		width: 100%;
	}
	.access-box ul {
		margin-top: 1rem;
	}
	/* ------------------------------------------------------------------------
	* お問い合わせ
	-------------------------------------------------------------------------- */
	#contact {
		background-size: 17%;
		background-position: 10% 101%, 70% 101%, 95% 101%;
	}
	.inquiry {
		width: 100%;
	}
	.inquiry td, .inquiry th {
		display: block;
		width: 100%;
		border-top: none;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	.inquiry tr:first-child th {
		border-top: 1px solid #d7d7d7;
	}
	.inquiry .any, .inquiry .haveto {
		font-size: 10px;
	}
	#formbtn {
		width: 80%;
	}
	/* ------------------------------------------------------------------------
	* footer
	-------------------------------------------------------------------------- */
	.footer-logo {
		font-size: 2rem;
	}
	footer ul {
		gap: 2rem;
		margin: 1rem 0 2rem;
	}
	small { 
		font-size: 1.4rem;
	}
	/* ------------------------------------------------------------------------------------------------
	* single-page
	-------------------------------------------------------------------------------------------------- */
	#single-page img {
		width: 100%;
	}
	.thumbnail img {
		height: 200px;
	}
	/* ------------------------------------------------------------------------------------------------
	* 自己評価
	-------------------------------------------------------------------------------------------------- */
	.assessment-box {
		width: 100%;
	}
}