@charset UTF-8;

@media screen and (max-width: 1024px){
	.main-visual img{
		width: 100%;
		border-top-right-radius: 150px;
	}
	p{
		font-size: 13px;
	}

	.text-wrapper{
		width: 60%;
		height: 26rem;
	}

	.border{
		width: 60%;
		height: 26rem;
	}

	#top-wrapper h1{
		font-size: 30px;
		position: absolute;
		bottom: -100px;
		right: 0;
	}

	@keyframes typing{
		from{width: 0;}
		to{width: 20rem;}
	}

	.typing{
		border-right: .1em solid #C94F4F;
	}

	#contents-wrapper{
		margin-top: 15rem;
	}

	.b-img img{
		width: 10vw;
		height: 20vh;

	}

	.pd-img img{
		width: 35vw;
		height: 45vh;
	}

	.heading{
		font-size: 30px;
	}
}

@media screen and (max-width: 599px){
	.main-visual img{
		width: 100%;
		border-top-right-radius: 90px;
	}

	.text-wrapper{
		width: 90%;
		height: 30rem;
		position: absolute;
		top: 15rem;
		left: 1rem;
	}

	.border{
		width: 90%;
		height: 30rem;
		position: absolute;
		top: 16rem;
		left: 1.5rem;
	}

	#top-wrapper h1{
		font-size: 20px;
		position: absolute;
		top: 47rem;
		right: 20%;
	}

	p{
		font-size: 10px;
	}

	#contents-wrapper{
		margin-top: 37rem;
	}

	.b-img img{
		width: 25vw;
		height: 30vh;
	}

	.pd-img img{
		width: 50vw;
		height: 50vh;
	}

	.heading{
		font-size: 20px;
	}
	
}