@charset "utf-8";
/* CSS Document */


/*トップコンテンツ*/
.page-top-contents{
    width: 100%;
    height: 650px;
    position: relative;
    background-position: center center;
    background-size: cover;
    overflow: hidden;
}
.page-top-contents::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.25);
}
.page-top-contents::after {
    content: "";
    position: absolute;
    bottom: -30px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    width: 0%;
    height: 0px;
    border-radius: 50% 50% 0 0/100% 100% 0 0;
	background-color: #f9f8f4;
    transition: 0.8s ease;
}
.page-top-contents.fadeIn::after {
    width: 110%;
    height: 100px;
}
.page-top-copy{
    position: absolute;
    top: calc(50% + 50px);
    left: 50%;
    z-index: 3;
    transform: translate(-50%,-50%);
    width: 90%;
    color: #ffffff;
    text-align: center;
    opacity: 0;
    transition: 0.8s ease;
}
.fadeIn .page-top-copy{
	opacity: 1;
}
.page-top-copy h1{
	font-size: 4rem;
	font-weight: 400;
	line-height: 1em;
	letter-spacing: 0.13em;
}
.page-top-copy p{
	font-size: 2rem;
	letter-spacing: 0.25em;
}
.page-top-copy p + h1{
	margin-top: 12px;
}


/*調整用*/
@media screen and (max-width:1000px) {

}

/*スマートフォン*/
@media screen and (max-width:780px) {
	/*トップコンテンツ*/
	.page-top-contents{
		height: 330px;
	}
	.page-top-contents.fadeIn::after{
		width: 120%;
		height: 60px;
	}
	.page-top-copy{
		top: calc(50% + 30px);
	}
	.page-top-copy h1{
		font-size: 2rem;
	}
	.page-top-copy p{
		font-size: 0.9rem;
	}
}