/* +++#main-visual+++ */
#main-visual{
	/*height: 80vh;*/
	height:100vh;
	overflow: hidden;
	position: relative;
}
#main-visual:before{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/*background: url(../images/web_mainvisual_background.jpg);*/
	background: url(../images/web_mainvisual_background2.jpg);
	background-size: cover;
	background-position: center 60%;
	background-repeat: repeat-x;
	opacity: 0;
	visibility: hidden;
	filter: brightness(0.85);
	animation:sky 1s linear 5s both;
}
@keyframes sky{
	from{filter:brightness(0.85);}
	to{filter:brightness(1.2); }
}
@keyframes bg-slide {
	0% {
		background-position: 0 85%;
	}
	100% {
		background-position: 300px 85%;
	}
}
.loaded #main-visual:before{
	opacity: 1;
	visibility: visible;
}
.mv-slide{
	/*font-size: 6rem;*/
	font-size: 5rem;
	font-weight: 700;
	white-space: nowrap;
	height: 1em;
	margin: auto;
	justify-content: flex-start;
	flex-wrap: nowrap;
	z-index: 2;
	overflow: hidden;
	transition: 1.2s opacity ease;
}
.mv-slide div{
	animation-name: mv-slide;
	animation-duration: 60s;
	animation-delay: -30s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	animation-fill-mode: none;
	padding: 0 .5em;
	transition: .5s all ease;
}
.mv-slide div:nth-of-type(2){
	animation-name: mv-slide02;
	animation-duration: 60s;
	animation-delay: 0s;
}
.mv-text-area{
	position: absolute;
	left: 0;
	right: 0;
	/*bottom: min(6rem, 8.6vh);*/
	/*padding-inline: 2.5vw;*/
	bottom: 29%;
	padding-inline: 9.5vw;
	overflow: hidden;
}
#main-visual .text-red{
	color: #e60012;
	/*font-size: 4rem;*/
	/*margin-bottom: 4rem;*/
	font-size: 2vw;
	margin-bottom: 2vw;
	line-height: 1.2 !important;
	/*-webkit-text-stroke: 4px #fff;*/
	/*text-stroke: 4px #fff;*/
	/*paint-order: stroke;*/
}
#main-visual .text-red .large{
	font-size: 140%;
}
.sub-catch{
	/*margin-top: 5.6rem;*/
	/*font-size: 3rem;*/
	/*height: 6rem;*/
	width: fit-content;
	position: relative;
	/*line-height:5vw;*/
	height: 4vw;
	margin-top: 0;
	font-size: 1.8vw;
	line-height:4vw;
}
.sub-catch:before{
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background: #0a66dd;
	z-index: 1;
	white-space: nowrap;
	overflow: hidden;
	transition: .5s all cubic-bezier(0.5, 0, 0, 1.42);
	transition-delay: 4.8s;
	transform: scaleX(0);
	transform-origin: left top;
	z-index: 1;
}
.loaded .sub-catch:before{
	transform: scaleX(1);
}
.sub-catch span{
	position: relative;
	z-index: 9;
	/*padding: 0 .75em;*/
	color: #fff;
}
.sub-catch .slide-up{
	transform: translateY(6rem);
	transition: .3s all ease;
}

@keyframes mv-slide{
	0%{
		transform: translateX(100%);
	}
	100%{
		transform: translateX(-100%);
	}
}

@keyframes mv-slide02{
	0%{
		transform: translateX(0);
	}
	100%{
		transform: translateX(-200%);
	}
}
.web_kyouka_text {
	position: absolute;
	top: 25%;
	left: 12vw;
}
.web_kyouka_text .text-blue {
	color: #003567;
	font-size: 3.5vw;
	line-height: 1.2 !important;
}
.web_kyouka_text .text-blue:last-child {
	margin-left: 4rem;
}
.web_kyouka_girl{
	width: 374px;
	position: absolute;
	right: 200px;
	bottom: 555px;
	animation:visi_girl 3s both;
}
@keyframes visi_girl{
	from{opacity:0;}
	70%{opacity:0; }
	to{opacity:1; }
}
.web_kyouka_girl img{
	position:absolute;
	opacity:0;
	animation:girl0 2s linear 3s both;
}
.web_kyouka_girl img {
	width: 100%;
	position:absolute;
}
.web_kyouka_girl img:nth-child(1){
	animation:girl1 3s linear 3s both;
}
.web_kyouka_girl img:nth-child(2){
	animation:girl2 3s linear 4s both;
}
@keyframes girl0{
	from{opacity:0;}
	to{opacity:1; }
}
@keyframes girl1{
	from{ opacity:1;}
	to{ opacity:0; }
}
@keyframes girl2{
	from{ opacity:0;}
	to{ opacity:1; }
}



@media screen and (min-width: 1390px){
/* +++#main-visual+++ */
	.web_kyouka_girl{
		 width:500px;
	   	 right:180px;
   		 bottom: 769px;
   		 animation:visi_girl 3s both;
	}
	.sub-catch {
	    height: 3vw;
	    margin-top: 0;
	    font-size: 1.5vw;
	    line-height: 3vw;
	}
	.web_kyouka_text .text-blue {
	    color: #003567;
	    font-size: 2.8vw;
	    line-height: 1.2 !important;
	}
}



@media screen and (max-width:1280px){
/* +++#main-visual+++ */
	.web_kyouka_text {
		position: absolute;
		top: 40%;
		left: 11vw;
	}
	.sub-catch {
    		height: 4vw;
    		margin-top: 0;
    		font-size: 2.2vw;
	        line-height: 4vw;
	}
}



@media screen and (max-width: 768px){
.anzu{ font-size:2.8rem; }

/* +++#main-visual+++ */
	#main-visual{
		height: 75vh;
		/*margin-top: 5rem;*/
		margin-top: 0;
	}
	#main-visual:before{
		position: absolute;
		left: 0;
		background-position: 85% top;
	}
	.mv-slide{
		transition: 1.2s opacity ease;
		font-size: 7rem;
	}
	#main-visual .text-red{
		/*font-size: 2.4rem;*/
		font-size: 4vw;
		margin-bottom: 1.8rem;
	}
	.sub-catch{
		/*margin-top: 2.2rem;*/
		/*font-size: 1.8rem;*/
		/*height: 6rem;*/
		height: 5vw;
		margin-top: 0;
		font-size: 4vw;
		line-height: 5vw;
	}
	.web_kyouka_text {
		position: absolute;
		top: 49%;
		left: 10vw;
	}
	.web_kyouka_girl {
	    width: 320px;
	    position: absolute;
	    right:60px;
	    bottom: 603px;
	}
}



@media screen and (max-width:720px){
	.web_kyouka_girl {
	    width: 320px;
	    position: absolute;
	    right:60px;
	    bottom: 503px;
	}
}