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

/* -------------------------------
 　visualArea
---------------------------------*/
#visualArea{
	width: 100vw;
	height: 100vh;
	z-index: 1;
	position: relative;
	margin-top: -50px;
	margin-bottom: 0;
}

.mainVisual{
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 5;
	opacity: 1;
	top: 0;
	left: 0;
}

.vCopyCont{
	width: 70%;
	height: auto;
	margin: 0 auto;
	text-align: center;
	z-index: 10;
	position: absolute;
	top: 50%;
	left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
}

h1.vAreaCopy{
	width: 100%;
	padding: 0;
	margin: 0;
	text-align: center;
}
	
h1.vAreaCopy p{
	padding: 2rem 0 0 0;
	font-size: 2rem; 
	font-weight: 600;
	color: #333333;
	font-family: "bold","sans-serif";
	line-height: clamp(2.6rem, 0.08rem + 3.93vw, 4.8rem);
}	

.vAreaText{
	width: 100%;
	height: auto;
	text-align: center;
}

h2.vAreaText p{
	font-size: clamp(1.1rem, -0.045rem + 1.79vw, 2.1rem);
	line-height: clamp(1.8rem, 0.426rem + 2.15vw, 3rem);
}
	
h2.vAreaText p{
	font-size: clamp(1.1rem, -0.045rem + 1.79vw, 2.1rem);
	line-height: clamp(1.8rem, 0.426rem + 2.15vw, 3rem);
}

.vAreaImg{
	width: 35%;
	height: auto;
	margin: 0 auto;
	padding: 1rem 0;
	text-align: center;
}


@media screen and (max-width: 768px) {
	
#visualArea{
    height: 90vh;
	
}
	
.vCopyCont{
	width: clamp(32.688rem, 11.064rem + 62.79vw, 51.25rem);
}
	
h1.vAreaCopy p{
	font-size: clamp(1.1rem, 0.052rem + 3.04vw, 2rem);
}
	
.vAreaImg{
	width: 45%;
	padding-top: 2rem;
}	
	
.vAreaText{
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 1.5rem 0;
	text-align: center;

}	
h2.vAreaText p{
	font-size: clamp(0.6rem, -0.09rem + 2.95vw, 1.8rem);
	line-height: clamp(1.4rem, 0.479rem + 3.94vw, 3rem);
}
}

@media screen and (max-width: 768px) {
#visualArea{
	margin-top: -70px;
}
}

@media screen and (max-width: 550px) {
#visualArea{
	margin-top: 0;
}	
.vCopyCont{
	width: 95%;
}
	
h1.vAreaCopy p{
	font-size: clamp(0.8rem, 0.522rem + 1.39vw, 1rem);
	line-height: clamp(1.4rem, 0.843rem + 2.78vw, 1.8rem);
}
	
.vAreaImg{
	width: 33%;
	padding-top: clamp(1rem, 0.165rem + 4.17vw, 1.6rem);
}	
	
.vAreaText{
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 1.5rem 0;
	text-align: center;

}	
h2.vAreaText p{
	font-size: clamp(0.6rem, -0.09rem + 2.95vw, 1.8rem);
	line-height: clamp(1.4rem, 0.479rem + 3.94vw, 3rem);
}
}