@charset "utf-8";

/* navHeight */
@media (max-width:768px){
	.navHeight{
		width:100%;
		height: 70px;
	}
}

/* topWrap */
.eyeCatch{
	aspect-ratio: 1920/1080;
	width:100%;
	height:auto;
	overflow: hidden;
}
.eyeCatch_wrap{
	position: relative;
	width: 100%;
	height: 100%;
}
.eyeCatch_wrap>video{
	width:100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
}
@media (max-width:768px){            
	.eyeCatch{
		aspect-ratio: 750/920;
	}
}

/* sellingPoint */
.sellingPoint_wrap p{
	position: relative;
	aspect-ratio: 1920/252;
}
.shadow{
	filter:drop-shadow(0px 5px 10px rgba(0, 0, 0, 0.1));
}
.sp_absolute01{
	width: 100%;
	position: absolute;
	left: 0;
	top: -35%;
}
@media (max-width:768px){            
	.sp_absolute01{
		width: 100%;
		position: absolute;
		left: 0;
		top: -30%;                    
	}
	.sp_absolute02{
		width: 100%;
		position: absolute;
		left: 0;
		top: -9%;
	}
	.sellingPoint_wrap ul{
		margin-bottom: 80px;
	}
}
@media (max-width:500px){
	.sellingPoint_wrap ul{
		margin-bottom: 50px;
	}
}

/* mainTxt */
.mainTxt{
	padding-bottom:335px;
	background-image: url(../images/top/waveBg.jpg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: left bottom;
	position: relative;
}
.mainTxt_inner{
	width:1000px;
	margin:0 auto;
}
.mainTxt_inner>p:first-of-type{
	margin-bottom:50px;
}
.mainTxt_inner>p:nth-of-type(2){
	margin-bottom:50px;
}
.mainTxt_inner>p:last-of-type{
	margin-bottom:50px;
}
.top_requestBtn{
	width:400px;
	margin:0 auto;
}
.top_requestBtn p{
	width:100%;
}
.top_requestBtn p a{
	display: block;
	background-image: url(../images/top/btnBg.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
.top_requestBtn p a:hover{
	opacity:0.5;
}
.waveWrap{
	position:absolute;
	bottom:0;
	left:0;
}
.movieTop{
	position:absolute;
	bottom:-1px;
	left:0;
}
@media (max-width:1920px){
	.mainTxt{
		padding-bottom:335px;
	}
}
@media (max-width:1600px){
	.mainTxt{
		padding-bottom:250px;
	}
}
@media (max-width:1500px){
	.mainTxt_inner{
		width:66.66%;
	}
	.top_requestBtn{
		width:40%;
	}
	.mainTxt_inner>p:last-of-type{
		margin-bottom:30px;
	}
}
@media (max-width:1200px){
	.mainTxt{
		padding-bottom:200px;
	}
}
@media (max-width:1024px){
	.mainTxt{
		padding-bottom:180px;
	}
}
@media (max-width:768px){
	.mainTxt{
		background-image: url(../images/top/waveBg_sp.jpg);
		padding-bottom:200px;
	}
	.mainTxt_inner{
		width:100%;
	}
	.top_requestBtn{
		width:350px;
	}
}
@media (max-width:700px){
	.top_requestBtn{
		width:50%;
	}
}
@media (max-width:500px){
	.mainTxt{
		padding-bottom:160px;
	}
}
@media (max-width:375px){
	.mainTxt{
		padding-bottom:130px;
	}
}

/* topConcept */
.topConcept{
	width:100%;
	background-color: #d8e4ea;
}
.topConcept_inner{
	width:100%;
	background-color: #368aba;
}
.topConcept_wrap{
	width:100%;
	height:100vh;
	position: sticky;
	top: 0;
	filter: hue-rotate(-10deg);
}
.topConcept_wrap>video{
	object-fit: cover;
	width:100vw;
	height: 100vh;
	-webkit-mask-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 30%, rgba(255, 255, 255, 1) 70%, rgba(255, 255, 255, 0) 100%);
	mask-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 30%, rgba(255, 255, 255, 1) 70%, rgba(255, 255, 255, 0) 100%);
}
.topConcept_txtBox{
	position: relative;
	width:1000px;
	height: 100vh;
	margin: 0 auto;
	color:#fff;
	text-align: center;
}
.topConcept_txtBox h3{
	font-size: 2.25em;
	font-weight: 400;
	letter-spacing: 0.1em;
	margin-bottom: 30px;
}
.topConcept_txtBox p{
	font-size: 1em;
	line-height: 3;
	margin-bottom: 50px;
}
@media (max-width:1400px){
	.topConcept_txtBox{
		width:71.42%;
	}
	.topConcept_txtBox h3{
		font-size: 2em;
	}
}
@media (max-width:1200px){
	.topConcept_txtBox h3{
		font-size: 1.75em;
	}
}
@media (max-width:768px){
	.topConcept_txtBox{
		width:90%;
	}
	.topConcept_txtBox h3{
		font-size: 2.25em;
	}
	.topConcept_txtBox p{
		font-size: 1.25em;
	}
}
@media (max-width:500px){
	.topConcept_txtBox{
		width:100%;
	}
	.topConcept_txtBox h3{
		font-size: 2em;
	}
	.topConcept_txtBox p{
		font-size: 1em;
	}
}
@media (max-width:375px){
	.topConcept_txtBox h3{
		font-size: 1.75em;
	}
	.topConcept_txtBox p{
		font-size: 0.9em;
	}
}

/* movie_bottomWave */
.movie_bottomWave{
	background-color:#d8e4ea;
	position: relative;
	height: 100px;
}
.topRotate{
	transform:rotate(180deg);
}

/* topContent */
.topContent{
	padding: 200px 0;
	background-color: #d8e4ea;
}
.topContent_row{
	display: flex;
	aspect-ratio: 1920/800;
	position: relative;
	width:100%;
	height:100%;
	margin-bottom: 200px;
}
.topContent_row02{
	display: flex;
	justify-content: flex-end;
	aspect-ratio: 1920/800;
	position: relative;
	width:100%;
	height:100%;
	margin-bottom: 150px;
}
.topContent_txtBox{
	width:76.25%;
	background-color: #fff;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	position: relative;
}
.topContent_txtBox02{
	width:76.25%;
	background-color: #fff;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	position: relative;
}
.topContent_txtBox_inner{
	width:78.62%;
}
.topContent_txtBox_inner h3{
	font-family: "Marcellus", serif;
	font-size: 2.5em;
	font-weight: 500;
	letter-spacing: 0.1em;
	color:#727171;
	border-bottom: 1px solid #008cc2;
	margin-bottom: 50px;
}
.topContent_txtBox02>.topContent_txtBox_inner>h3{
	text-align: right;
}
.topContent_txtBox_inner p{
	font-size: 1.25em;
	line-height: 2.5;
	margin-left: 4em;
	margin-bottom: 25px;
}
.topContent_txtBox_inner p:nth-of-type(2){
	margin-bottom: 50px;
}
.topContent_txtBox02>.topContent_txtBox_inner>p{
	text-align: right;
	margin-right: 4em;
}
.topContent_imgBox{
	width: 50%;
	position: absolute;
	top:50%;
	right:0;
	transform: translate(0,-50%);
	filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.25));
}
.topContent_imgBox02{
	width: 50%;
	position: absolute;
	top:50%;
	left:0;
	transform: translate(0,-50%);
	filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.25));
	z-index: 2;
}
.tContent_btn>a{
	display: flex;
	justify-content: center;
	align-items: center;
	width:250px;
	padding: 0.5em 0;
	box-sizing: border-box;
	font-size: 1.25em;
	color: #808080;
	border: 1px solid #808080;
	margin-left: 4em;
	position: relative;
	transition: 0.5s all;
}
.tContent_btn>a:hover,
.tContent_btn>a:active{
	background-color: rgba(128, 128, 128,0.25);
	transition: 0.5s all;
}
.topContent_txtBox02>.topContent_txtBox_inner>.tContent_btn{
	display: flex;
	justify-content: flex-end;
	margin-right: 5em;
}
.topContent_txtBox02>.topContent_txtBox_inner>.tContent_btn>a{
	margin-left: 0;
}
.tContent_btn>a:after{
	content: '';
	width: 150px;
	height: 15px;
	border-bottom: solid 1px;
	border-right: solid 1px;
	position: absolute;
	bottom:10px;
	left: 20%;
	transform: skew(45deg);
	transition: width 0.3s ease;
}
.tContent_btn>a:hover:after{
	width: 250px;
}
.topContent_decoTxtBox{
	aspect-ratio: 1320/70;
	width: 100%;
	position: absolute;
	bottom:-5%;
	left: 0;
	mix-blend-mode: multiply;
}
.topContent_decoTxtBox02{
	aspect-ratio: 1320/70;
	width: 100%;
	position: absolute;
	bottom:-5%;
	right: 0;
	mix-blend-mode: multiply;
}
.topContent{
	position: relative;
}
.topContent:after{
	content: '';
	background-image: url(../images/top/waveBottom.svg);
	aspect-ratio: 1920/94;
	width: 100%;
	height: auto;
	position: absolute;
	bottom:-1px;
	left: 0;
}
.topRotate{
	bottom:1px;
	left:0;
}
@media (max-width:1920px){
	.topContent_row,
	.topContent_row02{
		aspect-ratio: 1920/900;
	}
	.topContent_row02{
		margin-bottom: 100px;
	}
}
@media (max-width:1400px){
	.topContent_row,
	.topContent_row02{
		aspect-ratio: 1920/1000;
	}
	.topContent_row02{
		margin-bottom: 50px;
	}
	.topContent_txtBox_inner{
		width: 85%;
	}
	.topContent_txtBox_inner h3{
		font-size: 2.25em;
	}
	.topContent_txtBox_inner p{
		font-size: 1em;
	}
	.tContent_btn>a{
		width:200px;
		font-size: 1em;
	}
	.topContent_txtBox02>.topContent_txtBox_inner>.tContent_btn{
		margin-right: 4em;
	}
	.tContent_btn>a:after{
		width: 125px;
		bottom:7px;
	}
	.tContent_btn>a:hover:after{
		width: 200px;
	}
}
@media (max-width:1200px){
	.topContent{
		padding: 300px 0 100px 0;
		background-color: #d8e4ea;
	}
	.topContent_row{
		margin-bottom: 300px;
	}
	.topContent_row,
	.topContent_row02{
		aspect-ratio: 1920/1100;
	}
	.topContent_txtBox_inner h3{
		font-size: 2em;
	}               
	.topContent_imgBox,
	.topContent_imgBox02{
		width: 60%;
		top:-25%;
		transform: translate(0,0);
	}
	.topContent_txtBox_inner{
		width: 90%;
	}
	.topContent_decoTxtBox,
	.topContent_decoTxtBox02{
		bottom:-3%;
	}
}
@media (max-width:1100px){
	.topContent_row,
	.topContent_row02{
		aspect-ratio: 1920/1200;
	}
}
@media (max-width:900px){          
	.topContent_imgBox,
	.topContent_imgBox02{
		width: 60%;
		top:-42.5%;
		transform: translate(0,0);
	}
	.topContent{
		padding: 300px 0 100px 0;
		background-color: #d8e4ea;
	}
}
@media (max-width:768px){   
	.topContent{
		padding: 100px 0 80px 0;
	}      
	.topContent_row,
	.topContent_row02{
		aspect-ratio: auto;
		flex-direction: column;
	}
	.topContent_row{
		align-items: flex-end;
		margin-bottom: 150px;
	}

	.topContent_row02{
		margin-bottom: 80px;
	}
	.topContent_txtBox,
	.topContent_txtBox02{
		width:100%;
	}
	.topContent_txtBox_inner{
		padding: 100px 0;
	}
	.topContent_decoTxtBox,
	.topContent_decoTxtBox02{
		width: 100%;
		height: auto;
	}
	.topContent_imgBox,
	.topContent_imgBox02{
		width: 85%;
		position: relative;
		aspect-ratio: 612/350;
		z-index: 2;
	}
	.topContent_imgBox p,
	.topContent_imgBox02 p{
		position: absolute;
		bottom:-25%;
	}
	.topContent_txtBox{
		order: 1;
	}
	.topContent_txtBox_inner h3{
		font-size: 2.5em;
	}
	.topContent_txtBox_inner p{
		font-size: 1.25em;
	}
	.tContent_btn>a{
		width:250px;
		padding: 0.75em 0;
		font-size: 1.25em;
	}
	.tContent_btn>a:after{
		width: 150px;
	}
	.tContent_btn>a:hover:after{
		width: 250px;
	}
}
@media (max-width:500px){
	.topContent{
		padding: 80px 0 50px 0;
	}  
	.topContent_txtBox_inner{
		padding: 80px 0;
	}
	.topContent_imgBox,
	.topContent_imgBox02{
		width: 90%;
	}
	.topContent_txtBox_inner h3{
		font-size: 2.25em;
	}
	.topContent_txtBox_inner p{
		font-size: 1em;
	}                
	.tContent_btn>a{
		width:200px;
		font-size: 1em;
	}
	.tContent_btn>a:after{
		width: 125px;
	}
	.tContent_btn>a:hover:after{
		width: 200px;
	}
}

/* specialContents */
.specialContents{
	padding:150px 0 200px 0;
	position: relative;
	background-image: url(../images/top/waveBg.jpg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: left bottom;
}
.specialContents_inner{
	width:1320px;
	margin:0 auto;
	background-color: #fff;
}
.specialContents_inner>span{
	display:block;
	aspect-ratio: 1300/27;
	width:100%;
	height:auto;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
.specialContents_inner>span:first-of-type,
.specialContents_inner>span:last-of-type{
	background-image: url(../images/top/deco01.jpg);
}
.sC_txtWrap_inner{
	width:700px;
	margin:0 auto;
	padding:50px 0;
}
.sC_txtWrap_inner>.subTtl{
	margin-bottom: 30px;
}
.sC_txtWrap_inner>h2{
	font-size: 2em;
	font-weight: 300;
	letter-spacing: 0.1em;
	text-align: center;
	padding:20px 0;
	margin-bottom:20px;
	position: relative;
	padding: 0 1em;
	box-sizing: border-box;
}
.sC_txtWrap_inner>h2:before{
	content: '';
	width:50px;
	height: 50px;
	border-bottom: 1px solid #000;
	position: absolute;
	left: 0;
	bottom: 0;
}
.sC_txtWrap_inner>h2:after{
	content: '';
	width:50px;
	height: 50px;
	border-bottom: 1px solid #000;
	position: absolute;
	right: 0;
	bottom: 0;
}
.sC_txtWrap_inner>p{
	font-size: 1em;
	line-height: 1.8;
	text-align: center;
	margin-bottom: 40px;
}
.specialContents_row{
	display: flex;
	justify-content: space-between;
	margin-bottom: 30px;
}
.specialContents_rowInner{
	width:48%;
	text-align: center;
	background-color: #d8e4ea;
	padding: 2em 0;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
}
.specialContents_rowInner h3{
	font-family: "Marcellus", serif;
	font-size: 1.5em;
	letter-spacing: 0.1em;
	color: #0078ad;
	margin-bottom: 10px;
}
.specialContents_rowInner p:first-of-type{
	font-size: 1em;
	margin-bottom: 20px;
}
.specialContents_rowInner p:last-of-type{
	font-family: "Noto Sans JP", sans-serif;
	background-color: #fff;
	color: #0078ad;
	font-size: 1em;
	letter-spacing: 0.1em;
	margin-bottom: 10px;
	display: inline-block;
	padding: 0.5em 3em;
}        
.top_loginBtn{
	width:400px;
	margin:0 auto;
	margin-bottom: 15px;
}
.top_loginBtn p{
	width:100%;
	background-image: url(../images/top/btnBg02.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
.sC_txtWrap_inner>p:last-of-type {
	margin-bottom: 0px;
}            
.top_loginBtn p a{
	display: block;
	background-color: rgb(101, 176, 212);
	mix-blend-mode: multiply;            
}
@media (max-width:1600px){
	.specialContents_inner{
		width:81.25%;
		margin:0 auto;
		background-color: #fff;
	}
}
@media (max-width:1400px){
	.sC_txtWrap_inner>h2{
		font-size: 1.75em;
	}
	.sC_txtWrap_inner{
		width:61.51%;
	}
	.specialContents_rowInner h3{
		font-size: 1.25em;
	}
	.top_loginBtn{
		width:57.14%;
	}
}
@media (max-width:1300px){
	.sC_txtWrap_inner{
		width:65%;
	}
}
@media (max-width:1200px){
	.sC_txtWrap_inner{
		width:70%;
	}
}
@media (max-width:1000px){
	.sC_txtWrap_inner{
		width:75%;
	}
}
@media (max-width:768px){
	.specialContents{
		padding:100px 0 150px 0;
		background-image: url(../images/top/waveBg_sp.jpg);
	}
	.sC_txtWrap_inner{
		width:90%;
	}
	.sC_txtWrap_inner>h2{
		font-size: 1.5em;
	}
}
@media (max-width:600px){
	.specialContents_row{
		flex-wrap: wrap;
		margin-bottom: 15px;
	}
	.specialContents_row:nth-of-type(2){
		margin-bottom: 30px;
	}
	.specialContents_rowInner{
		width:100%;
	}
	.specialContents_rowInner:first-of-type{
		margin-bottom: 15px;
	}
}
@media (max-width:500px){
	.specialContents{
		padding:80px 0 130px 0;
		background-image: url(../images/top/waveBg_sp.jpg);
	}
	.top_loginBtn{
		width:90%;
	}
}