@import url('https://fonts.googleapis.com/css2?family=Cinzel&family=Cormorant&family=Shippori+Mincho&display=swap');

/* anim
-------------------------------- */
.inview.zoom_out {
	position: relative;
	overflow: hidden;
	opacity: 1;
}
.inview.zoom_out::after {
	position: absolute;
	content: "";
	width: 200%;
	height: 200%;
	background-image: linear-gradient(135deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0) 30%, #fff 60%, #fff);
	bottom: 0;
	right: 0;
	transform: translate3d(0, 0, 0);
	transition: cubic-bezier(0.215, 0.61, 0.355, 1) 5s;
	transition-delay: 0.3s;
}
.inview.zoom_out.fadeInUp::after {
	transform: translate3d(100%, 100%, 0);
}
.inview.zoom_out > img,
.inview.zoom_out > .step_anim {
	transform: scale(1.1);
	opacity: 0;
	transition: cubic-bezier(0.215, 0.61, 0.355, 1) 2s;
	transition-delay: 0.3s;
}
.inview.zoom_out.fadeInUp > img,
.inview.zoom_out.fadeInUp > .step_anim {
	transform: scale(1);
	opacity: 1;
}

.inview.text_anim {
	opacity: 1;
}
.inview.text_anim span {
	opacity: 0;
	transition: cubic-bezier(0.215, 0.61, 0.355, 1) 2s;
}
.inview.text_anim.fadeInUp span {
	opacity: 1;
}
.inview.text_anim span:nth-of-type(2) {
	transition-delay: .05s;
}
.inview.text_anim span:nth-of-type(3) {
	transition-delay: .1s;
}
.inview.text_anim span:nth-of-type(4) {
	transition-delay: .15s;
}
.inview.text_anim span:nth-of-type(5) {
	transition-delay: .2s;
}
.inview.text_anim span:nth-of-type(6) {
	transition-delay: .25s;
}
.inview.text_anim span:nth-of-type(7) {
	transition-delay: .3s;
}
.inview.text_anim span:nth-of-type(8) {
	transition-delay: .35s;
}
.inview.text_anim span:nth-of-type(9) {
	transition-delay: .4s;
}
.inview.text_anim span:nth-of-type(10) {
	transition-delay: .45s;
}
.inview.text_anim span:nth-of-type(11) {
	transition-delay: .5s;
}
.inview.text_anim span:nth-of-type(12) {
	transition-delay: .55s;
}
.inview.text_anim span:nth-of-type(13) {
	transition-delay: .6s;
}
.inview.text_anim span:nth-of-type(14) {
	transition-delay: .65s;
}
.inview.text_anim span:nth-of-type(15) {
	transition-delay: .7s;
}
.inview.text_anim span:nth-of-type(16) {
	transition-delay: .75s;
}
.inview.text_anim span:nth-of-type(17) {
	transition-delay: .8s;
}
.inview.text_anim span:nth-of-type(18) {
	transition-delay: .85s;
}
.inview.text_anim span:nth-of-type(19) {
	transition-delay: .9s;
}
.inview.text_anim span:nth-of-type(20) {
	transition-delay: .95s;
}
.inview.text_anim span:nth-of-type(21) {
	transition-delay: 1s;
}
.inview.text_anim span:nth-of-type(22) {
	transition-delay: 1.05s;
}
.inview.text_anim span:nth-of-type(23) {
	transition-delay: 1.1s;
}
.inview.text_anim span:nth-of-type(24) {
	transition-delay: 1.15s;
}
.inview.text_anim span:nth-of-type(25) {
	transition-delay: 1.2s;
}
.inview.text_anim span:nth-of-type(26) {
	transition-delay: 1.25s;
}
.inview.text_anim span:nth-of-type(27) {
	transition-delay: 1.3s;
}
.inview.text_anim span:nth-of-type(28) {
	transition-delay: 1.35s;
}
.inview.text_anim span:nth-of-type(29) {
	transition-delay: 1.4s;
}
.inview.text_anim span:nth-of-type(30) {
	transition-delay: 1.45s;
}
.inview.text_anim span:nth-of-type(31) {
	transition-delay: 1.5s;
}
.inview.text_anim span:nth-of-type(32) {
	transition-delay: 1.55s;
}
.inview.text_anim span:nth-of-type(33) {
	transition-delay: 1.6s;
}
.inview.text_anim span:nth-of-type(34) {
	transition-delay: 1.65s;
}
.inview.text_anim span:nth-of-type(35) {
	transition-delay: 1.7s;
}
.inview.text_anim span:nth-of-type(36) {
	transition-delay: 1.75s;
}
.inview.text_anim span:nth-of-type(37) {
	transition-delay: 1.8s;
}
.inview.text_anim span:nth-of-type(38) {
	transition-delay: 1.85s;
}
.inview.text_anim span:nth-of-type(39) {
	transition-delay: 1.9s;
}

.inview.move_top {
	transform: translateY(6rem);
	opacity: 0;
	transition: cubic-bezier(0.215, 0.61, 0.355, 1) 1s;
}
.inview.move_top.fadeInUp {
	transform: translateY(0px);
	opacity: 1;
}

@keyframes step_anim {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-100%);
	}
}
@keyframes main_line {
	0% {
		top: 0;
		height: 0;
	}
	50% {
		top: 0;
		height: 100%;
	}
	50.01% {
		top: auto;
		bottom: 0;
		height: 100%;
	}
	100% {
		top: auto;
		bottom: 0;
		height: 0;
	}
}

/* more
-------------------------------- */
main .more {
	display: block;
	width: 13.4rem;
	font-size: 1.2rem;
	color: #D0D0D0;
	padding: .3rem 0;
	letter-spacing: .3em;
}
main .more::after {
	content: '';
	display: block;
	background: #D0D0D0;
	width: .1rem;
	position: absolute;
	top: 0;
	right: 0;
	opacity: 0;
	transition: opacity .3s;
	transition-delay: .9s;
}
main .more.inview.fadeInUp::after {
	opacity: 1;
}
main .more.inview.fadeInUp::after {
	animation-fill-mode: forwards;
	animation-duration: 2s;
	animation-name: main_line;
	animation-iteration-count: infinite;
}
main .btn_anim {
	width: 100%;
	display: block;
	font-size: 1.2rem;
	opacity: 1;
	text-align: center;
	letter-spacing: .3em;
	padding: 2.5rem 1.5rem;
	box-sizing: border-box;
	position: relative;
	transition: background .3s, color .3s;
}
main .btn_anim::before {
	content: '';
	display: block;
	pointer-events: none;
	position: absolute;
	right: 0;
	bottom: 0;
	border-bottom: .1rem solid #585858;
	border-left: .1rem solid #585858;
	width: 0;
	height: 0;
	transition: width cubic-bezier(0.215, 0.61, 0.355, 1) .6s, height cubic-bezier(0.215, 0.61, 0.355, 1) .3s;
	transition-delay: 0s, .6s;
	box-sizing: border-box;
}
main .btn_anim::after {
	content: '';
	display: block;
	pointer-events: none;
	position: absolute;
	left: 0;
	top: 0;
	border-top: .1rem solid #585858;
	border-right: .1rem solid #585858;
	width: 0;
	height: 0;
	transition: width cubic-bezier(0.215, 0.61, 0.355, 1) .6s, height cubic-bezier(0.215, 0.61, 0.355, 1) .45s;
	transition-delay: .9s, 1.5s;
	box-sizing: border-box;
}
main .btn_anim.inview.fadeInUp::before,
main .btn_anim.inview.fadeInUp::after {
	width: 100%;
}
main .btn_anim.inview.fadeInUp::before {
	height: 100%;
}
main .btn_anim.inview.fadeInUp::after {
	height: 69.3548%;
}
main .btn_anim.inview.fadeInUp.comp::after {
	transition-delay: 0s;
}
@media (hover:hover) {
	main .btn_anim:hover {
		background: #E3B8AF;
		color: #fff;
	}
	main .btn_anim:hover {
		background: #E3B8AF;
		color: #fff;
	}
	main .btn_anim.inview.fadeInUp.comp:hover::after {
		height: 100%;
	}
}
@media only screen and (max-width: 768px) {
	main .more {
		width: 11.5rem;
		font-size: 1rem;
	}
}

/* hover
-------------------------------- */
main .hover .opacity {
	opacity: 0;
	visibility: hidden;
	transition: 0.4s ease-in-out;
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	text-align: center;
	z-index: 3;
	font-size: 0;
}
main .hover .opacity a {
	display: inline-block;
	color: #fff;
	margin-bottom: 35px;
	transition: 0.4s ease-in-out;
}
main .hover .opacity a:last-of-type {
	margin-bottom: 0;
}
main .hover .opacity a span {
	display: block;
	font-size: 13px;
	letter-spacing: 0.06em;
}
main .hover .opacity a span:after {
	content: "";
	display: block;
	width: 68px;
	height: 1px;
	background: #fff;
	margin: 8px auto 12px;
}
main .hover .opacity a em {
	display: block;
	font-size: 13px;
	letter-spacing: 0.06em;
}
main .hover:before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.25);
	z-index: 2;
	opacity: 0;
	visibility: hidden;
	transition: 0.4s ease-in-out;
}
main .hover:hover:before {
	opacity: 1;
	visibility: visible;
}
main .hover:hover .opacity {
	opacity: 1;
	visibility: visible;
}
@media (hover:hover) {
	main .hover .opacity a:hover {
		opacity: 0.7;
	}
}

/* main
-------------------------------- */
main {
	font-family: "Shippori Mincho", serif;
	position: relative;
	margin-top: 0 !important;
	overflow: hidden;
}
main h2 {
	box-sizing: border-box;
}
main .en01 {
	font-family: "Cinzel", serif;
}
main .en02 {
	font-family: "Cormorant", serif;
}
main .main {
	background: #fff;
	position: relative;
	z-index: 2;
	padding: 12rem 0 35.5rem;
}
main .main .inner {
	max-width: 109rem;
	width: 95%;
	position: relative;
	margin: -1.2rem auto 0;
	padding-bottom: 5rem;
}
main .main figure {
	width: 40.5505%;
	margin: 0 auto;
}
main .main h1 {
	writing-mode: vertical-rl;
	color: #585858;
	font-size: 1.4rem;
	letter-spacing: .3em;
	position: absolute;
	right: .3rem;
	top: 16.5rem;
}
main .main h1 > span:nth-of-type(1) {
	transition-delay: 1.2s !important;
}
main .main h1 > span:nth-of-type(2) {
	transition-delay: 1.6s !important;
}
main .main .scroll {
	width: .1rem;
	height: 10rem;
	position: absolute;
	right: .9rem;
	bottom: 0;
}
main .main .scroll::before {
	content: '';
	display: block;
	width: .1rem;
	background: #585858;
	position: absolute;
	top: 0;
	left: 0;
	animation-fill-mode: forwards;
	animation-duration: 2s;
	animation-name: main_line;
	animation-iteration-count: infinite;
}
@media only screen and (max-width: 768px) {
	main .main {
		padding: 8.4rem 0 16.2rem;
	}
	main .main .inner {
		width: 87.234%;
		margin: 0 auto;
		padding-bottom: 12.7rem;
	}
	main .main figure {
		width: 100%;
	}
	main .main h1 {
		writing-mode: lr-tb;
		text-align: center;
		line-height: 1.7143;
		margin-bottom: 1.5rem;
		position: relative;
		right: auto;
		top: auto;
	}
	main .main .scroll {
		right: 0;
		left: 0;
		margin: 0 auto;
	}
}

/* intro
-------------------------------- */
main .intro {
	text-align: center;
	background: #fff;
	padding-bottom: 38.4rem;
	position: relative;
	z-index: 2;
}
main .intro h2 {
	font-size: 2.4rem;
	letter-spacing: .3em;
	padding-left: .3em;
	margin-bottom: 38.2rem;
}
main .intro p {
	font-size: 1.4rem;
	letter-spacing: .3em;
	padding-left: .3em;
	line-height: 4.29;
}
@media only screen and (max-width: 768px) {
	main .intro {
		padding-bottom: 14.3rem;
	}
	main .intro h2 {
		font-size: 1.8rem;
		margin-bottom: 14.2rem;
	}
	main .intro p {
		font-size: 1.2rem;
		line-height: 4.75;
	}
}

/* quatle
-------------------------------- */
main .quatle {
	padding-bottom: 22.8rem;
	background: #fff;
	position: relative;
	z-index: 2;
}
main .quatle .inner {
	max-width: 107.2rem;
	width: 95%;
	margin: 0 auto;
	position: relative;
}
main .quatle h2 {
	text-align: center;
	font-size: 2rem;
	letter-spacing: .3em;
	padding-left: .3em;
	margin-bottom: 6.3rem;
}
main .quatle .img01 {
	width: 36.6604%;
	margin: 0 0 0 11.5672%;
}
main .quatle .img02 {
	width: 21.5485%;
	margin: -17.4rem 11.5672% 0 auto;
}
main .quatle .img02 .step_anim img {
	width: 600%;
}
main .quatle .img02.fadeInUp .step_anim img {
	animation: step_anim 3s steps(6) infinite;
}
main .quatle .img03 {
	width: 43.75%;
	margin: 8rem 0 0 28.1716%;
}
main .quatle .more {
	position: absolute;
	right: 0;
	top: 0;
	margin-top: 19.9851%;
}
@media only screen and (max-width: 768px) {
	main .quatle {
		padding-bottom: 9.2rem;
	}
	main .quatle .inner {
		width: 100%;
		display: block;
		margin: 0 auto;
	}
	main .quatle h2 {
		font-size: 1.4rem;
		margin-bottom: 3.2rem;
	}
	main .quatle .img01 {
		width: 82.9787%;
		margin: 0 auto;
	}
	main .quatle .img02 {
		width: 61.4362%;
		margin: 4.7rem 0 0;
	}
	main .quatle .img03 {
		width: 100%;
		margin: 4.8rem 0 0;
	}
	main .quatle .more {
		position: relative;
		right: auto;
		top: auto;
		margin: 1.5rem 1.8rem 0 auto;
	}
}

/* cloche
-------------------------------- */
main .cloche {
	background: #fff;
	position: relative;
	z-index: 2;
}
main .cloche h2 {
	text-align: center;
	font-size: 2rem;
	letter-spacing: .3em;
	padding-left: .3em;
	margin-bottom: 6.3rem;
}
main .cloche .inner {
	max-width: 107.2rem;
	width: 95%;
	margin: 0 auto;
	position: relative;
}
main .cloche .img01 {
	width: 21.7351%;
	margin: 0 auto 22.8rem;
}
main .cloche .img02 {
	width: 60.1679%;
	margin: 0 auto 13.2rem;
}
main .cloche .img02 .step_anim img {
	width: 500%;
}
main .cloche .img02.fadeInUp .step_anim img {
	animation: step_anim 3s steps(5) infinite;
}
main .cloche .img03 {
	width: 36.6604%;
	margin: 0 0 0 10.541%;
}
main .cloche .img04 {
	width: 36.6604%;
	margin: -27.4254% 10.541% 8rem auto;
}
main .cloche .img05 img {
	width: 100%;
}
main .cloche .more {
	position: absolute;
	right: 0;
	top: 0;
	margin-top: 12.3403%;
}
@media only screen and (max-width: 768px) {
	main .cloche {
		z-index: 3;
	}
	main .cloche h2 {
		font-size: 1.4rem;
		margin-bottom: 3.2rem;
	}
	main .cloche .inner {
		width: auto;
		position: static;
	}
	main .cloche .img01 {
		width: 45.2128%;
		margin: 0 auto 8.8rem;
	}
	main .cloche .img02 {
		width: 77.3936%;
		margin: 0 auto 9.1rem;
	}
	main .cloche .img03 {
		width: 82.9787%;
		margin: 0 0 0 auto;
	}
	main .cloche .img04 {
		width: 71.0106%;
		margin: 4.8rem 0;
	}
	main .cloche .img05 img {
		width: 100%;
	}
	main .cloche .more {
		right: 1.7rem;
		top: calc(100% + 1.5rem);
		color: #EBD6D2;
		margin-top: 0;
	}
	main .cloche .more::after {
		background: #EBD6D2;
	}
}

/* pixi
-------------------------------- */
main .pixi {
	background: #E3B8AF;
	color: #fff;
	padding: 23.2rem 0 22.7rem;
	position: relative;
	z-index: 2;
}
main .pixi .inner {
	max-width: 107.2rem;
	width: 95%;
	margin: 0 auto;
	position: relative;
}
main .pixi h2 {
	text-align: center;
	font-size: 2rem;
	letter-spacing: .3em;
	padding-left: .3em;
	margin-bottom: 6.3rem;
}
main .pixi .img01 {
	width: 29.291%;
	margin: 0 17.9104% 0 auto;
}
main .pixi .img02 {
	width: 23.8806%;
	margin: -4.944% 0 0 14.2724%;
}
main .pixi .img02 .step_anim img {
	width: 600%;
}
main .pixi .img02.fadeInUp .step_anim img {
	animation: step_anim 3s steps(6) infinite;
}
main .pixi .img03 {
	width: 36.6604%;
	margin: -12.1269% 14.2724% 0 auto;
}
main .pixi .more {
	position: absolute;
	top: .1rem;
	right: 0;
	color: #EBD6D2;
}
main .pixi .more::after {
	background: #EBD6D2;
}
@media only screen and (max-width: 768px) {
	main .pixi {
		padding: 14.7rem 0 11.6rem;
	}
	main .pixi .inner {
		width: 100%;
		display: flex;
		flex-direction: column;
	}
	main .pixi h2 {
		width: 100%;
		font-size: 1.4rem;
		margin-bottom: 5rem;
		order: 1;
	}
	main .pixi .img01 {
		width: 62.5%;
		margin: 0;
		order: 2;
	}
	main .pixi .img02 {
		order: 0;
		width: 68.0851%;
		margin: 0 0 5.1rem auto;
	}
	main .pixi .img03 {
		width: 78.7234%;
		margin: 4.8rem auto 1.5rem;
		order: 3;
	}
	main .pixi .more {
		order: 4;
		position: relative;
		top: auto;
		right: auto;
		margin: 0 1.7rem 0 auto;
	}
}

/* gisell
-------------------------------- */
main .gisell {
	padding: 23.3rem 0 0;
	background: #fff;
	position: relative;
	z-index: 2;
}
main .gisell .inner {
	max-width: 107.2rem;
	width: 95%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0 auto;
	position: relative;
}
main .gisell h2 {
	width: 100%;
	text-align: center;
	font-size: 2rem;
	letter-spacing: .3em;
	padding-left: .3em;
	margin-bottom: 6.3rem;
}
main .gisell .img01 {
	width: 36.6604%;
	margin: 0 0 0 14.6455%;
}
main .gisell .img02 {
	width: 26.5858%;
	margin: 0 0 0 7.4627%;
}
main .gisell h3 {
	width: 100%;
	text-align: right;
	font-size: 2rem;
	letter-spacing: .3em;
	margin: 7.5rem 0 7.1rem;
	position: relative;
	right: -.3em;
	line-height: 2.5;
}
main .gisell .img03 {
	width: 47.3882%;
	margin: 0 auto;
}
main .gisell .more {
	position: absolute;
	right: 0;
	bottom: 0;
	margin-bottom: 34.65%;
}
@media only screen and (max-width: 768px) {
	main .gisell {
		padding: 11.4rem 0 0;
	}
	main .gisell .inner {
		width: auto;
		flex-direction: column;
	}
	main .gisell h2 {
		font-size: 1.4rem;
		order: 0;
		margin-bottom: 3.2rem;
	}
	main .gisell .img01 {
		order: 4;
		width: 61.4362%;
		margin: 0 0 0 auto;
	}
	main .gisell .img02 {
		order: 2;
		width: 80.0532%;
		margin: 0 auto;
	}
	main .gisell h3 {
		order: 3;
		width: 80.0532%;
		margin: 4.2rem auto 4.1rem;
		text-align: left;
		font-size: 1.4rem;
		right: auto;
		line-height: 2.1;
	}
	main .gisell .img03 {
		order: 1;
		width: 100%;
		margin-bottom: 4.8rem;
	}
	main .gisell .more {
		order: 5;
		position: relative;
		right: auto;
		bottom: auto;
		margin: 1.5rem 1.7rem 0 auto;
	}
}

/* adage
-------------------------------- */
main .adage {
	padding: 23.2rem 0 0;
	background: #fff;
	position: relative;
	z-index: 2;
}
main .adage .inner {
	max-width: 107.2rem;
	width: 95%;
	margin: 0 auto;
	position: relative;
}
main .adage h2 {
	width: 100%;
	text-align: center;
	font-size: 2rem;
	letter-spacing: .3em;
	padding-left: .2em;
	margin-bottom: 6.3rem;
}
main .adage .img01 {
	width: 36.6604%;
	margin: 0 0 0 4.0112%;
}
main .adage .img02 {
	width: 36.6604%;
	margin: -16.1381% 4.0112% 0 auto;
}
main .adage .more {
	position: absolute;
	top: 0;
	right: 0;
	margin-top: 19.7761%;
}
main .adage h3 {
	font-size: 2rem;
	letter-spacing: .3em;
	position: absolute;
	bottom: 0;
	left: 4.0112%;
	margin-bottom: 18.4%;
}
@media only screen and (max-width: 768px) {
	main .adage {
		padding: 11.9rem 0 0;
	}
	main .adage .inner {
		width: auto;
	}
	main .adage h2 {
		font-size: 1.4rem;
		margin-bottom: 3.2rem;
	}
	main .adage .img01 {
		width: 82.9787%;
		margin: 0 auto;
	}
	main .adage .img02 {
		width: 61.4362%;
		margin: 0 0 0 8.5106%;
	}
	main .adage .more {
		position: relative;
		top: auto;
		right: auto;
		margin: 1.5rem 1.7rem 5.4rem auto;
	}
	main .adage h3 {
		font-size: 1.4rem;
		text-align: center;
		position: relative;
		bottom: auto;
		left: auto;
		margin-bottom: 4.9rem;
	}
}

/* branc
-------------------------------- */
main .branc {
	padding: 22.8rem 0 0;
	background: #fff;
	position: relative;
	z-index: 2;
}
main .branc .inner {
	max-width: 107.2rem;
	width: 95%;
	margin: 0 auto;
	position: relative;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
main .branc .img01,
main .branc .img02 {
	width: 35.0746%;
}
main .branc h2 {
	width: 100%;
	text-align: center;
	font-size: 2rem;
	letter-spacing: .3em;
	padding-left: .2em;
	margin: 10.4rem 0 10.3rem;
}
main .branc .img03 {
	width: 47.3881%;
}
main .branc .more {
	position: absolute;
	right: 0;
	bottom: 0;
	margin-bottom: 34.7015%;
}
@media only screen and (max-width: 768px) {
	main .branc {
		padding: 14.7rem 0 0;
	}
	main .branc .inner {
		width: auto;
		display: block;
	}
	main .branc .img01,
	main .branc .img02 {
		width: 100%;
	}
	main .branc h2 {
		font-size: 1.4rem;
		margin: 5.1rem 0 5rem;
	}
	main .branc .img03 {
		width: 82.9787%;
		margin: 0 0 0 auto;
	}
	main .branc .more {
		position: relative;
		right: auto;
		bottom: auto;
		margin: 1.5rem 1.7rem 0 auto;
	}
}

/* seizon
-------------------------------- */
main .seizon {
	padding-bottom: 30.5rem;
}
main .seizon::before {
	content: '';
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: url(../img/seizon_bg_01.jpg) no-repeat center center / cover;
}
main .seizon .box {
	padding: 22.8rem 0 10rem;
	background: #fff;
	position: relative;
	z-index: 2;
	margin-bottom: 30.9rem;
}
main .seizon .inner {
	max-width: 107.2rem;
	width: 95%;
	margin: 0 auto;
	position: relative;
}
main .seizon .img01 {
	width: 35.0746%;
	margin: 0 auto;
}
main .seizon h2 {
	width: 100%;
	color: #F0F0F0;
	text-align: center;
	font-size: 2rem;
	letter-spacing: .3em;
	padding-left: .2em;
	margin-bottom: 10.3rem;
}
main .seizon .img02 {
	width: 47.3881%;
	margin: 0 auto;
}
main .seizon .img02 .step_anim img {
	width: 500%;
	margin-bottom: -.1rem;
}
main .seizon .img02.fadeInUp .step_anim img {
	animation: step_anim 3s steps(5) infinite;
}
main .seizon .more {
	position: absolute;
	right: 0;
	bottom: 0;
	margin-bottom: 34.6082%;
	color: #fff;
}
main .seizon .more::after {
	background: #fff;
}
@media only screen and (max-width: 768px) {
	main .seizon {
		padding-bottom: 35.6rem;
	}
	main .seizon::before {
		background-image: url(../img/seizon_bg_01-sp.jpg);
	}
	main .seizon .box {
		padding: 11.6rem 0 0;
		margin-bottom: 34.8rem;
	}
	main .seizon .inner {
		width: auto;
	}
	main .seizon .img01 {
		width: 100%;
	}
	main .seizon h2 {
		font-size: 1.4rem;
		margin-bottom: 8.3rem;
	}
	main .seizon .img02 {
		width: 82.9787%;
	}
	main .seizon .more {
		position: relative;
		right: auto;
		bottom: auto;
		margin: 1.5rem 1.7rem 0 auto;
	}
}

/* chaine
-------------------------------- */
main .chaine {
	padding: 22.8rem 0;
	background: #fff;
	position: relative;
	z-index: 2;
}
main .chaine .inner {
	max-width: 107.2rem;
	width: 95%;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	position: relative;
}
main .chaine .img01,
main .chaine .img02 {
	width: 29.291%;
}
main .chaine .img01 {
	margin-right: 14.9254%;
}
main .chaine h2 {
	width: 100%;
	text-align: center;
	font-size: 2rem;
	letter-spacing: .3em;
	padding-left: .2em;
	margin: 29.2rem 0 6.3rem;
}
main .chaine .img03,
main .chaine .img04 {
	width: 36.6604%;
}
main .chaine .img04 {
	margin: 38.9925% 0 0 5.597%;
}
main .chaine h3 {
	font-size: 2rem;
	letter-spacing: .3em;
	line-height: 2.5;
	position: absolute;
	left: 4%;
	bottom: 0;
	margin-bottom: 14.85%;
}
main .chaine .more {
	position: absolute;
	right: 0;
	bottom: 0;
	margin-bottom: 79.8507%;
}
@media only screen and (max-width: 768px) {
	main .chaine {
		padding: 8.5rem 0 11.6rem;
	}
	main .chaine .inner {
		width: auto;
		flex-direction: column;
	}
	main .chaine .img01,
	main .chaine .img02 {
		width: 50.5319%;
		margin: 0 5.8511% 8.5rem auto;
		order: 0;
	}
	main .chaine .img01 {
		width: 50%;
		order: 1;
		margin: 0 0 0 10.6383%;
	}
	main .chaine h2 {
		font-size: 1.4rem;
		text-transform: uppercase;
		margin: 9.1rem 0 3.2rem;
		order: 2;
	}
	main .chaine .img03,
	main .chaine .img04 {
		width: 82.9787%;
		order: 3;
	}
	main .chaine .img04 {
		width: 100%;
		margin: 0;
		order: 5;
	}
	main .chaine h3 {
		width: 82.9787%;
		font-size: 1.4rem;
		line-height: 2.05;
		position: relative;
		left: auto;
		bottom: auto;
		margin: 4.3rem auto 4.1rem;
		text-align: right;
		order: 4;
	}
	main .chaine .more {
		order: 6;
		position: relative;
		right: auto;
		bottom: auto;
		margin: 1.5rem 1.7rem 0 auto;
	}
}

/* dress
-------------------------------- */
main .dress {
	background: #fff;
	position: relative;
	z-index: 2;
	padding-bottom: 15.7rem;
}
main .dress .inner {
	max-width: 108rem;
	width: 95%;
	margin: 0 auto;
	border-top: .1rem solid #585858;
}
main .dress h2 {
	font-size: 1.4rem;
	letter-spacing: .3em;
	padding-left: .3em;
	line-height: 1.7143;
	text-align: center;
	margin: 19.8rem 0 20.1rem;
}
main .dress h3 {
	text-align: center;
	font-size: 2rem;
	letter-spacing: .3em;
	padding-left: .3em;
	margin-bottom: 8.3rem;
}
main .dress h4 {
	text-align: center;
	font-size: 1.4rem;
	letter-spacing: .3em;
	padding-left: .3em;
	margin: 2.5rem 0 2.4rem;
}
main .dress .list {
	display: flex;
	flex-wrap: wrap;
	gap: 6rem 6.66665%;
}
main .dress .item {
	width: 28.8889%;
}
main .dress .box + .box {
	margin-top: 16.4rem;
}
@media only screen and (max-width: 768px) {
	main .dress {
		padding-bottom: 2rem;
	}
	main .dress .inner {
		width: auto;
		border-top: 0;
	}
	main .dress .inner::before {
		content: '';
		display: block;
		width: 20rem;
		height: .1rem;
		background: #585858;
		margin: 0 auto;
	}
	main .dress h2 {
		margin: 11rem 0 11.2rem;
	}
	main .dress h3 {
		font-size: 1.4rem;
		margin-bottom: 2rem;
	}
	main .dress .list {
		width: 89.3617%;
		display: block;
		margin: 0 auto 0 2.1277%;
		padding-top: 3rem;
	}
	main .dress .list .slick-list {
		overflow: visible;
	}
	main .dress .list::after,
	main .dress .list .slick-list::after {
		content: '';
		display: block;
		clear: both;
	}
	main .dress .item {
		width: 100%;
		margin-left: 6.383vw;
		float: left;
	}
	main .dress .list .slick-dots {
		top: 0;
		bottom: auto;
		left: 3.3vw;
		display: flex;
		justify-content: flex-start;
	}
	main .dress .list .slick-dots li button:before {
		font-size: 5px;
		color: #F0F0F0;
		opacity: 1;
	}
	main .dress .list .slick-dots li.slick-active button:before {
		color: #E3B8AF;
	}
	main .dress .list .slick-dots li {
		margin: 0 2px;
	}
	main .dress .list .slick-next,
	main .dress .list .slick-prev {
		width: 2rem;
		height: .5rem;
		background: url(../img/dress_arrow.svg) no-repeat left top / 100% auto;
		position: absolute;
		top: .7rem;
		right: -.2rem;
		transform: none;
		z-index: 10;
	}
	main .dress .list .slick-next::before,
	main .dress .list .slick-prev::before {
		display: none;
	}
	main .dress .list .slick-prev {
		transform: scale(-1, 1);
		right: 3.7rem;
		left: auto;
	}
	main .dress .list .slick-disabled {
		opacity: 0;
	}
	main .dress .box + .box {
		margin-top: 6.1rem;
	}
}

main .btn_top {
	position: fixed;
	width: 6rem;
	height: 6rem;
	right: 4rem;
	bottom: 4rem;
	z-index: 10;
	opacity: 0;
	pointer-events: none;
	transition: opacity .3s;
}
main .btn_top.show {
	opacity: 1;
	pointer-events: all;
}
@media (hover:hover) {
	main .btn_top:hover {
		opacity: .6;
	}
}
@media only screen and (max-width: 768px) {
	main .btn_top {
		right: 1.6rem;
		bottom: 1.6rem;
	}
}

main .inquiry {
	background: #fff;
	position: relative;
	z-index: 2;
}
@media only screen and (max-width: 768px) {
	main .inquiry {
		padding-top: 5rem;
	}
}
.topic-path,
footer {
	position: relative;
}