/*フェード*/
.first_fade {
	opacity: 0;
	transition: opacity 1s;
}

.first_fade.is-show {
	opacity: 1;
	transition-delay: .5s;
}

.first_fadeup {
	opacity: 0;
	transform: translateY(80px);
	transition: opacity .8s, transform .8s;
}

.first_fadeup.is-show {
	opacity: 1;
	transform: translateY(0);
}

/**/
.top_first {
	width: 100%;
	position: relative;
	display: block;
	overflow: hidden;
}

#top_first {
	will-change: transform;
	transition: opacity 1s ease;
	transform: scale(100%);
}

.firstview-img {
	position: relative;
	width: 100%;
	vertical-align: middle;
	transform: scale(100%);
}




.aspectRatio16 .firstview-img,
.aspectRatio16 .topmian-pointer,
.aspectRatio17 .firstview-img,
.aspectRatio17 .topmian-pointer,
.aspectRatio18 .firstview-img,
.aspectRatio18 .topmian-pointer,
.aspectRatio19 .firstview-img,
.aspectRatio19 .topmian-pointer,
.aspectRatio20 .firstview-img,
.aspectRatio20 .topmian-pointer,
.aspectRatio21 .firstview-img,
.aspectRatio21 .topmian-pointer { margin-bottom: -5vw; }


.aspectRatio22 .firstview-img,
.aspectRatio22 .topmian-pointer,
.aspectRatio23 .firstview-img,
.aspectRatio23 .topmian-pointer,
.aspectRatio24 .firstview-img,
.aspectRatio24 .topmian-pointer,
.aspectRatio25 .firstview-img,
.aspectRatio25 .topmian-pointer { margin-bottom: -8vw; }


.aspectRatio16 .top-second-logo { margin-bottom: -4.8vw; }
.aspectRatio17 .top-second-logo { margin-bottom: -5.8vw; }
.aspectRatio18 .top-second-logo { margin-bottom: -6.8vw; }
.aspectRatio19 .top-second-logo { margin-bottom: -7.8vw; width: 116px; }
.aspectRatio20 .top-second-logo { margin-bottom: -8.8vw; width: 116px; }
.aspectRatio21 .top-second-logo { margin-bottom: -9.8vw; width: 116px; }
.aspectRatio22 .top-second-logo { margin-bottom: -11.8vw; width: 116px; }
.aspectRatio23 .top-second-logo { margin-bottom: -12.8vw; width: 116px; }
.aspectRatio24 .top-second-logo { margin-bottom: -12.8vw; width: 100px; transform: translateX(6px); }
.aspectRatio25 .top-second-logo { display:none; margin-bottom: -13.8vw; width: 100px; transform: translateX(6px);  }


.fv-pc-wide,
.fv-pc-normal,
.fv-sp {
	display: none;
}

.scroll-anime {
	position: absolute;
	bottom: 0;
	height: 200px;
	opacity: 0;
	transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1);
}
@media (min-width: 1000px) and (max-height: 740px) {
	.scroll-anime {
		bottom: -6vh;
	}
	.top_first_container {
		transform: translateY(-10vh);
	}
	.scroll-anime p::after {
		height: 120px;
	}
}
.scroll-anime.show {
	opacity: 1;
}

.scroll-anime.hide {
	opacity: 0;
}

.scroll-anime p {
	display: block;
	padding: 10px 10px 110px;
	color: #fff;
	font-size: .12rem;
	line-height: 1;
	letter-spacing: 0.2em;
	writing-mode: vertical-lr;
	transition: 0.2s;
	overflow: hidden;
}

.scroll-anime p::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 1px;
	height: 100px;
	background: #fff;
}


.scroll-anime p::after {
	animation: sdl01 1.5s cubic-bezier(1, 0, 0, 1) infinite;
}

@keyframes sdl01 {
	0% {
		transform: scale(1, 0);
		transform-origin: 0 0;
	}

	50% {
		transform: scale(1, 1);
		transform-origin: 0 0;
	}

	50.1% {
		transform: scale(1, 1);
		transform-origin: 0 100%;
	}

	100% {
		transform: scale(1, 0);
		transform-origin: 0 100%;
	}
}


.top-second-logo {
	position: absolute;
	bottom: 45.5vw;
	left: 0;
	right: 0;
	margin: auto;
	width: 141px;
	opacity: 0;
	transition: opacity 1s;
}

body:not(.wide) .top-second-logo{
    bottom: 53.5vw;
}

.top-second-logo-pc.wide {
	bottom: 39.5vw;
}

.top_first.stop-300 .top-second-logo {
	opacity: 1;
}

.topmian-pointer {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	opacity: 0;
	transition: opacity 1s;
}

.top_first.stop-300 .topmian-pointer {
	opacity: 1;
}

.top_first_blue {
	width: 100%;
	height: 100dvh;
	/*transition: 100s;*/
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 0;
	bottom: auto;
	left: auto;
	right: auto;
	z-index: 111;
}

.top_first_container {
	flex: 0 1 auto;
	width: 100%;
}

.top_first_logo {
	margin: 0 auto;
	display: block;
	width: 141px;
	opacity: 0;
	/*animation :1.3s firstlogo 2s forwards;*/
	transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.top_first_logo.show {
	opacity: 1;
}

.top_first_logo.hide {
	opacity: 0;
}

.top_first_text {
	margin-top: 40px;
	width: 100%;
	text-align: center;
	font-size: .28rem;
	font-family: 'Noto Serif JP', serif;
	font-weight: 500;
	color: #fff;
	opacity: 0;
	transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes firstlogo {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.top_first_text.show {
	opacity: 1;
}

.top_first_text_sp.hide {
	opacity: 0;
}


@media screen and (min-width: 801px) {}

#top_first.stop {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	/*z-index: 10;*/
}

.top_first_img {
	width: 100%;
	position: relative;
	/* padding-bottom: 30.5%; */
}

.top_first-wrap {
	position: relative;

}

.img-none {
	display: none;
}

.top_first_imgsp {
	display: none;
}


.top-curve {
	position: relative;
	z-index: 11;
	width: 100vw;
	padding: 0;
	vertical-align: bottom;
	margin-bottom: -2px;
}

#top_over {
	padding: 75px 0 137px;
	position: relative;
	z-index: 20;
	background-color: #F2F5F7;
	background-image: url(../images/top/top_over_bg.jpg);
	background-position: top center;
	background-size: cover;
	background-repeat: no-repeat;
	text-align: center;
}


.over_head {
	font-size: .3rem;
	text-align: center;
	line-height: 1.9;
	font-family: 'Noto Serif JP', serif;
	font-weight: 500;
}

.over_head_lg {
	font-size: .4rem;
}

.over_head_onimg {
	display: none;
}

.over_text {
	margin-top: 38px;
	line-height: 2.6;
	font-size: .16rem;
	text-align: center;
	font-family: 'Noto Serif JP', serif;
}

.over_pre {
	margin: 53px auto 0;
	display: block;
	font-size: .24rem;
	text-align: center;
	color: #AB986F;
	font-family: 'Noto Serif JP', serif;
	font-weight: 500;
}

.over_list {
	margin: 15px auto 0;
	max-width: 674px;
	list-style: none;
}

.over_listitem {
	margin-left: .14rem;
	text-indent: -.15rem;
	font-size: .12rem;
	line-height: 1.75;
	font-weight: 300;
}

.over_link {
	margin-top: 70px;
}

/*
.over_link{
  margin: 70px auto 0;
  padding: 25px 10px;
  display: block;
  text-decoration: none;
  color: #fff;
  background-color: #B49A6D;
  text-align: center;
  width: 674px;
  box-sizing: border-box;
  font-family: 'Noto Serif JP', serif;
  font-weight: 400;
  transition: all .3s;
}
.over_link:hover{
	background-color: #fff;
    color: #B49A6D;
}
.over_link_text1{
  display: block;
  text-align: center;
  font-size: .18rem;
}
.over_link_text2{
  margin-top: 5px;
  display: block;
  text-align: center;
  font-size: .24rem;
}*/
.top-f-block__bottom-over1 {
	margin: 60px auto 0;
}

.top-f-block__bottom-over2 {
	margin: 20px auto 0;
}

.top-f-link-over {
	margin: 0 auto;
}

.top-f-block__bottom-over2 .top-f-link-over {
	pointer-events: none;
}

.top-f-link-over {
	background-color: #fff;
	letter-spacing: 0;
}

.top_next {
	position: relative;
	z-index: 11;
	background-color: #fff;
}

#top_overwrap {
	padding-top: 1000px;
	overflow-x: hidden;
}

.first-banner-btn {
    position: absolute;
    bottom: 3.7%;
    left: 12.5%;
    z-index: 1;
    width: 19%;
}

.first-banner-btn img{
	width:100%;
	transition:0.5s;
}
.first-banner-btn:hover{
    filter: brightness(1.04);
	opacity:1 !important;
}


@media screen and (max-width: 1380px) {
	.first-banner-btn {
    left: 8.5%;
}
}





@media screen and (min-width: 801px) and (max-width: 1000px) {
	.only801to1000 {
		display: block;
	}

	.top_over_spwhite {
		margin: 0 auto;
		width: calc(100% - 40px);
	}
}

@media screen and (max-width: 800px) {

	.scroll-anime {
		right: 6px;
	}

	/*
	#top_first .firstview-img{
		transform: scale(140%);
		transform-origin: bottom center;
		transition: all 1s;
	}
	#top_first.stop .firstview-img{
		transform: scale(120%);
	}
	#top_first.stop100 .firstview-img{
		transform: scale(100%);
	}*/
	#pinstop {
		overflow: hidden;
	}

	.top_first_logo_sp {
		opacity: 1;
	}

	#top_first.stop .top_first_logo_sp {
		opacity: 0;
	}

	#top_first.stop {
		bottom: 0;
	}

	#top_overwrap {
		/*margin-top: -10.5%;*/
		padding-top: 0;
		overflow: hidden;
	}

	.scroll-anime p {
		letter-spacing: 0.02em;
	}

	.scroll-anime p::after {
		height: 125px;
	}

	.top_first_logo_sp {
		max-width: 37.6%;
		max-height: 90vh;
	}

	.top_first_logo_sp {
		transition: 1s;
	}

	.stop-300 .top_first_logo_sp {
		opacity: 0;
	}

	.top_first_logo {
		margin: 28px auto 0;
		display: none;
	}

	.top_first_container {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	.top_first_text {
		flex: 0 1 auto;
		width: fit-content;
		writing-mode: vertical-rl;
		text-align: start;
		font-size: .24rem;
		display: none;
	}

	.top_first_text.hide {
		opacity: 0;
	}

	.top_first_imgsp {
		padding-top: 100px;
		background-color: #006CC6;
		display: block;
		width: 100%;
	}

	.top_first_imgsp_img {
		width: 100%;
	}

	.top_first_img {
		display: none;
	}

	.top-second-logo {
		opacity: 0;
		transform: translateY(-200px);
		transition: 2s;
		bottom: 68.5vw;
		width: 80px;
	}

	.topmian-pointer {
		transition: opacity 1s 1.5s;
	}

	.top_first.stop-300 .top-second-logo {
		opacity: 1;
		transform: translateY(0px);
	}

	.top_first.stop-300 .topmian-pointer.fv-sp {
		opacity: 0;
	}

	.top_first.stop100 .top-second-logo {
		opacity: 0;
	}

	.top_first.stop100 .topmian-pointer.fv-sp {
		opacity: 1;
	}

	#top_first_space.space_on {
		height: 1700px;
	}

	#top_over {
		padding: 0;
		background-image: none;
		background-color: #fff;
	}

	#top_over::before {
		content: none;
	}

	.top-curve {
		position: relative;
		z-index: 111;
		width: calc(100% + 10px);
		vertical-align: bottom;
		margin-bottom: -1px;
		margin-left: -5px;
	}

	.top_over_spgray {
        padding-top: 36px;
		padding-bottom: 50px;
		background-image: url(../images/top/top_over_bgsp.jpg);
		background-position: top center;
		background-size: cover;
		background-repeat: no-repeat;
		text-align: center;
	}

	.over_head {
		display: none;
	}

	.over_head_onimg {
		display: block;
		opacity: 0;
		text-align: center;
		font-family: 'Noto Serif JP', serif;
		font-weight: 500;
		font-size: .24rem;
		letter-spacing: -.01rem;
		line-height: 1.75;
		width: 100%;
		position: absolute;
		left: 0;
		bottom: calc(112vw + 50px);
		bottom: calc(107vw + (((100dvh - 107vw - 128px) / 1.6)));
		color: #fff;
		transition: 1s;
		transform: translateY(200px);
	}

	.top_first.stop100 .over_head_onimg {
		opacity: 1;
		transform: translateY(0px);
	}

	.over_head_lg_onimg {
		font-size: .24rem;
	}

	.over_text {
		margin-top: 0;
		line-height: 2;
	}

	.over_text_block {
		margin-bottom: 20px;
		display: block;
		text-align: center;
	}

	.top_over_spwhite {
		padding: 40px 25px 80px;
		background-color: #fff;
	}

	.over_pre {
		margin: 0 auto;
	}

	.over_list {
		margin-top: 25px;
		padding: 0 5px;
	}

	.over_link {
		margin-top: 50px;
	}

	/*
  .over_link{
    margin: 50px auto 0;
    padding: 15px 10px;
    width: 100%;
  }
  .over_link_text1{
    font-size: .13rem;
  }
  .over_link_text2{
    font-size: .16rem;
  }*/
}