/* CSS Document */

@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Shippori+Mincho:wght@400;700&family=Zen+Kaku+Gothic+New&display=swap");

/* -----------------------------------------
contents
-----------------------------------------*/

:root {
	--text-color: #fff;
	--page-line: #c5c5c5;
	--button-line: #fff;
	--mincho-regular: 400;
	--mincho-bold: 700;
	--en-medium: 500;
	--en-bold: 700;
}

* {
	box-sizing: border-box;
}

body {
	background-color: #000;
	font-family: "Shippori Mincho", serif;
	font-style: normal;
	color: var(--text-color);
	line-height: 2.4;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	letter-spacing: 0.05em;
	font-feature-settings: "palt";
	/*word-break: keep-all;
	line-break: strict;
	word-wrap: break-word;
	overflow-wrap: break-word;
	font-feature-settings: "palt";*/
}

figure {
	margin: 0;
	padding: 0;
}

img {
	width: 100%;
	height: auto;
	vertical-align: top;
}

.mincho {
	font-family: "Shippori Mincho", serif;
	font-style: normal;
}

.gothic {
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 400;
	font-style: normal;
}

.en {
	font-family: "Cormorant Garamond", serif;
	font-optical-sizing: auto;
	font-style: normal;
}

#kanzaContainer {
	width: 100%;
	max-width: 750px;
	margin: auto;
	overflow: hidden;
}

a:hover {
	opacity: 0.8;
}

a {
	transition: opacity 0.3s ease-out;
}

a:link {
	color: #ffffff;
	text-decoration: none;
}

a:visited {
	color: #ffffff;
	text-decoration: none;
}

a:hover {
	color: #ffffff;
	text-decoration: none;
}

a:active {
	color: #ffffff;
	text-decoration: none;
}

.pc {
	display: block;
}

.sp {
	display: none;
}

/*----------------------------------*/
/*ぼかし*/
.inview-blur {
	opacity: 0;
	-moz-transition: -moz-transform 0.3s linear;
	-webkit-transition: -webkit-transform 0.3s linear;
	-o-transition: -o-transform 0.3s linear;
	-ms-transition: -ms-transform 0.3s linear;
	transition: transform 0.3s linear;
	-webkit-animation-duration: 2.5s;
	animation-duration: 2.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}
.blur {
	-webkit-animation-name: imageBlur;
	animation-name: imageBlur;
	opacity: 1;
	transition: 0.8s;
}
@-webkit-keyframes imageBlur {
	from {
		opacity: 0;
		-webkit-filter: blur(15px);
		-moz-filter: blur(15px);
		-ms-filter: blur(15px);
		-o-filter: blur(15px);
		filter: blur(15px);
	}

	to {
		opacity: 1;
		-webkit-filter: blur(0px);
		-moz-filter: blur(0px);
		-ms-filter: blur(0px);
		-o-filter: blur(0px);
		filter: blur(0px);
	}
}
@keyframes imageBlur {
	from {
		opacity: 0;
		-webkit-filter: blur(15px);
		-moz-filter: blur(15px);
		-ms-filter: blur(15px);
		-o-filter: blur(15px);
		filter: blur(15px);
	}

	to {
		opacity: 1;
		-webkit-filter: blur(0px);
		-moz-filter: blur(0px);
		-ms-filter: blur(0px);
		-o-filter: blur(0px);
		filter: blur(0px);
	}
}

/*----------------------------------*/

@keyframes fadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.fadeinBlock {
	opacity: 0;
}

.fadeIn {
	animation-name: fadeIn;
	animation-duration: 8s;
	animation-fill-mode: both;
}

.Sec__inner--lv1 {
	max-width: 1200px;
	width: 100%;
	margin: 0 auto;
}

.Sec__inner--lv2 {
	max-width: 960px;
	width: 100%;
	margin: 0 auto;
}

.Sec__inner--lv3 {
	max-width: 720px;
	width: 100%;
	margin: 0 auto;
}

.Sec__flex--column {
	display: flex;
}

.Sec__flex--row {
	display: flex;
	flex-direction: column;
}

.Common__text--lead {
	font-size: 24px;
}

.Group__button {
	column-gap: 48px;
	margin-bottom: 15.25%;
}

.Group__button a {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	border: solid 1px var(--button-line);
	width: 100%;
	font-size: 20px;
	font-weight: var(--mincho-regular);
	padding: 10px;
}

.Group__button a::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 20px;
	display: block;
	width: 7px;
	height: 7px;
	border-top: 1px solid var(--button-line);
	border-right: 1px solid var(--button-line);
	transform: translateY(-50%) rotate(45deg);
}

/* 言語切替 */
.lang {
	position: fixed;
	right: 10px;
	display: flex;
	align-items: center;
	column-gap: 5px;
	font-size: 24px;
	font-family: "Cormorant Garamond", serif;
	line-height: 1;
	margin-top: 10px;
	z-index: 100;
}

.lang span {
	font-size: 20px;
	color: #000;
	margin-top: 4px;
	transition: color 0.5s;
}

.lang__txt {
	display: block;
	color: #000 !important;
	line-height: 1;
	text-decoration: none;
	transition: color 0.5s;
}

.lang.is-change span {
	color: var(--text-color) !important;
}

.lang.is-change .lang__txt {
	color: var(--text-color) !important;
}

.lang__active {
	color: #777 !important;
	pointer-events: none;
}

.lang.is-change .lang__active {
	color: #777 !important;
}

/* MainVisual */
.MainVisual.pc {
	width: 100%;
	height: auto;
	margin: 0 auto;

	opacity: 0;
	-webkit-filter: blur(15px);
	-moz-filter: blur(15px);
	-ms-filter: blur(15px);
	-o-filter: blur(15px);
	filter: blur(15px);
}

.MainVisual-blur {
	-webkit-animation-name: imageBlur;
	animation-name: imageBlur;
	-webkit-animation-duration: 2.5s;
	animation-duration: 2.5s;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}

/* .MainVisual__inner {
	position: relative;
	max-width: 1200px;
	width: 100%;
	height: 100%;
	margin: 0 auto;
} */

/* .MainVisual h1 {
	position: absolute;
	top: 67%;
	right: -19%;
	transform: translateY(-50%);
	width: 12.5%;
} */

/* Notice */
.Notice {
	border-bottom: solid 1px var(--page-line);
	padding-top: 12.25%;
	padding-bottom: 15.25%;
}

.Notice__inner {
	max-width: 720px;
	width: 100%;
	margin: 0 auto;
}

.Notice__block--01 {
	position: relative;
	margin-bottom: 12.25%;
}

.Notice__block--01 h2 {
	width: 5.28%;
	margin: 0 auto;
}

.Notice__block--01 p {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 17.36%;
}

/* Anchor */
.Anchor__inner {
	max-width: 1200px;
	height: 100%;
	margin: 0 auto;
}

.Group__anchor {
	display: flex;
	margin: 15.25% 0 13.75%;
}

.Group__anchor li {
	width: 100%;
	font-size: 22px;
	line-height: 1.4;
}

.Group__anchor li a {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 100%;
	text-align: center;
	padding-bottom: 40px;
}

.Group__anchor li a::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	display: block;
	width: 14px;
	height: 14px;
	border-top: 1px solid var(--button-line);
	border-right: 1px solid var(--button-line);
	transform: translateX(-50%) rotate(135deg);
}

.Group__anchor li .en {
	display: block;
	font-size: 24px;
}

.Group__anchor li em {
	display: flex;
	align-items: center;
	height: 100%;
}

/* 商品紹介 */
section {
	padding: 0 30px;
}

.Sec__intro--01 h2 {
	width: 13.88%;
	margin: 0 auto 10%;
}

.Sec__intro--01__inner {
	justify-content: space-between;
	margin-bottom: 15.25%;
}

.Sec__intro--01__inner .Common__text--lead {
	max-width: 600px;
    width: 100%;
}

.Sec__intro--01__inner figure {
	width: calc(100% - 600px - 40px);
}

.Sec__intro--01__inner figure figcaption {
	font-size: 20px;
	text-align: center;
	margin-top: 2%;
}

.Sec__intro--02__visual {
	position: relative;
}

.Sec__intro--02__visual h2 {
	position: absolute;
	top: -19%;
	right: 5%;
	width: 10.47%;
}

.Sec__intro--02 .Common__text--lead {
	margin-bottom: 13.5%;
	padding: 10% calc((100% - 848px) / 2) 0;
}

.Sec__intro--02__component {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	max-width: 746px;
	width: 100%;
	margin: 7.25% auto;
}

.Sec__intro--02__component dt {
	font-size: 24px;
}

.Sec__intro--02__component dd {
	font-size: 20px;
	line-height: 2.6;
}

.Sec__intro--03__visual {
	position: relative;
}

.Sec__intro--03__visual h2 {
	position: absolute;
	top: -15%;
	left: 5%;
	width: 10.52%;
}

.Sec__intro--03 .Common__text--lead {
	max-width: 720px;
	width: 100%;
	margin: 0 auto 10%;
	padding: 10% 0 0;
}

.Sec__intro--03__component {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	max-width: 884px;
	width: 100%;
	margin: 7.25% auto;
}

.Sec__intro--03__component dt {
	font-size: 24px;
}

.Sec__intro--03__component dd {
	font-size: 20px;
	line-height: 2.6;
}

.Sec__intro--04 h2 {
	width: 10.31%;
	margin: 0 auto 10.5%;
}

.Sec__intro--04__inner {
	justify-content: space-between;
	margin: 10.5% auto;
}

.Sec__intro--04__inner .Common__text--lead {
	max-width: 600px;
	width: 100%;
}

.Sec__intro--04__inner figure {
	width: calc(100% - 600px - 40px);
}

.Sec__intro--04__inner figure figcaption {
	font-size: 20px;
	line-height: 1.8;
	text-align: left;
	margin-top: 2%;
}

.Sec__intro--04 h3 {
	width: 15.63%;
	margin: 10.5% auto;
}

.Sec__intro--04 .Gallery {
}

.Thumb__wrapper {
	display: flex;
	flex-wrap: wrap;
	margin: 50px auto 12.25%;
}

.Thumb__media {
	position: relative;
	width: calc(100% / 6);
	cursor: pointer;
}

.Thumb__media--active::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: block;
	width: calc(100% - 2px);
	height: calc(100% - 2px);
	border: solid 1px #fff;
	z-index: 10;
}

.Sec__intro--04 .Memorial {
	font-size: 24px;
	text-align: center;
}

.Sec__intro--04 .Memorial small {
	font-size: 20px;
}

.Sec__intro--04 .Merchandise {
	font-size: 22px;
	text-align: center;
}

.Sec__intro--04 .Price {
	font-size: 36px;
	font-weight: 700;
	text-align: center;
	margin-bottom: 10.5%;
}

.Sec__intro--04 .Price small {
	font-size: 22px;
}

.Logo__brand {
	margin-bottom: 15.25%;
}

.Logo__brand img {
	display: block;
	width: 58.33%;
	margin: 0 auto;
}

.caution__text {
	font-size: 14px;
	text-align: center;
	margin-bottom: 6.05%;
}

.Logo__company {
	margin-bottom: 10%;
}

.Logo__company img {
	display: block;
	width: 48.61%;
	margin: 0 auto;
}

.Floating__button--wrap {
	/* position: relative;
	height: 0; */
}

.Floating__button {
	/* position: absolute;
	top: 0; */
	position: fixed;
	bottom: 0;
	right: 30px;
	display: flex;
	flex-direction: column;
	row-gap: 20px;
	z-index: 100;
	opacity: 0;
	transform: translateY(30px);
	pointer-events: none;
	transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.Floating__button.is-fixed {
	position: fixed;
	/* top: 50px; */
	bottom: 30px;

	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

.Floating__button a {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--button-line);
	border-radius: 50%;
	font-size: 20px;
	line-height: 1.4;
	text-align: center;
	color: #000;
	width: 125px;
	height: 125px;
}

/* スムースクロールの調整 */
.Sec__intro--01 {
	padding-top: 1%;
}

.Sec__intro--02 {
	padding-top: 6%;
}

.Sec__intro--03 {
	padding-top: 5%;
}

.Sec__intro--04 {
	padding-top: 1%;
}

@media (max-width: 1000px) {
	.Notice__inner {
		max-width: 100%;
		padding: 0 30px;
	}

	.Sec__inner--lv1 {
		width: 100%;
		padding: 0 30px;
	}

	.Sec__inner--lv2 {
		width: 100%;
		padding: 0 30px;
	}

	.Group__button {
		column-gap: 28px;
	}

	/* Anchor */
	.Group__anchor {
		flex-wrap: wrap;
		row-gap: 20px;
		margin-bottom: 23%;
	}

	.Group__anchor li {
		width: 50%;
	}

	.Group__anchor li .en {
		margin-bottom: 10px;
	}

	.Group__anchor li a::after {
		bottom: 20px;
		width: 8px;
		height: 8px;
	}

	/* 商品紹介 */
	.Sec__intro--01__inner {
		flex-direction: column-reverse;
	}

	.Sec__intro--01__inner figure {
		width: 100%;
		margin-bottom: 12%;
	}

	.Sec__intro--01__inner .Common__text--lead {
		max-width: 100%;
	}

	.Sec__intro--02 .Common__text--lead {
		padding: 12% 0 0;
	}

	.Sec__intro--02__component {
		flex-direction: column;
		margin: 9.25% auto;
	}

	.Sec__intro--02__component dt {
		margin-bottom: 2%;
		font-size: 4.27vw;
	}

	.Sec__intro--02__component dd {
		font-size: 3.47vw;
	}

	.Sec__intro--03__component {
		flex-direction: column;
		margin: 9.25% auto;
	}

	.Sec__intro--03__component dt {
		margin-bottom: 2%;
		font-size: 4.27vw;
	}

	.Sec__intro--03__component dd {
		font-size: 3.47vw;
	}

	.Sec__intro--04__inner {
		flex-direction: column;
		margin-top: 12.5%;
	}

	.Sec__intro--04__inner .Common__text--lead {
		max-width: 100%;
	}

	.Sec__intro--04__inner figure {
		width: 100%;
		margin-top: 18%;
	}
}

@media (max-width: 750px) {
	.pc {
		display: none;
	}

	.sp {
		display: block;
	}

	.Sec__inner--lv1 {
		padding: 0;
	}

	.Sec__inner--lv2 {
		padding: 0;
	}

	.Common__text--lead {
		font-size: 3.47vw;
	}

	.Group__button {
		flex-direction: column;
		row-gap: 15px;
		margin-bottom: 22%;
	}

	.Group__button a {
		font-size: 3.47vw;
	}

	/* 言語切替 */
	.lang {
		font-size: 4vw;
	}

	.lang span {
		font-size: 3.2vw;
	}

	.Floating__button {
		left: auto;
		right: 10px;
		transform: translateY(10px);
		row-gap: 10px;
	}

	.Floating__button.is-fixed {
		bottom: 10px;
	}

	.Floating__button a {
		width: 125px;
		height: 125px;
		/* font-size: 2.67vw; */
	}

	/* MainVisual */
	/* .MainVisual h1 {
		top: auto;
		left: 50%;
		bottom: 5%;
		transform: translateX(-50%);
		width: 19.33%;
	} */

	/* .crest {
		position: absolute;
		right: 5%;
		bottom: 5%;
		width: 14.67%;
		z-index: 100;
	} */

	/* Notice */
	.Notice__inner {
		padding: 0 35px;
	}

	.Notice__block--01 h2 {
		width: 7%;
	}

	/* Anchor */
	.Group__anchor {
		flex-wrap: wrap;
		row-gap: 20px;
		margin-bottom: 23%;
	}

	.Group__anchor li {
		width: 50%;
		font-size: 3.2vw;
	}

	.Group__anchor li .en {
		font-size: 3.2vw;
		margin-bottom: 10px;
	}

	.Group__anchor li a::after {
		bottom: 20px;
		width: 8px;
		height: 8px;
	}

	/* 商品紹介 */
	.Sec__intro--01 {
		margin-bottom: 16%;
		padding: 3% 35px 0;
	}

	.Sec__intro--01 h2 {
		width: 28%;
		margin-bottom: 15%;
	}

	.Sec__intro--01__inner figure figcaption {
		font-size: 3.73vw;
		margin-top: 3%;
	}

	.Sec__intro--02 {
		padding: 14% 35px 0;
	}

	.Sec__intro--02__visual h2 {
		width: 17%;
	}

	.Sec__intro--02 .Common__text--lead {
		padding-top: 12%;
	}

	.Sec__intro--03 {
		padding: 13% 35px 0;
	}

	.Sec__intro--03__visual h2 {
		top: -18%;
		width: 16%;
	}

	.Sec__intro--03 .Common__text--lead {
		margin-bottom: 15.5%;
		padding: 12% 0 0;
	}

	.Sec__intro--04 h3 {
		width: 22%;
		margin: 20% auto;
	}

	.Sec__intro--04 {
		padding: 3% 35px 0;
	}

	.Sec__intro--04 h2 {
		width: 17%;
	}

	.Sec__intro--04__inner figure figcaption {
		font-size: 3.73vw;
		margin-top: 3%;
	}

	.Thumb__media {
		width: calc(100% / 3);
	}

	.Sec__intro--04 .Memorial {
		font-size: 4.27vw;
	}

	.Sec__intro--04 .Memorial small {
		display: block;
		font-size: 3.2vw;
	}

	.Sec__intro--04 .Merchandise {
		font-size: 3.47vw;
		text-align: left;
		margin-top: 5%;
	}

	.Sec__intro--04 .Merchandise li {
		line-height: 1.8;
	}

	.Sec__intro--04 .Price {
		font-size: 6.13vw;
		text-align: left;
	}

	.Sec__intro--04 .Price small {
		font-size: 3.47vw;
	}

	.Logo__brand img {
		width: 66%;
	}

	.caution__text {
		font-size: 2.67vw;
		padding: 0 35px;
	}
}

@media (max-width: 450px) {
	.Floating__button a {
		width: calc(125px / 2);
		height: calc(125px / 2);
		font-size: 2.67vw;
	}
}