@charset "UTF-8";
/********************/
/*ローディング*/
/********************/
@keyframes fadeOut {
	from {
		opacity: 1;
	}
	to {
		display: none;
		opacity: 0;
		z-index: -11;
	}
}
#loader {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: rgba(255, 255, 255, 0.92);
	/* ヘッダーより前面に */
	z-index: 9999;
}
/* 読み込み完了後に「loaded」を付与する */
#loader.loaded {
	animation: fadeOut 3s forwards;
}
/********************/
/*変える場合はこの下*/
/********************/
.loader-logo-wrap {
	position: absolute;
	top: 40%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
}

.loader-logo {
	width: 120px;
	height: 120px;
	filter: brightness(0) saturate(100%) invert(23%) sepia(34%) saturate(1027%) hue-rotate(110deg) brightness(30%) contrast(90%);
	animation: logoPulse 1.8s ease-in-out infinite;
}

.loader-brand {
	display: grid;
	place-items: center;
	width: 92px;
	height: 92px;
	margin: 0 auto;
	border: 1px solid #26302d;
	border-radius: 50%;
	color: #26302d;
	font-family: Georgia, serif;
	font-size: 3rem;
	animation: logoPulse 1.8s ease-in-out infinite;
}

@keyframes logoPulse {
	0% {
		transform: scale(0.9);
		opacity: 0.7;
	}
	50% {
		transform: scale(1.05);
		opacity: 1;
	}
	100% {
		transform: scale(0.9);
		opacity: 0.7;
	}
}

.ml9 {
	position: absolute;
	top: calc(40% + 90px);
	left: 50%;
	transform: translate(-50%, 0);
	font-weight: 200;
	font-size: 2em;
	font-family: 'FINALOLD', sans-serif;
	text-align: center;
	color: #26302d;
}

.loader-tagline {
	position: absolute;
	top: calc(40% + 142px);
	left: 0;
	width: 100%;
	color: #b45537;
	font-size: .68rem;
	letter-spacing: .16em;
	text-align: center;
}

.ml9 .text-wrapper {
  position: relative;
  display: inline-block;
  padding-top: 0.2em;
  padding-right: 0.05em;
  padding-bottom: 0.1em;
  overflow: hidden;
}

.ml9 .letter {
  transform-origin: 50% 100%;
  display: inline-block;
  line-height: 1em;
}

.loader-brand-logo {
	display: block;
	width: min(300px, 72vw);
	height: auto;
	animation: logoPulse 1.8s ease-in-out infinite;
}