/*----- トップページ -----*/
	.top {
		height: 100vh;
		background-color: #fff;
		position: relative;
		background-image: url(https://wanohako.com/hp/wanohako/img/top.png);
		background-repeat: no-repeat;
		background-position: 90% 20vh;
		background-size: 60vh;
	}

	.top .subtitle {
		position: absolute;
		top: 50%;
		left: 10%;
	}

	.top .ring {
		position: absolute;
		top: 70vh;
		left: 150px;
		animation-name: fuwa;
		animation-duration: 4s;
	}

	.top .ring img {
		width: 180px;
		cursor: pointer;
	}

	.top .main {
		font-size: 50px;
		font-weight: bold;
		color: #E8334A;
		position: absolute;
		top: 30vh;
		left: 50px;
		display: table;
	}

	.top .sub {
		font-size: 30px;
		color: #E8334A;
		position: absolute;
		top: 50vh;
		left: 50px;
		animation-name: fuwa;
		animation-duration: 4s;
	}

	footer {
		position: absolute;
	}


	/*----- スマホの場合 -----*/
	@media screen and (max-width: 768px) {
		.top {
			height: 100vh;
			background-color: #fff;
			position: relative;
			max-width: 1080px;
			margin: 0 auto;
			background-image: url(https://wanohako.com/hp/wanohako/img/top.png);
			background-repeat: no-repeat;
			background-position: 30px 20vh;
		    background-size: 55vh;
		}

		.top .main {
			font-size: 35px;
			left: 30px;
			letter-spacing: -7px;
		}

		.top .sub {
			font-size: 20px;
			left: 30px;
		}

		.top .ring {
			position: absolute;
			transform: translateX(-50%);
			left: 50%;
		}

		.top .ring img {
			width: 140px;
		}
	}