@charset 'utf-8';

/* ==========================================================================

	うぶやの過ごし方

   ========================================================================== */


/*--------------------------------
	メインビジュアル
--------------------------------*/

.second_top {
	background-image: url(../images/top.jpg);
}

/*--------------------------------
	レイアウト
--------------------------------*/

/* 円形イメージ+キャプション */

.stay_box {
	padding: 0 0 100px;
	min-height:1px;
	zoom:1;
	clear:both;
}

.stay_box:after {
	content:".";
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	font-size:0px;
}

.stay_box i {
	display: block;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	overflow: hidden;
	font-size: 0;
}

.stay_box i img {
	width: 100%;
}

.stay_box p {
	width: 40%;
	min-width: 300px;
	max-width: 450px;
	font-size: 1.4rem;
}

.stay_box strong {
	display: block;
	margin: 0 auto 10px;
	color: #3599C1;
	font-size: 2.8rem;
	letter-spacing: 0.1em;
}

/* リンクボタン調整 */

.link_btn {
	display: block;
	margin: 20px 0 0;
	font-size: 1.4rem;
}

.link_pdf {
	margin: 20px 0 0;
	font-size: 1.4rem;
	text-align: center;
}


/*--------------------------------
	ながら富士
--------------------------------*/

.stay_fuji {
	position: relative;
	padding: 50px 0 150px;
/*	background: linear-gradient(rgba(255, 255, 255, 0), #DAEAEF);*/
    background: linear-gradient(rgba(255, 255, 255, 0), #c7e6f0, rgba(255, 255, 255, 0), #c7e6f0);
}

.stay_fuji:after {
	content: "";
	display: block;
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 100%;
	padding: 4.7% 0 0;
	background: url(/common/images/wave_bottom.svg) no-repeat center bottom;
	background-size: 102% auto;
	z-index: 1;
}

.stay_fuji .stay_box:nth-of-type(1) i { width: 80%; float: left; }
.stay_fuji .stay_box:nth-of-type(1) i:nth-of-type(2) { width: 30%; float: right; margin: -100px 0 0; }
.stay_fuji .stay_box:nth-of-type(1) p { float: left; margin: 30px 0 0 5%; }

.stay_fuji .stay_box:nth-of-type(2) i { width: 50%; float: left; }
.stay_fuji .stay_box:nth-of-type(2) p { float: left; margin: 230px 0 0 5%; }

.stay_fuji .stay_box:nth-of-type(3) { padding-bottom: 150px; }
.stay_fuji .stay_box:nth-of-type(3) i { width: 75%; margin: 0 auto; }
.stay_fuji .stay_box:nth-of-type(3) p { margin: 50px auto 0; }

.stay_fuji .stay_box:nth-of-type(4) { padding-bottom: 150px; }
.stay_fuji .stay_box:nth-of-type(4) i { width: 60%; float: right; clear: both; }
.stay_fuji .stay_box:nth-of-type(4) i:nth-of-type(2) { width: 40%; float: left; margin: -100px 0 0 4%; }
.stay_fuji .stay_box:nth-of-type(4) p { float: right; margin: 100px 8% 0 0; }

.stay_fuji .stay_box:nth-of-type(5) i { width: 55%; float: right; }
.stay_fuji .stay_box:nth-of-type(5) p { float: left; margin: 250px 0 0 2%; }


/*--------------------------------
	その他
--------------------------------*/

.stay_other {
	position: relative;
	padding: 100px 0 0;
}

.stay_other .stay_box:nth-of-type(1) { padding: 0 0 50px 2%; }
.stay_other .stay_box:nth-of-type(1) i { width: 55%; float: left; }
.stay_other .stay_box:nth-of-type(1) p { margin: 30px 0 0; }

/*
.stay_other .stay_box:nth-of-type(2) i { width: 35%; float: right; }
.stay_other .stay_box:nth-of-type(2) p { float: right; margin: 120px 5% 0 0; max-width: 380px; }

.stay_other .stay_box:nth-of-type(3) { padding: 0; }
.stay_other .stay_box:nth-of-type(3) i { width: 50%; float: left; }
.stay_other .stay_box:nth-of-type(3) p { float: left; margin: 200px 0 0 5%; }
*/

.stay_other .stay_box:nth-of-type(2) { margin-top: -50px; }
.stay_other .stay_box:nth-of-type(2) i { width: 45%; float: right; }
.stay_other .stay_box:nth-of-type(2) p { float: right; margin: 280px 1% 0 0; max-width: 440px; }


/* ============================== SP ============================== */

@media only screen and (max-width: 812px) {

	/*--------------------------------
		メインビジュアル
	--------------------------------*/

	.second_top {
		height: 85vw;
		background-image: url(../images/top_sp.jpg);
	}
	
	/*--------------------------------
		レイアウト
	--------------------------------*/
	
	/* 円形イメージ+キャプション */

	.stay_box {
		padding: 0 0 60px;
	}
	
	.stay_box p {
		width: 100%;
		min-width: 0;
		max-width: 90%;
		text-align: left;
	}
	
	.stay_box p br {
		display: none;
	}
	
	.stay_box strong {
		margin: 0 auto 5px;
		font-size: 1.8rem;
	}
	
	/* リンクボタン調整 */
	
	.link_btn {
		margin: 20px auto 0;
	}
	
	.link_pdf {
		margin: 20px auto 0;
	}

	
	/*--------------------------------
		ながら富士
	--------------------------------*/
	
	.stay_fuji {
		padding: 30px 0;
		text-align: center;
	}
	
	.stay_fuji .inner {
	}

	.stay_fuji .stay_box p {
		clear: both;
	}
	
	.stay_fuji .stay_box:nth-of-type(1) i { width: 85%; float: left; }
	.stay_fuji .stay_box:nth-of-type(1) i:nth-of-type(2) { width: 55%; float: right; margin: 0 0 0; }
	.stay_fuji .stay_box:nth-of-type(1) p { float: none; margin: 0 auto; padding: 15px 0 0; clear: both; }
	
	.stay_fuji .stay_box:nth-of-type(2) i { width:100%; float: none; margin: 0 auto; }
	.stay_fuji .stay_box:nth-of-type(2) p { float: none; margin: 20px auto 0; }
	
    .stay_fuji .stay_box:nth-of-type(3) { padding-bottom: 60px; }
	.stay_fuji .stay_box:nth-of-type(3) i { width: 100%; margin: 0 auto; }
	.stay_fuji .stay_box:nth-of-type(3) p { margin: 20px auto 0; }
	.stay_fuji .stay_box:nth-of-type(3) p .link_more,
	.stay_fuji .stay_box:nth-of-type(3) p .link_pdf { margin: 10px auto 0; }

    .stay_fuji .stay_box:nth-of-type(4) { padding-bottom: 60px; }
    .stay_fuji .stay_box:nth-of-type(4) i { width: 85%; float: left; }
    .stay_fuji .stay_box:nth-of-type(4) i:nth-of-type(2) { width: 55%; float: right; margin: 0 0 0; }
    .stay_fuji .stay_box:nth-of-type(4) p { float: none; margin: 0 auto; padding: 15px 0 0; clear: both; }


    .stay_fuji .stay_box:nth-of-type(5) i { width: 100%; float: none; margin: 0 auto; }
    .stay_fuji .stay_box:nth-of-type(5) p { float: none; margin: 20px auto 0; }
    
	
	/*--------------------------------
		その他
	--------------------------------*/
	
	.stay_other {
		position: relative;
		padding: 60px 0 0;
		text-align: center;
	}

	.stay_other .stay_box:nth-of-type(1) { padding: 0 0 50px; }
	.stay_other .stay_box:nth-of-type(1) i { width: 100%; float: none; margin: 0 auto; }
	.stay_other .stay_box:nth-of-type(1) p { margin: 20px auto 0; }
	
/*
	.stay_other .stay_box:nth-of-type(2) i { width: 100%; float: none; margin: 0 auto; }
	.stay_other .stay_box:nth-of-type(2) p { float: none; margin: 20px auto 0; max-width: 90%; }
	.stay_other .stay_box:nth-of-type(2) p .link_more { margin: 10px 0 0; font-size: 1.2rem; }
	.stay_other .stay_box:nth-of-type(2) p .link_more a { font-size: 1.3rem; letter-spacing: 0; }
	
	.stay_other .stay_box:nth-of-type(3) { padding: 0; }
	.stay_other .stay_box:nth-of-type(3) i { width: 100%; float: none; margin: 0 auto; }
	.stay_other .stay_box:nth-of-type(3) p { float: none; margin: 20px auto 0; }
*/
    .stay_other .stay_box:nth-of-type(2) { margin-top: 0; }
    .stay_other .stay_box:nth-of-type(2) i { width: 100%; float: none; margin: 0 auto; }
    .stay_other .stay_box:nth-of-type(2) p { float: none; margin: 20px auto 0; max-width: 90%; }
    
}
