@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap');
.en_EB { font-family: "EB Garamond", serif; }
.mainvisual {
    position: relative;
    z-index: 0;
    overflow: hidden;
}
.mainvisual .mv_ttl {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 23%;
    left: 15%;
    z-index: 4;
    transition: all 1s ease-in-out;
    transition-delay: 6s;
    opacity: 0;
    visibility: hidden;
}
.mainvisual .mv_ttl.mv_first {
    left: 50%;
    transform: translateX(-50%);
    transition-delay: 0.5s;
    z-index: 1;
	width: 18%;
	top: 0;
	height: 100vh;
	display: flex;
	align-items: center;
	padding-bottom: 130px;
}
.mainvisual .mv_img {
    transition: all 1.5s ease-in-out;
    transition-delay: 3s;
    opacity: 0;
    visibility: hidden;
    z-index: 2;
    position: relative;
}
.mainvisual .mv_img .img02 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    transition: all 1s ease-in-out;
    transition-delay: 4.5s;
}
.is_loaded .mainvisual .mv_ttl,
.is_loaded .mainvisual .mv_img,
.is_loaded .mainvisual .mv_img .img02 {
    opacity: 1;
    visibility: visible;
}
.is_loaded .first_out .mv_ttl.mv_first {
	opacity: 0;
	visibility: hidden;
	transition-delay: 0s;
}
@media screen and (max-width: 1024px) {
	.mainvisual .mv_ttl.mv_first {
		height: 100%;
		padding-bottom: 0;
	}
}
@media screen and (max-width: 767px) {
	.mainvisual .mv_ttl {
		top: 14%;
        top: 9%;
		transform: translateX(-50%) !important;
		width: 41.5%;
		left: 50%;
	}
	.mainvisual .mv_ttl.mv_first {
		width: 50%;
		top: 0;
		height: 100vh;
		padding-bottom: 60px;
		max-height: 100%;
	}
}

.staff_wrap {
	background: #f2f0ee;
	padding: 0 40px;
	overflow: hidden;
}
.bg_white { background: #fff; }
@media screen and (max-width: 1024px) {
	.staff_wrap {
		padding: 0 15px;
	}
}

.greeting {
	padding: 80px 0 60px;
	text-align: center;
}
.greeting h2 {
	font-size: 3.5rem;
	letter-spacing: 0.1em;
	margin-bottom: 45px;
	text-align: center;
}
.greeting .introduce {
	font-size: 1.5rem;
	line-height: 2.3;
	text-align: center;
}
.greeting .time_box {
	background: #7a736e;
	color: #fff;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1/1;
	width: clamp(110px,10vw,168px);;
	height: clamp(110px,10vw,168px);;
	border-radius: 50%;
	font-size: clamp(3.2rem,3.1547619vw,5.3rem);
	line-height: 1;
	letter-spacing: 0;
	margin-bottom: 30px;
}
.greeting .time_box .sm { font-size: 45.2%; }
@media screen and (max-width: 1024px){
	.greeting .introduce {
		font-size: 1.2rem;
		line-height: 2;
		letter-spacing: 0;
	}
}
@media screen and (max-width: 767px){
	.greeting {
		padding: 40px 0 30px;
	}
	.greeting h2 {
		font-size: 2rem;
		letter-spacing: 0.05em;
		margin-bottom: 25px;
	}
}

.thankyou {
	padding: 60px 15px 55px;
	text-align: center;
}
.thankyou .ttl {
	width: clamp(210px,21.547619vw,362px);
	margin: 0 auto;
	position: relative;
	z-index: 0;
	margin-bottom: -30px;
}
.thankyou .txt {
	display: inline-block;
	color: #7a736e;
	padding-left: 60px;
	position: relative;
	margin-top: 0;
	letter-spacing: 0.15em;
	font-size: 2.3rem;
	line-height: 1;
	z-index: 1;
}
@media screen and (max-width: 767px) {
	.thankyou {
		padding: 30px 15px 35px;
	}
	.thankyou .txt {
		padding-left: 0;
		letter-spacing: 0.05em;
		font-size: 1.8rem;
	}
	.thankyou .ttl {
		margin-bottom: -20px;
	}
}

.staff_voice {
	padding-bottom: 0;
}
.vertical_align {
	-webkit-writing-mode: vertical-rl;
	-moz-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	-ms-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
	display: flex;
	align-items: center;
	white-space: nowrap;
}
.staff_slider {
	width: calc(100% + 80px);
	margin-left: -40px;
}
.staff_voice .item_row {
	display: flex;
	flex-wrap: wrap;
}
.staff_voice .ttl {
	font-size: clamp(1.5rem,1.66666vw,2.8rem);
	letter-spacing: 0.15em;
	line-height: 2;
}
.staff_voice .ttl .large {
	font-size: 129%;
	line-height: 1;
}
.staff_voice .txt {
	/* background: #84b288; */
	display: flex;
	justify-content: center;
	align-items: flex-end;
	font-size: 1.5rem;
	font-size: clamp(1rem,0.892857vw,1.5rem);
	letter-spacing: 0.01em;
	line-height: 1.64;
	/* clip-path: polygon(calc(100% - 34px) 0, 100% calc(0% + 34px), 100% 100%, 0 100%, 0 0); */
	overflow: hidden;
	/* order: 10; */
}
.staff_voice .txt.vertical_align { align-items: center; }
.staff_voice .txt p {
	clip-path: polygon(calc(100% - 34px) 0, 100% calc(0% + 34px), 100% 100%, 0 100%, 0 0);
	background: #84b288;
	position: relative;
	z-index: 0;
	padding: 45px 20px;
	color: #fff;	
}
.staff_voice .txt p {
	font-size: 110%;
}
.staff_voice .txt:not(.vertical_align) p { padding-right: 5px; }
.staff_voice .txt_large p { font-size: 167%; }
.staff_voice .txt_med p { font-size: 127%; }
.staff_voice .txt_med02 p { font-size: 113%; }
.staff_voice .txt_blue p {
	background: #0296d5;
}
.staff_voice .txt_pupple p {
	background: #708bba;
}
/* .staff_voice .img { order: 10; } */
@media screen and (max-width: 1024px) {
	.staff_slider {
		width: calc(100% + 30px);
		margin-left: -15px;
	}
	.staff_voice .txt p {
		padding: 15px;
		letter-spacing: -0.05em;
		clip-path: polygon(calc(100% - 14px) 0, 100% calc(0% + 14px), 100% 100%, 0 100%, 0 0);
	}
}
/* .ani_updown {
	transition: opacity 0.5s ease-in-out;
}
.ani_updown.is_in {
	transition: all 0.25s linear;
} */
.staff_slider {
	position: relative;
	z-index: 0;
	padding-top: 25vh;
	overflow: hidden;
}
.staff_ttl {
	position: absolute;
	min-height: 100vh;
	top: 0;
	left: 0;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 10;
}
.is_fixed .staff_ttl {
	position: fixed;
}
.is_end .staff_ttl {
	position: absolute;
	bottom: 0;
	top: auto;
}
.staff_ttl:before {
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
	content: "";
	top: 0;
	left: 0;
	right: 0;
	z-index: -1;
	position: absolute;
	bottom: 70%;
	opacity: 0;
	transition: all 0.5s ease-in-out;
}
.staff_ttl:after {
	display: none;
	background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
	content: "";
	top: 55%;
	left: 0;
	right: 0;
	z-index: -1;
	position: absolute;
	bottom: 0;
	transition: all 0.5s ease-in-out;
}
.is_fixed .staff_ttl:before,
.is_fixed .staff_ttl:after {
	opacity: 1;
}
.is_end .staff_ttl:after {
	opacity: 0;
}
.slider_item {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 19.6%;
	align-items: flex-start;
}
.slider_item + .slider_item {
	padding-top: 60px;
}
.slider_item .item_row {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 60px 0;
}
.slider01 .img01 {
	width: 36.8%;
	margin-bottom: 80px;
}
.slider01 .img02 {
	width: 58.5%;
	margin-top: 90px;
	margin-left: 2%;
}
.slider01 .img03 {
	width: 29.1%;
	margin-bottom: 60px;
}
.slider01 .img04 {
	width: 58.8%;
}
.slider01 .img05 {
	width: 40%;
	margin-top: -15%;
}
.slider01 .img06 {
	width: 47.1%;
	margin-top: 50px;
}
.slider01 .txt01 {
	width: 47%;
	margin-top: 30%;
}
.slider01 .txt02 {
	width: 25.7%;
	margin-top: 75px;
}
.slider01 .txt03 {
	width: 28.9%;
	margin-left: 8%;
}

.slider02 .img01 {
	width: 29.1%;
	margin-top: -80px;
}
.slider02 .img02 {
	width: 58.1%;
}
.slider02 .img03 {
	width: 62.3%;
}
.slider02 .img04 {
	width: 56.9%;
}
.slider02 .img06 {
	width: 36.9%;
}
.slider02 .txt01 {
	width: 25.7%;
	margin-top: 100px;
}
.slider02 .txt02 {
	width: 32.9%;
	margin-top: 7%;
}
.slider02 .txt02 p {
	padding-right: 5px;
	width: 100%;
}
.slider02 .txt03 {
	width: 38.4%;
	margin-left: 10%;
}

.slider03 .img01 {
	width: 36.9%;
	margin-top: -50px;
}
.slider03 .img02 {
	width: 53.6%;
	margin-top: -100px;
}
.slider03 .img03 {
	width: 42.3%;
	margin-top: 10%;
}
.slider03 .img04 {
	width: 43.7%;
	margin-top: -100px;
}
.slider03 .img05 {
	width: 33.33%;
	margin-left: 15%;
}
.slider03 .txt01 {
	width: 49.9%;
	margin-top: calc(-10% - 60px);
}
.slider03 .txt02 {
	width: 28.9%;
	margin-right: 7%;
}

.slider04 .img01 {
	width: 61.4%;
	margin-left: 34%;
	margin-right: 4.6%;
}
.slider04 .img02 {
	width: 61.4%;
}
.slider04 .img03 {
	width: 50.8%;
	margin-left: auto;
	margin-right: 4%;
	margin-top: calc(-10% - 70px);
}
.slider04 .img04 {
	width: 34.4%;
	margin-top: 10%;
}
.slider04 .img06 {
	width: 51.3%;
	margin-top: -80px;
}
.slider04 .img07 {
	width: 52.1%;
}
.slider04 .img08 {
	width: 31.8%;
	margin-top: -15%;
}
.slider04 .img05 {
	width: 56.8%;
}
.slider04 .txt02 {
	width: 40.4%;
	margin-right: 10%;
	margin-top: 5%;
}
.slider04 .txt02 p { padding-right: 5px; }
.slider04 .txt03 {
	width: 30.9%;
	margin-top: 15%;
}
.slider04 .txt03 p {
	width: 100%;
}
.slider04 .txt01 {
	width: 25.7%;
	margin-left: 7%;
	margin-top: 120px;
}
.slider04 .txt04 {
	width: 25.7%;
	margin-left: 7%;
}
.tab_only {
	display: none !important;
}
.sp_flex {
	display: flex;
	flex-wrap: wrap;
	gap: 30px 0;
	align-items: flex-start;
}
@media screen and (max-width: 1024px) {
	.slider03 .txt01 p,
	.slider02 .txt03 p { letter-spacing: -0.05em; padding-right: 8px; }
}
@media screen and (max-width: 1000px) {
	.slider_item {
		grid-template-columns: 1fr;
		gap: 0;
	}
	/* .staff_ttl { opacity: 0; visibility: hidden; } */
	.staff_ttl .ttl {
		-webkit-writing-mode: unset;
		-moz-writing-mode: unset;
		-ms-writing-mode: unset;
		-ms-writing-mode: unset;
		writing-mode: unset;
		display: block;
  		text-align: center;
		text-shadow: 0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff, 0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff, 0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff,0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff,0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff,0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff,0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff,0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff,0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff,0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff,0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff,0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff;
	}
	.staff_ttl:before {
		bottom: 75%;
	}
	.staff_voice .ttl {
		font-size: clamp(1.5rem,3.3vw,2.8rem);
	}
	.staff_voice .txt {
		font-size: clamp(1rem,1.893vw,1.5rem);
	}
	.tab_only {
		display: block !important;
	}
	.pc_only {
		display: none !important;
	}
	.staff_slider {
		padding-top: 10vh;
	}
	.slider_item .item_row {
		gap: 30px 0;
	}

	.slider_item + .slider_item {
		padding-top: 30px;
	}
	.staff_voice .txt p {
		padding: 20px 10px;
	}
	.staff_voice .txt.vertical_align p {
		padding-right: 25px;
		padding-left: 25px;
	}
	.staff_voice .txt:not(.vertical_align) p {
		width: 100%;
		display: flex;
		justify-content: center;
	}

	.slider01.img02 {
		width: 61.4%;
		margin-top: 0;
		margin-left: 30px;
	}
	.slider01.img03 {
		width: 37.6%;
		margin-bottom: 0;
		margin-left: auto;
	}
	.slider01.txt03 {
		width: 35.8%;
		margin-left: 30px;
		margin-right: auto;
		/* max-width: 230px; */
		/* margin-top: -30px; */
	}
	.slider01.txt01 {
		width: 34.5%;
		margin-top: -10%;
		margin-right: 30px;
		margin-left: auto;
	}
	.slider01.img01 {
		width: 34%;
		margin-bottom: 0;
		margin-left: auto;
		margin-top: -40%;
	}
	.slider01.img06 {
		width: 41.3%;
		margin: auto 30px 0 0;
	}
	.slider01.txt02 {
		width: 23.4%;
		margin-top: 0;
		margin-left: auto;
		margin-right: 30px;
	}
	.slider01.img04 {
		width: 46%;
		margin-right: auto;
		margin-top: -30px;
	}
	.slider01.img05 {
		width: 41.4%;
		margin: 0 40% 0 auto;
	}

	.slider02.img01 {
		width: 32.8%;
		margin: auto;
		margin-left: 19%;
	}
	.slider02.txt02 {
		width: 34.56%;
		margin-top: 30px;
		margin-left: auto;
	}
	.slider02.img03 {
		width: 59.33%;
		margin-bottom: 0;
		margin-top: -30%;
	}
	.slider02.img04 {
		width: 50.1%;
		margin-right: auto;
		margin-top: -10%;
	}
	.slider02.img02 {
		margin-top: 0;
		width: 49.66%;
		margin-left: auto;
	}
	.slider02.txt01 {
		width: 23.5%;
		margin: auto;
		margin-top: -10%;
	}
	.slider02.img06 {
		width: 40.1%;
		margin-left: auto;
		margin-top: -15%;
	}
	.slider02.txt03 {
		width: 35%;
		margin-left: auto;
		margin-right: 30px;
		margin-top: 30px;
	}

	.slider03.img02 {
		width: 49.8%;
		margin-top: 0;
		margin-left: auto;
		margin-right: 30px;
	}
	.slider03.img01 {
		width: 39.33%;
		margin-top: 100px;
		margin-right: -100px;
		margin-left: 100px;
		margin-bottom: 0;
		z-index: 1;
		position: relative;
	}
	.slider03.img04 {
		width: 44.2%;
		margin-top: -100px;
		margin-right: 20px;
		margin-left: auto;
	}
	.slider03.txt04 {
		width: 23.44%;
		margin: auto;
	}
	.slider03.img03 {
		width: 51.3%;
		margin: 0;
		margin-bottom: 15%;
		margin-top: -15%;
	}
	.slider03.txt01 {
		width: 31.39%;
		margin-top: 50px;
		margin-right: auto;
	}
	.slider03.img05 {
		width: 35.4%;
		margin: auto;
		margin-left: 23%;
	}
	.slider03.txt02 {
		width: 69.9%;
		margin: auto;
	}

	.slider04.img06 {
		width: 35.2%;
		margin: 0 auto;
		margin-top: -15%;
	}
	.slider04.txt02_sp {
		width: 30.4%;
		margin: 0 auto;
		margin-top: 30px;
	}
	.slider04.txt02_sp p {
		padding: 15px 5px 15px 10px;
	}
	.slider04.img02 {
		width: 59.6%;
		margin: 0;
		margin-top: 0;
	}
	.slider04.img05 {
		width: 44.3%;
		margin: 0 0 0 auto;
		margin-top: auto;
	}
	.slider04.img01 {
		width: 53.2%;
		margin: 0;
		margin-top: 0;
	}
	.slider04.img04 {
		width: 36.4%;
		margin: 0 auto 0 0;
		margin-top: 15%;
	}
	.slider04.img03 {
		width: 50.33%;
		margin: 0 auto;
		margin-top: 5%;
	}
	.slider04.txt02 {
		width: 35%;
		margin: 0;
		margin-right: 30px;
	}
	.slider04.txt03 {
		width: 30.4%;
		margin: 0 auto;
		margin-left: 15%;
		margin-top: 50px;
	}
	.slider04.img07 {
		width: 46.3%;
		margin-top: -20%;
	}
	.slider04.img08 {
		width: 45.5%;
		margin-top: -15%;
		margin-left: auto;
	}
	.slider04.txt01 {
		width: 23.5%;
		margin: 0 auto;
		margin-top: -20%;
	}
}
@media screen and (max-width: 767px) {
	.staff_voice .ttl {
		font-size: clamp(1.8rem,3.3vw,2.8rem);
		letter-spacing: 0.05em;
		margin-top: 33vh;
	}
	.slider04.txt03 p,
	.slider03.txt01 p {
		width: 100%;
	}
	.slider01.img05 {
		margin-top: -80px;
	}
	.slider04.txt03 {
		margin-top: 20px;
	}
	.slider01.txt01 {
		margin-top: 0;
	}
	.slider01.img01 {
		margin-top: -110px;
	}
	.slider02.img03 {
		margin-top: 30px;
	}
	.slider01.img06 {
		margin-top: 30px;
	}
	.slider02.txt01 {
		margin-top: -20%;
	}
	.slider02.txt02 {
        margin-top: 7%;
    }
	.slider03.img01 {
		margin-top: 40%;
		margin-left: 30px;
	}
	.slider03.txt01 {
		margin-top: 10px;
	}
	.slider03.txt04 {
        margin-top: 10px;
    }
	.slider03.img02 {
		margin-top: 0;
	}
	.slider03.img03 {
		margin-top: 0;
	}
	.slider04.img05 {
		margin-top: 52%;
	}
	.slider04.img08 {
        margin-top: 11%;
    }
}