@charset "UTF-8";

/**
 * mainvisual css
 */

.mainvisual_area {
	position: relative;
	width: 100%;
	height: 100vh;
	display: block;
}

.mainvisual_area_image {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	.top_mainvisual {
		width: 100%;
		height: 100%;
		img {
			object-fit: cover;
			width: 100%;
			height: 100%;
		}
	}
}

.mainvisual_area_text {
	position: absolute;
	font-size: 3.5rem;
	color: #fff;
	left: 5%;
	bottom: 15%;
	font-family: var(--mi);
	z-index: 15;
}

.mainvisual_area_text_r {
	left: auto;
	right: 5%;
}
.mainvisual_area_scroll {
	position: absolute;
	bottom: 0;
	width: 100%;
	text-align: center;
	margin-bottom: 50px;
	z-index: 15;
}

.mainvisual_area_scroll a {
	color: #fff;
	text-decoration: none;
	font-family: var(--mi);
	font-size: 2rem;
}

.mainvisual_area_scroll_line {
	content: "";
	display: block;
	position: absolute;
	width: 1px;
	height: 55px;
	background: #fff;
	margin-left: auto;
	margin-right: auto;
	top: 100%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 15;
}

.maincopy {
	margin-top: 46px;
	margin-bottom: 82px;
	font-size: 2.5rem;
	text-align: center;
	position: relative;
	font-family: var(--mi);
}

.maincopy:before {
	content: "";
	display: block;
	position: absolute;
	width: 1px;
	height: 58px;
	background: var(--c1);
	top: calc(100% + 13px);
	left: 50%;
}

@media screen and (max-width: 1110px) {
	.mainvisual_area_scroll, 
	.mainvisual_area_scroll_line {
		display: none;
	}
}
@media screen and (max-width:740px){
	.mainvisual_area_text {
		left: 15px;
		font-size: 5vw;
		bottom: 8%;
	}
	
	.maincopy {
		margin-top: 25px;
		font-size: 2rem;
		margin-bottom: 71px;
	}
}
@media screen and (max-width:639px){
}
@media screen and (max-width:500px){
}