.home.slider {display: none;}

.home.welcome {padding: 1rem; background-image: linear-gradient(to bottom, #ffffff, #94d8ff 100%);}
.home.welcome .contact {
	display: block; width: 140px; height: 40px; margin: 1rem auto 0;
	line-height: 40px; text-align: center;
	background-color: #A170FF; color: white; font-size: 1rem;
}

@media screen and (min-width: 40em) {
	.home.slider {display: block; height: calc(100vh - var(--layout-header-height)); margin-bottom: 2rem;}
	.home.slider .slide {
		width: 100%; height: calc(100vh - var(--layout-header-height)); float: right;
		background-size: cover; background-position: bottom right; background-repeat: no-repeat;
	}
	.home.slider .slide._1 {background-image: url('../../../image/slider/1.png?v=2');}
	.home.slider .slide._2 {background-image: url('../../../image/slider/2.jpg?v=2');}
	.home.slider .slide._3 {background-image: url('../../../image/slider/3.jpg?v=2');}

	.home.welcome {
		position: absolute; top: var(--layout-header-height);
		width: 100%; height: calc(100vh - var(--layout-header-height));
		padding: 0; background: none;
	}
	.home.welcome .appeal {
		position: absolute; right: 5%; top: 1.5rem; width: 90%; height: calc(100% - 7rem); overflow: hidden;
	}
	.home.welcome .contact {position: absolute; right: 50%; bottom: 3rem; margin: 0 -70px 0 0;}
}

@media screen and (min-width: 64em) {
	.home.slider .slide {background-position: center;}

	.home.welcome .appeal {right: 8rem; top: 2rem; width: 38%;}
	.home.welcome .contact {right: 8rem; bottom: 2rem; margin: 0;}
}

@media screen and (min-width: 100em) {
	.home.welcome .appeal {top: 4rem; width: 40%;}
}
