@charset "UTF-8";
/*----------------------------------------------
 * * reset styles
 * *----------------------------------------------*/
main {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  display: block;
}
/*----------------------------------------------
 * * formatting styles
 * *----------------------------------------------*/
:root {
  --basew: 1100px;
  --gold: #ad8400;
  --brown: #B74C27;
	--brown2: #9A2A11;
  --gradient: linear-gradient(90deg, #c4970a 0%, #e6cc89 24%, #fffeee 53.5%, #e3c880 80%, #c4970a 100%);
	--headerHeight: 110px;
}
html {
  font-size: 62.5%;
  box-sizing: border-box;
}
*, *::before, *::after {
  box-sizing: inherit;
}
body {
  min-width: var(--basew);
	font-family: 'Noto Serif JP', serif;
  font-size: 1.7em;
	font-weight: 400;
  color: #231815;
  font-feature-settings: "palt";
}
@media screen and (max-width: 767px) {
	:root {
		--headerHeight: 70px;
	}
  body {
    min-width: initial;
		width: 100%;
    -webkit-text-size-adjust: 100%;
		font-size: 1.2em;
		overflow-x: hidden;
  }
}
.scroll-prevent {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
}
a {
  color: inherit;
  transition-duration: 0.3s;
	text-decoration: none;
}
_::-webkit-full-page-media, _:future, :root a {
  text-underline-offset: 2px;
}
img {
  border-style: none;
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}
@media (any-hover: hover) {
  a:hover {
    text-decoration: none;
  }
}
@media (any-hover: none) {
  a:active {
    text-decoration: none;
  }
}
ul {
	list-style: none;
}
/*----------------------------------------------
 * * clearfix
 * *----------------------------------------------*/
.clearfix:after {
  content: "";
  display: block;
  clear: both;
}
/*----------------------------------------------
 * * scrollani
 * *----------------------------------------------*/
.scrollani {
  opacity: 0;
  transition-property: opacity, transform;
  transition-duration: 0.8s;
  transition-timing-function: ease;
}
.scrollani.show {
  opacity: 1;
  transform: none;
}
.scrollani--lr {
  transform: translate(-100px, 0);
}
.scrollani--rl {
  transform: translate(100px, 0);
}
.scrollani--up {
  transform: translate(0, 100px);
}
.scrollani--down {
  transform: translate(0, -100px);
}
.scrollani--scaleUp {
  transform: scale(0.5);
}
.scrollani--scaleDown {
  transform: scale(1.5);
}
.scrollani--rotateL {
  transform: rotate(180deg);
}
.scrollani--rotateR {
  transform: rotate(-180deg);
}
@media print {
  .scrollani {
    opacity: 1;
    transform: none;
  }
}
/* ----------------------------------------------
 * * header
 * *----------------------------------------------*/
header {
	background-color: #fff;
	width: 100%;
	position: -webkit-sticky;
	position: sticky;
	z-index: 100;
	left: 0;
	top: 0;
}
header .headerHd {
	width: var(--basew);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
	margin: auto;
}
header .logo img {
	height: 22px;
	width: auto;
	display: block;
	margin: 19px 0;
}
header .text {
	font-size: 2.0rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	color: var(--gold);
	display: flex;
	align-items: center;
}
header .text img {
	width: 20px;
	height: auto;
	display: block;
	margin-right: 5px;
}
header .text a {
	font-size: 2.9rem;
	font-weight: 500;
	letter-spacing: 0.01em;
}
header .contactList {
  display: flex;
  align-items: center;
  font-size: 1.5rem;
  letter-spacing: 0.04em;
}
header .contactList li:nth-child(n+2) {
  margin-left: 10px;
}
header .contactList a {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: 3px;
  width: 220px;
  height: 32px;
  background: linear-gradient(90deg, #8ec43e 0%, #00a84d 100%);
  color: #fff;
  box-shadow: 2px 2px 6px rgba(35, 24, 21, 0.2);
}
header .contactList a strong {
	font-weight: 600;
}
header .contactList .btnMail {
  background: linear-gradient(90deg, #e7534e 0%, #ae3137 42%, #6a0012 100%);
  width: 240px;
  letter-spacing: 0.02em;
}
header .contactList .btnMail strong {
  display: inline-block;
}
header .contactList .btnMail strong::before {
  content: "";
  display: inline-block;
  margin-right: 3px;
  background: url(/img/icon-mail.svg) no-repeat center center;
  background-size: 100% auto;
  width: 1.13em;
  height: 0.8471em;
}
button {
  -webkit-appearance: none;
  appearance: none;
  outline: 0;
  margin: 0;
  padding: 0;
  background-color: #fff;
  border: none;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  cursor: pointer;
  transition-duration: 0.3s;
}
.btnHamburger {
  background-color: #fff;
  border: 1px solid #fff;
  width: 70px;
  height: 70px;
  position: fixed;
  z-index: 101;
  right: 0;
  top: 0;
  display: none;
  justify-content: center;
  align-items: center;
}
.btnHamburger::before, .btnHamburger::after {
  content: "";
  position: absolute;
  width: 70.283%;
  height: 2px;
  right: 14.8585%;
  top: 28.8585%;
  background-color: var(--gold);
  transition-duration: 0.3s;
}
.btnHamburger::after {
  top: 67.7358%;
}
.btnHamburger span {
  display: block;
  width: 70.283%;
  height: 2px;
  background-color: var(--gold);
  transition-duration: 0.3s;
}
.open .btnHamburger {
	background-color: transparent;
	border-color: rgba(255, 255, 255, 0);
}
.open .btnHamburger::before {
	width: 6.9333vw;
	top: 6.5333vw;
	background-color: #ebeaea;
	rotate: -45deg;
}
.open .btnHamburger::after {
	width: 6.9333vw;
	top: 6.5333vw;
	background-color: #ebeaea;
	rotate: 45deg;
}
.open .btnHamburger span {
	background-color: #ebeaea;
	opacity: 0;
}
@media screen and (max-width: 767px) {
	header .headerHd {
		width: 100%;
		height: var(--headerHeight);
		padding: 0 70px 0 4vw;
		align-items: stretch;
		align-content: center;
	}
	header .logo {
		display: none;
	}
	header .text {
		width: 100%;
		order: 2;
		font-size: min(2.3rem, 4.6667vw);
		margin-top: 2px;
		align-items: baseline;
	}
	header .text img {
		width: 0.8889em;
		margin-left: auto;
	}
	header .text a {
		font-size: min(2.8rem, 5.7333vw);
	}
	header .contactList {
		order: 1;
		font-size: 1.1rem;
		width: 100%;
	}
	header .contactList li {
		width: calc(50% - 5px);
		height: 30px;
	}
	header .contactList li a {
		width: 100%;
		height: 100%;
	}
	header .contactList .btnMail {
		width: 100%;
	}
  .btnHamburger {
    display: flex;
  }
}
@media screen and (max-width: 360px) {
	header .text a {
		font-size: 1.9rem;
	}
	header .contactList {
		font-size: 1.0rem;
	}
}
@media screen and (max-width: 320px) {
	header .text {
		letter-spacing: 0;
		font-size: 1.7rem;
	}
	header .text a {
		letter-spacing: 0;
		font-size: 1.8rem;
	}
	header .contactList {
		letter-spacing: 0;
		font-size: 0.9rem;
	}
}
/* ----------------------------------------------
 * * nav
 * *----------------------------------------------*/
nav {
  background: var(--gradient);
  flex: 0 0 100%;
	height: 50px;
}
nav .logo, nav .menu02 {
  display: none;
}
nav ul {
  width: var(--basew);
	height: 100%;
  margin: 0 auto;
  display: flex;
	justify-content: space-between;
  align-items: center;
}
nav li {
	font-size: 1.6rem;
	color:var(--brown);
}
nav li:nth-last-child(-n+2) {
	font-size: 1.7rem;
}
nav li a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	nav {
		display: none;
		position: fixed;
		z-index: 100;
		right: 0;
		top: 0;
		width: 100%;
		height: 100svh;
		padding: 29.0667vw 0 calc(12.8vw + 20px);
		background-color: #9c3741;
		background-image: none;
		overflow: auto;
	}
	nav .logo {
		display: block;
		width: 66.9333%;
		margin: 0 auto 28vw;
	}
	nav .logo img {
		margin: 0;
		height: auto;
	}
	nav ul {
		width: auto;
		display: block;
	}
	nav li {
		text-align: center;
		font-size: 5.3333vw;
		font-family: "Noto Sans JP", sans-serif;
		font-feature-settings: "palt";
		letter-spacing: 0.13em;
		font-weight: 400;
		color: #fff;
	}
	nav :not(.menu02) li:nth-child(n+2) {
		margin-top: 5px;
	}
	nav li:nth-last-child(-n+2) {
		font-size: 5.3333vw;
	}
	nav a {
		display: block;
		padding: 0.5em;
		color: inherit;
	}
	nav .menu02 {
		width: 100%;
		height: 12.8vw;
		position: fixed;
		left: 0;
		bottom: 0;
		display: flex;
		justify-content: center;
		column-gap: 2.666vw;
		font-weight: bold;
		font-size: 4.2667vw;
	}
	nav .menu02 li {
		flex: 0 0 auto;
		width: 40.5333%;
		height: 100%;
		font-size: inherit;
		font-weight: inherit;
	}
	nav .menu02 a {
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: center;
		width: 100%;
		height: 100%;
		background: linear-gradient(0deg, #510000 0%, #8f0000 75%, #c8161d 100%);
		border-radius: 2.1333vw 2.1333vw 0 0;
		color: #fff;
		font-size: inherit;
		box-shadow: 2px 2px 4px rgba(4, 0, 0, 0.5);
	}
	nav .menu02 .icon {
		width: 1.375em;
		margin-right: 2px;
	}
	.open nav {
		display: block;
	}
}
/* ----------------------------------------------
 * * main
 * *----------------------------------------------*/
section {
  padding: 80px 0;
}
.section {
	margin-top: calc(var(--headerHeight) * -1);
	padding-top: var(--headerHeight);
	padding-bottom: 0;
}
.sectionInner {
	padding: 80px 0;
}
section h2 {
	font-size: 3.0rem;
	font-weight: 500;
	line-height: 1.5;
	text-align: center;
	color: var(--brown);
	letter-spacing: 0.15em;
	position: relative;
}
section h2 span {
	display: inline-block;
	position: relative;
	padding-bottom: 5px;
}
section h2 span::before {
	content: "";
	position: absolute;
	width: calc(100% - 0.15em);
	height: calc(100% + 3px);
	left: 0;
	top: 0;
	border-bottom: 3px double #C9A063;
}
@media screen and (max-width: 767px) {
	main {
		width: 100%;
		overflow: hidden;
	}
	section {
		padding: 30px 0;
	}
	.sectionInner {
		padding: 30px 0;
	}
	section h2 {
		font-size: 1.5rem;
	}
}
/* ----------------------------------------------
 * * footoer
 * *----------------------------------------------*/
footer {
  text-align: center;
  color: var(--brown);
  font-size: 1.8rem;
}
footer .copyright {
  background: var(--gradient);
  padding: 28px 0;
  letter-spacing: 0.12em;
}
@media screen and (max-width: 767px) {
  footer {
    font-size: 1rem;
  }
  footer .copyright {
    padding: 15px 0;
  }
}
/* ----------------------------------------------
 * * TOP
 * *----------------------------------------------*/
@keyframes scale {
  0% {
    scale: 0.9 0.9;
  }
  100% {
    scale: 1 1;
  }
}
@keyframes opacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.mainvisual {
  width: 100%;
	height: 853px;
  overflow: hidden;
  background: url(/top-img/main-bg.webp) 50% 0 no-repeat;
	background-size: cover;
	position: relative;
	animation: opacity 1s ease 0s 1 forwards;
}
.mainvisual::before {
	content: "";
	width: 100%;
	height: 3px;
	position: absolute;
	z-index: -1;
	left: 0;
	bottom: 0;
	background: url(/top-img/message-bg.jpg) no-repeat	center top;
	background-size: 100%  auto;
}
.mainvisual .inner {
	height: 100%;
	opacity: 0;
  visibility: hidden;
  transition-duration: 2s;
  transition-property: opacity, visibility;
}
.mainvisual .mvImg {
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.mainvisual .mvImg img {
	position: absolute;
	right: 50%;
	bottom: 50%;
	translate: 50% 50%;
	max-width: none;
	width: auto;
	height: 100%;
}
.mainvisual .lead01 {
	position: absolute;
	right: calc(50% + 260px);
	top: 120px;
	writing-mode: vertical-rl;
	color: #deb85b;
	font-size: 2rem;
	line-height: 1.995;
	letter-spacing: 0.21em;
	text-shadow: 0 0 3px rgba(32, 0, 0, 1), 0 0 10px rgba(32, 0, 0, 1), 0 0 20px rgba(32, 0, 0, 1);
}
.mainvisual .lead01 > span {
	margin-top: 0.5em;
}
.mainvisual .lead01 > span span {
	margin-top: -0.5em;
}
.mainvisual .lead02 {
	position: absolute;
	right: calc(50% + 389px);
	top: 127px;
	writing-mode: vertical-rl;
	width: 1em;
	color: #fff;
	font-size: 3rem;
	line-height: 1.05;
	letter-spacing: 0.27em;
	text-shadow: 0 0 10px rgba(32, 0, 0, 0.5), 0 0 20px rgba(32, 0, 0, 0.5);
}
.mainvisual .lead02 ruby > rt {
	text-align: center;
}
.mainvisual.show .inner {
  opacity: 1;
  visibility: visible;
  animation: scale 18s ease 0s 1 forwards;
}
@media screen and (max-width: 767px) {
	.mainvisual {
		background: url(/top-img/main-bg-sp.webp) 50% 0;
		background-size: 100% 100%;
		height: 167.4667vw;
	}
	.mainvisual::before {
		display: none;
	}
	.mainvisual .lead01 {
		right: 50%;
		top: 104.8vw;
		translate: 50% 0;
		writing-mode: horizontal-tb;
		text-align: center;
		font-size: 3.78vw;
		line-height: 1.8695;
		letter-spacing: 0.07em;
		white-space: nowrap;
	}
	.mainvisual .lead01 > span {
		margin-top: 0;
		margin-left: 0.5em;
	}
	.mainvisual .lead01 > span span {
		margin-top: 0;
		margin-left: -0.5em;
	}
	.mainvisual .lead02 {
		right: 50%;
		top: 131.5333vw;
		translate: 50% 0;
		writing-mode: horizontal-tb;
		width: auto;
		white-space: nowrap;
		font-size: 5.04vw;
	}
	.mainvisual .lead02 ruby {
		position: relative;
	}
	.mainvisual .lead02 ruby::before {
		content: attr(data-rt);
		position: absolute;
		width: 100%;
		left: 0;
		bottom: calc(100% - 2px);
		text-align: center;
		font-size: 2.352vw;
	}
	.mainvisual .lead02 rt {
		display: none;
	}
}
#message .sectionInner {
	width: 100%;
	min-height: 650px;
	background: url("/top-img/message-bg.jpg") center bottom repeat-x;
	background-size: auto 100%;
	text-align: center;
}
#message h2 {
	margin-bottom: 40px;
}
#message h2 span::before {
	width: calc(100% - 0.4em);
}
#message .text {
	letter-spacing: 0.18em;
	line-height: 1.9;
}
#message .text p + p {
	margin-top: 2em;
}
@media screen and (min-width: 1920px) {
	#message .sectionInner {
		background: url("/top-img/message-bg.jpg") 50% 100% no-repeat;
		background-size: 100% 100%;
	}
}
@media screen and (max-width: 767px) {
	#message .sectionInner {
		min-height: auto;
		background: url("/top-img/message-bg-sp.jpg") 50% 100% no-repeat;
		background-size: 100% 100%;
	}
	#message h2 {
		margin-bottom: 20px;
	}
	#message .text {
		text-align: justify;
		letter-spacing: normal;
		line-height: 1.6;
		margin: 0 10%;
		font-size: max(1.2rem, 3.2vw);
	}
	#message .text p br {
		display: none;
	}
}
#sample {
	background: url("/top-img/sample-bg.jpg") 50% 0 no-repeat;
	width: 100%;
	height: 2405px;
}
@media screen and (min-width: 1920px) {
	#sample {
		background: url("/top-img/sample-bg.jpg") 50% 0 no-repeat;
		background-size: 100% 100%;
	}
}
#sample h2 {
	position: relative;
	z-index: 0;
	color: var(--brown2);
	margin-bottom: 50px;
}
#sample h2::before {
	position: absolute;
	z-index: -1;
	right: 50%;
	bottom: 50%;
	translate: 50% 50%;
	content: "私たち「ビューメモリー」で\Aこんな素敵な写真や動画を作りました！";
	white-space: pre;
	display: inline;
	color: #fff;
	text-shadow: 0 0 50px #fff;
	-webkit-text-stroke: 20px rgba(255, 255, 255, 0.5);
	filter: blur(8px);
}
#sample ul {
	list-style: none;
	position: relative;
	max-width: 755px;
	margin: 0 auto 224px;
}
#sample li {
	width: fit-content;
	position: absolute;
}
#sample li img {
	display: block;
	position: relative;
	z-index: 1;
}
#sample li .shadow {
	position: absolute;
	z-index: 0;
	right: 50%;
	bottom: 50%;
	translate: 50% 50%;
	mix-blend-mode: multiply;
}
#sample li:first-child {
	position: relative;
}
#sample li:first-child .shadow {
	width: 436px;
	right: auto;
	bottom: auto;
	left: -30px;
	top: 20px;
	translate: 0 0;
}
#sample li:nth-child(2) {
	z-index: 3;
	right: 0;
	top: 110px;
}
#sample li:nth-child(2) .shadow {
	width: 440px;
}
#sample li:nth-child(3) {
	position: relative;
	z-index: 2;
	margin-top: 82px;
}
#sample li:nth-child(3) .shadow  {
	width: 446px;
	bottom: -12px;
	translate: 50% 0;
}
#sample li:last-child {
	right: 0;
	bottom: -162px;
}
#sample li:last-child .shadow  {
	width: 457px;
	bottom: -12px;
	translate: 50% 0;
}
#sample .move1 {
	margin-bottom: 50px;
}
#sample [class^="move"] {
	position: relative;
	width: 640px;
	margin-left: auto;
	margin-right: auto;
}
#sample .btnMovie {
	position: absolute;
	border: none;
	background-color: rgba(255, 255, 255, 0);
	right: 50%;
	bottom: 50%;
	translate: 50% 50%;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
}
#sample .btnMovie::before {
	content: "";
	position: absolute;
	right: 50%;
	bottom: 50%;
	translate: 50% 50%;
	width: 10.625%;
	height: 12.7778%;
	background-color: #d93616;
	border-radius: 7px;
	display: flex;
	justify-content: center;
	align-items: center;
}
#sample .btnMovie span {
	display: block;
	background-color: #fff;
	width: 3.125%;
	height: 5.5556%;
	margin-left: 0.7813%;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
}
#sample .playNow .btnMovie {
	display: none;
}
#sample video {
	display: block;
	width: 100%;
	object-fit: cover;
	cursor: pointer;
}
@media screen and (max-width: 767px) {
	#sample {
		background: url("/top-img/sample-bg-sp.jpg") 50% 0 no-repeat;
		background-size: 100% 100%;
		height: auto;
	}
	#sample h2::before {
		text-shadow: 0 0 20px #fff;
		-webkit-text-stroke-width: 10px;
	}
	#sample ul {
		max-width: none;
		margin-bottom: 27.7333vw;
		width: 94%;
	}
	#sample li {
		width: 50.7801%;
		rotate: -5deg;
		transform-origin: left top;
	}
	#sample li:nth-child(even) {
		rotate: 5deg;
		transform-origin: right top;
	}
	#sample li:nth-child(n) .shadow {
		width: 105%;
	}
	#sample li:first-child .shadow {
		width: 110.8939%;
		left: -4vw;
		top: 2.6667vw;
	}
	#sample li:nth-child(2) {
		top: 18.4vw;
	}
	#sample li:nth-child(2) .shadow {
		width: 112.0112%;
	}
	#sample li:nth-child(3) {
		margin-top: 20vw;
	}
	#sample li:nth-child(3) .shadow {
		width: 113.6872%;
		bottom: -1.6vw;
		right: -1.7333vw;
		translate: 0 0;
	}
	#sample li:last-child {
		bottom: -18.1333vw;
	}
	#sample li:last-child .shadow {
		width: 116.4804%;
		bottom: -1.6vw;
		right: -3.2vw;
		translate: 0 0;
	}
	#sample [class^="move"] {
		width: 76%;
		min-width: 300px;
	}
	#sample .move1 {
		margin-bottom: 30px;
	}
	#sample .btnMovie::before {
		border-radius: 0.9333vw;
	}
}
@media screen and (max-width: 375px) {
	#sample div img {
		max-width: 100%;
		height: auto;
	}
}
#trouble {
	background: linear-gradient(90deg, rgba(165,163,162,1) 0%, rgba(165,163,162,1) 50%, rgba(239,239,239,1) 70%);
	width: 100%;
	padding: 0;
}
#trouble .boxIn {
	background: url("/top-img/trouble-bg.webp") 50% 0 no-repeat;
	height: 730px;
	padding: 0;
	margin: auto;
	position: relative;
}
#trouble .textBox {
	width: 660px;
	position: absolute;
	left: calc(50% - 117px);
	top: 70px;
}
#trouble h2 {
	color: #000;
	text-shadow: 0 0 5px #fff,
	             0 0 10px #fff,
	             0 0 15px #fff,
               0 0 20px #fff,
		           0 0 25px #fff,
               0 0 30px #fff,
	             0 0 35px #fff,
               0 0 40px #fff;
	margin-bottom: 50px;
}
#trouble h2 br {
	display: none;
}
#trouble dl {
	width: 665px;
	height: 510px;
	background-color: #fff;
	box-shadow: 10px 10px 0 #9FA0A0;
}
#trouble dt {
	font-size: 2.4rem;
	font-weight: 500;
	letter-spacing: 0.15em;
	color: #C9A063;
	text-align: center;
	padding: 60px 0 50px;
	position: relative;
}
#trouble dt span {
	border-bottom: 1px solid;
}
#trouble dt img {
	position: absolute;
	top: 35px;
	right: 25px;
	width: 155px;
	height: auto;
}
#trouble dd {
	font-size: 1.9rem;
	min-height: 28px;
	letter-spacing: 0.1em;
	background: url("/top-img/icon-check.svg") no-repeat 0 0;
	background-size: 25px auto;
	padding-left: 40px;
	padding-top: 5px;
	margin: 0 0 20px 35px;
}
#trouble dd br {
	display: none;
}
@media screen and (max-width: 767px) {
	#trouble {
		background: rgba(165,163,162,1);
	}
	#trouble .boxIn {
		background: url("/top-img/trouble-bg-sp.webp") 50% 0 no-repeat;
		background-size: 100% auto;
		height: auto;
		padding-bottom: 30px;
	}
	#trouble .textBox {
		width: 100%;
		top: 0;
		left: 0;
		position: relative;
	}
	#trouble h2 {
		padding-top: 3em;
		padding-left: 9em;
		margin-bottom: 2em;
		letter-spacing: 0.11em;
		line-height: 1.2;
	}
	#trouble h2 br {
		display: block;
	}
	#trouble dl {
		width: 76%;
		min-width: 285px;
		height: auto;
		background-color: #fff;
		box-shadow: 5px 5px 0 #C9CACA;
		margin: auto;
		padding-bottom: 10px;
	}
	#trouble dt {
		font-size: 1.5rem;
		padding: 20px 0 1em;
	}
	#trouble dt span {
		border-bottom: 1px solid;
	}
	#trouble dt img {
		position: absolute;
		top: 34px;
		right: 12px;
		width: 69px;
		height: auto;
	}
	#trouble dd {
		font-size: max(1.2rem, 3.2vw);
		font-weight: 600;
		line-height: 1.5;
		min-height: 15px;
		letter-spacing: 0.1em;
		background: url("/top-img/icon-check.svg") no-repeat 0 7px;
		background-size: 12px auto;
		padding-left: 20px;
		margin: 0 20px 5px 20px;
	}
	#trouble dd br {
		display: block;
	}
}
#satsuei {
	background: url("/top-img/satsuei-bg.jpg") no-repeat 50% 100%;
	height: 635px;
	padding: 60px 0 0;
	text-align: center;
}
@media screen and (min-width: 1920px) {
	#satsuei {
		background: url("/top-img/satsuei-bg.jpg") no-repeat 50% 100%;
		background-size: 100% 100%;
	}
}
#satsuei .text1 {
	font-size: 2.5rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	line-height: 1.5;
	margin-bottom: 20px;
}
#satsuei .text1 + img {
	display: block;
	margin: auto auto 40px;
	width: 75px;
	height: auto;
}
#satsuei .textBox {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 3.0rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	margin-bottom: 110px;
}
#satsuei .textBox img {
	width: 490px;
	height: auto;
}
#satsuei .textBox span {
	margin-left: 20px;
	padding-top: 20px;
}
#satsuei .textBox span br {
	display: none;
}
#satsuei .text2 {
	font-size: 1.8rem;
	letter-spacing: 0.18em;
	line-height: 2.2;
}
@media screen and (max-width: 767px) {
	#satsuei {
		background-image: url("/top-img/satsuei-bg-sp.jpg"), url("/top-img/satsuei-bg-sp.jpg");
		background-position: 50% 0, center bottom;
		background-repeat: no-repeat;
		background-size: 100% 335px, cover;
		height: auto;
		padding: 20px 0 min(30px, 8vw);
		text-align: center;
	}
	#satsuei .text1 {
		font-size: 1.4rem;
		line-height: 1.5;
		margin-bottom: 10px;
	}
	#satsuei .text1 + img {
		margin: auto auto 15px;
		width: 38px;
	}
	#satsuei .textBox {
		display: block;
		font-size: 1.6rem;
		margin-bottom: 50px;
	}
	#satsuei .textBox img {
		width: 245px;
		margin-right: 10px;
		margin-bottom: 10px;
	}
	#satsuei .textBox span {
		margin-left: 0;
		padding-top: 0;
	}
	#satsuei .textBox span br {
		display: block;
	}
	#satsuei .text2 {
		text-align: justify;
		font-size: max(1.2rem, 3.2vw);
		letter-spacing: 0.02em;;
		line-height: 1.6;
		width: 77.3333%;
		margin: auto;
	}
	#satsuei .text2 br {
		display: none;
	}
}
#reason .sectionInner {
	background: url("/top-img/reason-bg.jpg") 50% 0 no-repeat;
	height: 1493px;
}
@media screen and (min-width: 1920px) {
	#reason .sectionInner {
		background: url("/top-img/reason-bg.jpg") 50% 0 no-repeat;
		background-size: 100% 100%;
	}
}
#reason h2 {
	color: #fff;
	font-size: 3.2rem;
}
#reason .contentsWr {
	width: 928px;
	margin: auto;
}
#reason .content {
	width: 100%;
	height: 360px;
	background-color: #fff;
	box-shadow: 15px 15px 15px rgba(35,24,21,0.4);
	margin-top: 60px;
	display: flex;
	align-items: center;
}
#reason .content .sideImg {
	width: 508px;
	height: 100%;
}
#reason .content .sideImg img {
	width: 100%;
	height: auto;
	object-fit: cover;
}
#reason .content dl {
	width: 420px;
	padding: 0 30px;
}
#reason .content dt {
	font-size: 2.8rem;
	font-weight: 500;
	letter-spacing: 0.05em;
	line-height: 1.4;
	color: var(--brown);
	margin-bottom: 10px;
}
#reason .content dt img {
	height: 71px;
	width: auto;
}
#reason .content dd {
	font-size: 1.8rem;
	letter-spacing: 0.05em;
	line-height: 1.9;
}
@media screen and (max-width: 767px) {
	#reason .sectionInner {
		background: url("/top-img/reason-bg-sp.jpg") 50% 0 no-repeat;
		background-size: 100% 100%;
		height: auto;
	}
	#reason h2 {
		font-size: 1.6rem;
	}
	#reason .contentsWr {
		width: 300px;
		margin: auto;
	}
	#reason .content {
		width: 100%;
		height: auto;
		min-height: 250px;
		margin-top: 20px;
		display: block;
	}
	#reason .content .sideImg {
		width: 100%;
		height: 128px;
	}
	#reason .content .sideImg img {
		width: 100%;
		height: auto;
		object-fit: cover;
	}
	#reason .content dl {
		width: 100%;
		padding: 15px 17px;
	}
	#reason .content dt {
		font-size: 1.4rem;
		margin: 0 0 5px 10px;
		display: flex;
		align-items: center;
	}
	#reason .content dt img {
		height: 37px;
		margin-right: 20px;
	}
	#reason .content dd {
		font-size: 1.2rem;
		letter-spacing: 0.03em;
		line-height: 1.6;
	}
	#reason .content dd br {
		display: none;
	}
}
#staff .sectionInner {
	background: url("/top-img/staff-bg.jpg") 50% 0 no-repeat;
	height: 1823px;
}
#staff h2 {
	font-size: 3.2rem;
}
@media screen and (min-width: 1920px) {
	#staff .sectionInner {
		background: url("/top-img/staff-bg.jpg") 50% 0 no-repeat;
		background-size: 100% 100%;
	}
}
[class^="staffbox"] {
	position: relative;
	width: 775px;
	margin: 0 auto;
	display: flex;
	justify-content: center;
}
[class^="staffbox"] .photo {
	flex: 0 0 379px;
	position: relative;
	z-index: 0;
}
[class^="staffbox"] .textbox {
	position: relative;
	z-index: 1;
	flex: 0 0 382px;
	height: 366px;
	margin-top: 122px;
	padding-bottom: 25px;
	padding-right: 26px;
	background: url("/top-img/staff1-txt-bg.png") no-repeat 0 0;
	background-size: contain;
	color: #fff;
	transition-delay: 0.5s;
}
[class^="staffbox"] .textbox > .inner {
	padding: 0 40px;
}
[class^="staffbox"] .nameSup {
	font-size: 1.8rem;
	letter-spacing: 0.1em;
	line-height: 1.5;
	margin-bottom: 10px;
}
[class^="staffbox"] .name {
	font-size: 3.2rem;
	letter-spacing: 0.15em;
	margin-bottom: 15px;
}
[class^="staffbox"] .text {
	letter-spacing: 0.01em;
	line-height: 1.8;
}
[class^="staffbox"] .bg01,
[class^="staffbox"] .bg02 {
	position: absolute;
	z-index: 1;
	transition-delay: 1s;
}
.staffbox01 {
	margin-top: 80px;
}
.staffbox01 .photo {
	left: 20px;
}
.staffbox01 .textbox > .inner {
	padding-top: 60px;
}
.staffbox01 .bg01 {
	right: 18px;
	top: 11px;
	width: 213px;
}
.staffbox01 .bg02 {
	right: -136px;
	top: 50px;
	width: 250px;
}
.staffbox02 {
	margin-top: 52px;
	flex-direction: row-reverse;
}
.staffbox02 .photo {
	z-index: 1;
	left: -3px;
}
.staffbox02 .textbox {
	background-image: url("/top-img/staff2-txt-bg.png");
	flex-basis: 390px;
	padding-right: 34px;
	left: 30px;
	z-index: 0;
}
.staffbox02 .textbox > .inner {
	padding-top: 40px;
}
.staffbox02 .bg01 {
	width: 355px;
	left: calc(50% - 228px);
	top: -3px;
}
.staffbox02 .bg02 {
	left: -100px;
	top: -25px;
}
.staffbox03 {
	margin-top: 102px;
}
.staffbox03 .photo {
	flex-basis: auto;
	left: 20px;
}
.staffbox03 .textbox {
	margin-top: 30px;
	left: -20px;
	background-image: url("/top-img/staff3-txt-bg.png");
	flex-basis: 251px;
	height: 230px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}
.staffbox03 .textbox > .inner {
	padding: 1em 0 0;
}
.staffbox03 .bg01 {
	width: 210px;
	left: calc(50% - 50px);
	top: -50px;
}
#staff .chui {
	display: flex;
	justify-content: center;
	letter-spacing: 0.18em;
	line-height: 1.5;
	padding-left: 1.18em;
	text-indent: -1.18em;
	margin-top: 60px;
}
@media screen and (max-width: 767px) {
	#staff .sectionInner {
		background: url("/top-img/staff-bg-sp.jpg") 50% 0 no-repeat;
		background-size: 100% 100%;
		height: auto;
	}
	#staff h2 {
		font-size: 1.6rem;
	}
	[class^="staffbox"] {
		width: 100%;
	}
	[class^="staffbox"] .photo {
		flex-basis: 40.9333%;
	}
	[class^="staffbox"] .textbox {
		flex-basis: 44.8%;
		height: auto;
		padding-right: 3.3333vw;
		padding-bottom: 1.6vw;
		background-size: 100% 100%;
		text-align: justify;
	}
	[class^="staffbox"] .textbox > .inner {
		padding: 4vw min(15px, 4vw);
	}
	[class^="staffbox"] .nameSup {
		font-size: 1.0rem;
		margin-bottom: 3px;
	}
	[class^="staffbox"] .name {
		font-size: 1.6rem;
		margin-bottom: 5px;
	}
	[class^="staffbox"] .text {
		line-height: 1.6;
	}
	.staffbox01 {
		margin-top: 6.4vw;
	}
	.staffbox01 .photo {
		left: 2vw;
	}
	.staffbox01 .textbox {
		background-image: url("/top-img/staff1-txt-bg-sp.png");
		margin-top: 8.9333vw;
		left: 0;
	}
	.staffbox01 .bg01 {
		width: 23.0667%;
		right: 25.2%;
		top: -2.2667vw;
	}
	.staffbox01 .bg02 {
		width: 27.2%;
		right: 2%;
		top: 0;
	}
	.staffbox02 {
		margin-top: 9.0667vw;
	}
	.staffbox02 .photo {
		left: -2vw;
	}
	.staffbox02 .textbox {
		background-image: url("/top-img/staff2-txt-bg-sp.png");
		margin-top: 7.6vw;
		left: 2vw;
	}
	.staffbox02 .bg01 {
		width: 36.2667%;
		left: 25.7333%;
		top: -3.2vw;
	}
	.staffbox02 .bg02 {
		width: 26.6667%;
		left: 6.5333%;
		top: -13.3333vw;
	}
	.staffbox03 {
		margin-top: 5.2vw;
	}
	.staffbox03 .photo {
		flex-basis: 31.8667%;
		left: 7vw;
	}
	.staffbox03 .textbox {
		flex-basis: 35.6%;
		height: 32.6667vw;
		left: 2vw;
		margin-top: 0;
		text-align: center;
	}
	.staffbox03 .textbox > .inner {
		padding: 0;
	}
	.staffbox03 .bg01 {
		width: 22.6667%;
		top: -8vw;
		left: calc(50% + 10.533vw);
	}
	#staff .chui {
		font-size: 1.0rem;
		letter-spacing: normal;
		margin-top: 10px;
		text-indent: -1em;
		padding-left: 1em;
	}
}
#plan .sectionInner {
	background: url("/top-img/plan-bg.jpg") 50% 0 no-repeat;
	padding: 80px 0 0;
}
@media screen and (min-width: 1920px) {
	#plan .sectionInner {
		background: url("/top-img/plan-bg.jpg") 50% 0 no-repeat;
		background-size: 100% 100%;
	}
}
#plan h2 {
	letter-spacing: 0.45em;
	color: #fff;
	margin-bottom: 50px;
}
#plan h2 span::before {
	width: calc(100% - 0.45em);
}
#plan .contentsWr {
	width: 1100px;
	margin: auto;
}
#plan .content {
	width: 1100px;
	height: 370px;
	background-color: #fff;
	padding: 0 20px 0 25px;
	margin-top: 40px;
	display: flex;
	align-items: center;
	align-content: center;
	justify-content: space-between;
	position: relative;
}
#plan .text1 {
	font-size: 2.0rem;
	letter-spacing: 0.08em;
	margin-bottom: 78px;
}
#plan .obiWr {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 580px;
	position: absolute;
	top: 48px;
	left: -8px;
}
#plan .obi {
	width: 350px;
	height: 65px;
	font-size: 3.0rem;
	letter-spacing: 0.1em;
	color: #fff;
	padding: 20px 0 0 30px;
}
#plan .price {
	font-size: 4.6rem;
	font-weight: 500;
	text-align: right;
}
#plan .price span {
	font-size: 2.3rem;
	margin-left: 3px;
}
#plan .supText {
	font-size: 1.6rem;
	margin-left: -0.5em;
}
#plan .iconWr {
	display: flex;
	margin: 10px 0 8px;
}
#plan .iconWr li {
	width: 140px;
	height: 130px;
	display: flex;
	justify-content: center;
	text-align: center;
	align-items: center;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 150px auto;
	font-size: 1.6rem;
	letter-spacing: 0.08em;
	line-height: 1.3;
	margin-right: 10px;
	padding-top: 3px;
}
#plan .chui li {
	font-family: "Noto Sans JP", sans-serif;
	font-size: 1.4rem;
	font-weight: 300;
	color: #231815;
	line-height: 1.3;
	padding-left: 1em;
	text-indent: -1em;
	letter-spacing: 0.05em;
}
#plan .chui li + li {
	margin-top: 3px;
}
.content#plan1 {
	border: 1px solid #785C3B;
}
#plan1 .text1,
#plan1 .price {
	color: #785C3B;
}
#plan1 .obi {
	letter-spacing: 0.2em;
	background: url("/top-img/plan-obi1.svg") no-repeat 0 0;
	background-size: 350px auto;
}
#plan1 .iconWr li {
	background-image: url("/top-img/plan-maru1.webp");
}
.content#plan2 {
	border: 1px solid #727171;
}
#plan2 .text1,
#plan2 .price {
	color: #727171;
}
#plan2 .obi {
	background: url("/top-img/plan-obi2.svg") no-repeat 0 0;
	background-size: 350px auto;
}
#plan2 .iconWr li {
	background-image: url("/top-img/plan-maru2.webp");
}
.content#plan3 {
	border: solid 1px var(--gold);    	/* 内側の線になる一本線の枠線をひく*/
	outline: solid 2px var(--gold);    /* 外側の線になる一本線の枠線をひく*/
	outline-offset: -6px;        /* 外側の線と内側の線の空き具合を調整*/
}
#plan3 .text1,
#plan3 .price {
	color: var(--gold);
}
#plan3 .obi {
	background: url("/top-img/plan-obi3.svg") no-repeat 0 0;
	background-size: 350px auto;
}
#plan3 .iconWr li {
	background-image: url("/top-img/plan-maru3.webp");
}
.content#plan4 {
	border: 1px solid var(--brown);
	height: 270px;
	padding: 20px;
}
#plan4 .obiWr {
	top: 38px;
}
#plan4 .text1,
#plan4 .price {
	color: var(--brown);
}
#plan4 .text1 {
	margin-bottom: 55px;
}
#plan4 .obi {
	background: url("/top-img/plan-obi4.svg") no-repeat 0 0;
	background-size: 350px auto;
}
#plan4 .iconWr li {
	color: #fff;
	background-image: url("/top-img/plan-maru4.webp");
}
#plan4 .flex {
	display: flex;
	align-items: center;
}
#plan4 .flex .chui {
	padding-top: 15px;
}
#plan .contentsWr p.chui {
	letter-spacing: 0.15em;
	color: #fff;
	margin: 40px 0;
}
#plan #nouhin {
	color:rgb(91, 0, 10);
	background: linear-gradient(75deg, rgba(101,10,20,1) 0%, rgba(74,0,0,1) 50%);
	height: 330px;
	display: flex;
	align-items: center;
}
#plan #nouhin dl {
	display: flex;
	align-items: center;
	width: 1100px;
	margin: auto;
	color: #fff;
}
#plan #nouhin dl dt {
	font-size: 3.2rem;
	letter-spacing: 0.54em;
	margin-right: 1.5em;
}
#plan #nouhin dl dd {
	line-height: 1.6471;
}
#plan #nouhin dl dd li {
	text-indent: -1em;
	padding-left: 1em;
}
#plan #nouhin dl dd li:nth-child(n+2) {
	margin-top: 0.5em;
}
@media screen and (max-width: 767px) {
	#plan .sectionInner {
		background: url("/top-img/plan-bg-sp.webp") 50% 0 no-repeat;
		background-size: 100% 100%;
		padding: 30px 0 0;
	}
	#plan h2 {
		margin-bottom: 30px;
	}
	#plan .contentsWr {
		width: 77.3333%;
		min-width: 290px;
	}
	#plan .content {
		width: 100%;
		height: auto;
		padding: 4vw 4.8vw;
		margin-top: 6.6667vw;
		margin-left: 0;
		display: block;
	}
	#plan .text1 {
		font-size: max(1.3rem, 3.4667vw);
		margin-bottom: 2.9231em;
	}
	#plan .obiWr {
		font-size: max(1.5rem, 4vw);
		width: 100%;
		top: 8.1333vw;
		left: -0.2667em;
		padding-right: 20px;
	}
	#plan .obi {
		width: 10.6667em;
		height: 2em;
		font-size: max(1.5rem, 4vw);
		letter-spacing: normal;
		padding: 0.533em 0 0 1.33em;
	}
	#plan .price {
		font-size: max(2.2rem, 6.1333vw);
	}
	#plan .price span {
		font-size: 1.0rem;
		margin-left: 3px;
	}
	#plan .supText {
		margin-left: 0;
		font-size: 1.2rem;
		letter-spacing: normal;
	}
	#plan .supText span {
		display: none;
	}
	#plan .iconWr {
		margin: 10px 0 0 0;
		z-index: 0;
		position: relative;
		padding-top: 29.3333vw;
		background: url("/top-img/plan-img1-sp.webp") no-repeat 50% 0;
		background-size: 100% auto;
	}
	#plan .iconWr li {
		flex: 0 0 auto;
		width: calc(100% / 3);
		height: auto;
		aspect-ratio: 1 / 1;
		background-size: 110% auto;
		background-position: -5% -5%;
		font-size: max(1.0rem, 2.7067vw);
		letter-spacing: 0.04em;
		margin-right: 0;
		padding-top: 0;
	}
	#plan .chui li {
		font-size: 1.0rem;
		letter-spacing: normal;
	}
	#plan .chui li + li {
		margin-top: 3px;
	}
	#plan .img {
		display: none;
	}
	#plan1 .obi {
		background-size: 100% auto;
		letter-spacing: 0.2em;
	}
	#plan2 .obiWr {
		left: -0.3333em;
	}
	#plan2 .obi {
		background-size: 100% auto;
	}
	#plan2 .iconWr {
		background: url("/top-img/plan-img2-sp.webp") no-repeat 50% 0;
		background-size: 100% auto;
	}
	.content#plan3 {
		outline-width: 1px;
		outline-offset: -4px;
	}
	#plan3 .obiWr {
		left: -0.3333em;
	}
	#plan3 .obi {
		background-size: 100% auto;
	}
	#plan3 .iconWr {
		background: url("/top-img/plan-img3-sp.webp") no-repeat 50% 0;
		background-size: 100% auto;
	}
	.content#plan4 {
		height: auto;
	}
	#plan4 .obiWr {
		left: -0.3333em;
	}
	#plan4 .obi {
		background-size: 100% auto;
		letter-spacing: 0.16em;
	}
	#plan4 .flex {
		padding-top: 29.3333vw;
		background: url("/top-img/plan-img4-sp.webp") no-repeat 50% 5px;
		background-size: 100% auto;
		align-items: center;
	}
	#plan4 .iconWr {
		width: calc(100% / 3);
		margin: 0;
		padding-top: 0;
		background: none;
	}
	#plan4 .iconWr li {
		width: 100%;
	}
	#plan4 .flex .chui {
		font-size: 1rem;
		flex: 0 0 auto;
		display: flex;
		flex-wrap: wrap;
		width: 16em;
		padding-top: 6.9333vw;
		margin-left: auto;
	}
	#plan4 .flex .chui li:nth-child(2) {
		margin-top: 0;
		margin-left: 1em;
	}
	#plan4 .flex .chui li:last-child {
		flex: 0 0 100%;
	}
	#plan .contentsWr p.chui {
		line-height: 1.6;
		margin: 20px 0;
	}
	#plan #nouhin {
		background: rgba(74,0,0,1);
		height: auto;
		display: block;
	}
	#plan #nouhin dl {
		display: block;
		min-width: 290px;
		width: 77.3333%;
		padding-top: 20px;
		border-top: 1px solid #fff;
		padding-bottom: 30px;
	}
	#plan #nouhin dl dt {
		font-size: 1.6rem;
		text-align: center;
		margin-right: 0;
		margin-bottom: 15px;
	}
	#plan #nouhin dl dd {
		line-height: 1.6;
	}
	#plan #nouhin dl dd li span {
		display: inline-block;
	}
}
#flow .sectionInner {
	width: 1100px;
	margin: auto;
}
#flow h2 {
	font-size: 3.2rem;
	letter-spacing: 0.4em;
}
#flow h2 span::before {
	width: calc(100% - 0.3em);
}
#flow .contentsWr {
	display: flex;
	justify-content: space-between;
	margin-top: 30px;
}
#flow .content {
	width: 190px;
	position: relative;
	color: var(--brown);
	text-align: center;
}
#flow .content .img {
	width: 100%;
	height: 160px;
	background-color: #F9EEE7;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 15px;
}
#flow .content:nth-of-type(1) .img img {
	width: 90px;
	height: auto;
}
#flow .content:nth-of-type(2) .img img {
	width: 60px;
	height: auto;
}
#flow .content:nth-of-type(3) .img img {
	width: 68px;
	height: auto;
}
#flow .content:nth-of-type(4) .img img {
	width: 83px;
	height: auto;
}
#flow .content:nth-of-type(5) .img img {
	width: 86px;
	height: auto;
}
#flow .content .num {
	font-size: 3.2rem;
	margin-bottom: 20px;
}
#flow .content .num span {
	border-bottom: 1px solid;
}
#flow .content .ttl {
	font-size: 2.5rem;
	letter-spacing: 0.08em;
	margin-bottom: 40px;
}
#flow .content .ttl + .sup {
	position: absolute;
	width: 190px;
	letter-spacing: 0.08em;
	text-align: center;
	top: 260px;
}
#flow .content .text {
	font-family: "Noto Sans JP", sans-serif;
	font-size: 1.6rem;
	letter-spacing: 0.05em;
	line-height: 1.7;
	color: #231815;
	text-align: justify;
}
#flow .content:not(:last-of-type)::after {
	content: "";
	display: block;
	width: 37.5px;
	height: 160px;
	background: url("/top-img/flow-arrow.svg") no-repeat 50% 60px;
	background-size: 20px auto;
	position: absolute;
	top: 0 ;
	left: 192px;
}
@media screen and (max-width: 767px) {
	#flow .sectionInner {
		width: 290px;
	}
	#flow h2 {
		font-size: 1.7rem;
	}
	#flow .contentsWr {
		flex-wrap: wrap;
		width: 100%;
		margin-top: 20px;
	}
	#flow .content {
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	#flow .content .img {
		width: 95px;
		height: 90px;
		margin-bottom: 20px;
	}
	#flow .content:nth-of-type(1) .img img {
		width: 45px;
		height: auto;
	}
	#flow .content:nth-of-type(2) .img img {
		width: 30px;
		height: auto;
	}
	#flow .content:nth-of-type(3) .img img {
		width: 34px;
		height: auto;
	}
	#flow .content:nth-of-type(4) .img img {
		width: 42px;
		height: auto;
	}
	#flow .content:nth-of-type(5) .img img {
		width: 43px;
		height: auto;
	}
	#flow .content .textWr {
		width: 185px;
	}
	#flow .content .textHd {
		display: flex;
		align-items: center;
		width: 100%;
		margin-bottom: 5px;
	}
	#flow .content .num {
		font-size: 1.6rem;
		margin-bottom: 0;
	}
	#flow .content .num span {
		display: inline-block;
		border-bottom: none;
		border-right: 1px solid;
		padding-right: 5px;
		margin-right: 10px;
		width: 22px;
		height: 16px;
	}
	#flow .content .ttl {
		font-size: 1.5rem;
		margin-bottom: 0;
		white-space: nowrap;
	}
	#flow .content .ttl + .sup {
		position: static;
		width: auto;
	}
	#flow .content .text {
		font-size: 1.2rem;
		letter-spacing: normal;
		line-height: 1.4;
	}
	#flow .content:not(:last-of-type)::after {
		content: "";
		display: block;
		width: 95px;
		height: 20px;
		background: url("/top-img/flow-arrow-sp.svg") no-repeat 50% 0;
		background-size: 23px auto;
		top: 95px;
		left: 0;
	}
}
#gift {
	background: linear-gradient(90deg, rgba(228,189,56,1) 0%, rgba(252,248,235,1) 40%, rgba(252,248,235,1) 60%, rgba(228,189,56,1) 100%);
	box-shadow: 10px 10px 15px rgba(0,0,0,0.1);
	width: 1100px;
	height: 870px;
	position: relative;
	margin: auto;
}
#gift .boxHd {
	background: url("/top-img/gift-hd.webp") no-repeat 0 0;
	width: 1116px;
	height: 204px;
	position: absolute;
	top: 30px;
	left: -36px;
	padding-top: 95px;
	padding-left: 110px;
}
#gift .boxHd img {
	width: 783px;
	height: auto;
}
#gift .text1 {
	width: 337px;
	height: auto;
	text-align: center;
	position: absolute;
	top: 260px;
	left: 186px;
}
#gift .text1 p {
	font-size: 3.2rem;
	font-weight: 500;
	letter-spacing: 0.15em;
	margin-bottom: 20px;
}
#gift .text2 {
	width: 575px;
	position: absolute;
	top: 250px;
	left: 460px;
}
#gift .text2 p {
	font-family: "Noto Sans JP", sans-serif;
	font-size: 1.8rem;
	letter-spacing: 0.08em;
	line-height: 2;
	width: 420px;
	margin-top: -15px;
	margin-left: 70px;
}
#gift a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 515px;
	height: 120px;
	padding-left: 0.18em;
	font-size: 3.5rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	color: #fff;
	background: linear-gradient(90deg, rgba(133,184,58,1) 0%, rgba(0,135,61,1) 100%);
	box-shadow: 6px 6px 10px rgba(0,0,0,0.1);
	position: absolute;
	bottom: 60px;
	left: calc(50% - 240px);
}
#gift a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	#gift {
		width: 315px;
		height: 595px;
		box-shadow: 6px 6px 10px rgba(0,0,0,0.1);
	}
	#gift .boxHd {
		background: url("/top-img/gift-hd-sp.webp") no-repeat 0 0;
		background-size: auto 103px;
		width: 353px;
		height: 103px;
		top: 15px;
		left: -18px;
		padding-top: 31px;
		padding-left: 0;
	}
	#gift .boxHd img {
		width: 323px;
		height: auto;
		margin-left: -4px;
	}
	#gift .text1 {
		width: 315px;
		top: 125px;
		left: 0;
	}
	#gift .text1 p {
		font-size: 1.7rem;
		margin-bottom: 10px;
	}
	#gift .text1 img {
		width: 175px;
		height: auto;
	}
	#gift .text2 {
		width: 240px;
		width: 91.5873%;
		top: 290px;
		left: 50%;
		translate: -50% 0;
	}
	#gift .text2 p {
		width: 85%;
		margin: -5.0vw auto 0;
		text-align: justify;
		font-size: 1.2rem;
		line-height: 1.5833;
	}
	#gift a {
		width: 240px;
		height: 63px;
		font-size: 1.7rem;
		position: absolute;
		bottom: 25px;
		left: 37px;
	}
}
#news .sectionInner {
	padding-top: 90px;
}
#news h2 span {
	padding: 0 40px;
	margin-bottom: 5px;
}
.newsTtl .jp {
  color: var(--brown);
  font-weight: 500;
  font-size: 2.0rem;
  letter-spacing: 0.08em;
	text-align: center;
}
[id=news] ul {
  list-style: none;
  max-width: 850px;
  margin: 48px auto 0;
  text-align: justify;
  font-size: 1.7rem;
  font-weight: 500;
  color: var(--txtGray);
  line-height: 1.7647;
  letter-spacing: 0.08em;
}
[id=news] li:nth-child(n+2) {
  margin-top: 35px;
}
[id=news] a {
  display: block;
}
[id=news] a .entryTtl {
  margin: 5px 0;
}
[id=news] a .entryText {
  overflow: hidden;
  -webkit-line-clamp: 3;
  display: -webkit-box;
  -webkit-box-orient: vertical;
	text-align: left;
}
.entryDate {
  color: var(--brown);
  font-size: 2rem;
}
.entryTtl {
  color: var(--brown);
  font-size: 2rem;
  line-height: 1.3;
}
@media (any-hover: hover) {
  [id=news] a:hover {
    opacity: 0.6;
  }
}
@media (any-hover: none) {
  [id=news] a:active {
    opacity: 0.6;
  }
}
@media screen and (max-width: 767px) {
	#news .sectionInner {
		padding-top: 30px;
	}
  [id=news] .newsTtl .ttl01 {
    font-size: 1.6rem;
  }
  #news .ttl01 span {
		padding-left: 1.25em;
		padding-right: 1.25em;
	}
  [id=news] .newsTtl .jp {
    margin-top: 2px;
		font-size: 1rem;
  }
  [id=news] ul {
    width: 80%;
    margin-top: 6.6667vw;
    font-size: inherit;
  }
  [id=news] li:nth-child(n+2) {
    margin-top: 6.4vw;
  }
  .entryDate {
    font-size: min(1.5rem, 3.33vw);
  }
  .entryTtl {
    font-size: min(1.5rem, 3.33vw);
  }
}
[id=contact] .sectionInner {
  background: url("/top-img/contact-bg.jpg") no-repeat 50% 100%, linear-gradient(0deg, rgba(246, 236, 174, 0.3) 0%, rgba(253, 250, 233, 0.3) 100%);
  text-align: center;
  font-weight: 500;
	padding-bottom: 70px;
}
@media screen and (min-width: 1920px) {
	#contact .sectionInner {
		background: url("/top-img/contact-bg.jpg") no-repeat 50% 100%, linear-gradient(0deg, rgba(246, 236, 174, 0.3) 0%, rgba(253, 250, 233, 0.3) 100%);
		background-size: 100% 100%;
	}
}
[id=contact] dl {
  max-width: 702px;
  margin: 70px auto 0;
}
[id=contact] dt {
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2rem;
  letter-spacing: 0.06em;
}
[id=contact] dt:nth-of-type(n+2) {
  margin-top: 40px;
}
[id=contact] .required {
  margin-left: 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 19px;
  padding-left: 0.38em;
  background-color: var(--brown);
  color: #fff;
  font-size: 1.1rem;
  letter-spacing: 0.38em;
  font-feature-settings: normal;
}
[id=contact] dd {
  text-align: left;
  letter-spacing: 0.08em;
}
[id=contact] dd .example {
  margin-top: 5px;
  font-size: 1.4rem;
  letter-spacing: 0.06em;
}
[id=contact] dd .example .caution {
  display: inline-block;
  margin-left: 1em;
  text-indent: -1em;
  padding-left: 1em;
}
[id=contact] dd .error {
  margin-top: 5px;
}
[type=text], [type=email], [type=tel], textarea {
  width: 100%;
  height: 60px;
  background-color: #fff;
  border: 1px solid #898989;
  padding: 0 10px;
  font-family: "Noto Sans JP", sans-serif;
	font-weight: 400;
  font-size: inherit;
  color: inherit;
}
textarea {
  height: 360px;
  padding: 10px;
}
.radiolist {
	line-height: 1.6;
  display: flex;
  flex-wrap: wrap;
  gap: 16px 20px;
}
.radiolist.center {
  justify-content: center;
}
.radiolist.between {
  justify-content: space-between;
}
.radiolist label {
  display: flex;
  padding-left: 30px;
  position: relative;
  z-index: 0;
}
.radiolist label span::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.235em;
  width: 21px;
  height: 21px;
  border-radius: 50%;
  background-color: #fff;
  border: 1px solid #231815;
}
.radiolist label span::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0.235em;
  width: 21px;
  height: 21px;
  border-radius: 50%;
  background-color: #231815;
  scale: 0.6 0.6;
  opacity: 0;
  transition-duration: 0.3s;
}
.radiolist label :checked + span::after {
  opacity: 1;
}
.radiolist [type=radio] {
  -webkit-appearance: none;
  appearance: none;
  outline: 0;
  margin: 0;
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}
#contact .radiolist {
	width: 360px;
	margin: auto auto 50px;
}
@media screen and (max-width: 767px) {
	[id=contact] .sectionInner {
		background-image: url("/top-img/contact-bg-sp.jpg"), linear-gradient(0deg, rgba(246, 236, 174, 0.3) 0%, rgba(253, 250, 233, 0.3) 100%);
		background-size: 100% auto, 100% 100%;
		padding-bottom: 30px;
	}
  [id=contact] dl {
    margin-top: 8vw;
  }
  [id=contact] dt {
    margin-bottom: 3.6vw;
    font-size: min(1.4rem, 3.117vw);
  }
  [id=contact] dt:nth-of-type(n+2) {
    margin-top: 6.4vw;
  }
  [id=contact] .required {
    width: auto;
    height: auto;
    padding: 1px 0.5em 1px 0.88em;
    font-size: 1rem;
  }
  [id=contact] dd {
		width: 86.6667%;
    margin: 0 auto;
  }
  [id=contact] dd .example {
    font-size: min(0.93rem, 2.07vw);
  }
  [type=text], [type=email], [type=tel] {
    height: 30px;
    border-color: rgba(137, 137, 137, 0.5);
  }
  textarea {
    height: 180px;
    border-color: rgba(137, 137, 137, 0.5);
  }
  #contact .radiolist {
		width: auto;
		margin-bottom: 7.3333vw;
	}
  .radiolist label {
    padding-left: calc(1.4545em + 5px);
  }
  .radiolist label span::before {
    width: 1.4545em;
    height: 1.4545em;
    top: 0.2em;
    border-color: rgba(35, 24, 21, 0.5);
  }
  .radiolist label span::after {
    width: 1.4545em;
    height: 1.4545em;
    top: 0.2em;
  }
  .radiolist.between {
    display: grid;
    grid-template-columns: repeat(2, auto);
    grid-template-rows: repeat(2, auto);
    justify-content: center;
    gap: 2.13vw 5vw;
  }
}
#pp {
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.8;
	text-align: left;
	width: 670px;
	margin: 30px auto 0;
}
#pp .ttl {
	font-size: 1.8rem;
	letter-spacing: 0.08em;
	text-align: center;
	margin-bottom: 10px;
}
#pp div + div {
	margin-top: 2em;
}
#pp div span {
	color: var(--brown);
}
.contactBtn {
	font-size: 3.9rem;
	letter-spacing: 0.22em;
	width: 515px;
	height: 140px;
	color: #fff;
	background: linear-gradient(90deg, rgba(198,77,35,1) 0%, rgba(154,42,17,1) 80%, rgba(154,42,17,1) 100%);
	box-shadow: 6px 6px 10px rgba(0,0,0,0.1);
	margin: 60px auto 20px;
}
.contactBtn:hover {
	opacity: 0.7;
}
.contactBtn + .caution,
p:has(.contactBtn) + .caution {
	margin-bottom: 60px;
	text-indent: -1em;
	padding-left: 1em;
}
#contact .infoWr {
	color: var(--gold);
}
#contact .infoWr .logo {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 2.0rem;
	letter-spacing: 0.08em;
}
#contact .infoWr .logo img {
	height: 22px;
	width: auto;
	margin-right: 15px;
}
#contact .infoWr .companyInfo {
	font-size: 1.8rem;
	font-weight: 400;
	letter-spacing: 0.06em;
	margin: 20px auto 15px;
}
#contact .infoWr .text {
	width: 100%;
	font-size: 2.8rem;
	font-weight: 600;
	letter-spacing: 0.19em;
	display: flex;
	justify-content: center;
	align-items: center;
}
#contact .infoWr .text img {
	width: 30px;
	height: auto;
	margin-right: 10px;
}
#contact .infoWr .text a {
	font-size: 4.1rem;
	font-weight: 500;
	letter-spacing: 0.01em;
}
@media screen and (max-width: 767px) {
	#pp {
		font-size: 1.0rem;
		width: 300px;
	}
	#pp .ttl {
		font-size: 1.1rem;
		margin-bottom: 10px;
	}
	.contactBtn {
		font-size: 2.2rem;
		width: 300px;
		height: 80px;
		margin: 30px auto 10px;
	}
	.contactBtn + .caution,
	p:has(.contactBtn) + .caution {
		margin: 10px auto 30px;
		width: 300px;
		text-align: left;
		line-height: 1.3;
	}
	#contact .infoWr .logo {
		font-size: 1.1rem;
	}
	#contact .infoWr .logo img {
		height: 12px;
	}
	#contact .infoWr .companyInfo {
		font-size: 1.0rem;
		margin: 10px auto 5px;
	}
	#contact .infoWr .text {
		font-size: 1.6rem;
	}
	#contact .infoWr .text img {
		width: 17px;
	}
	#contact .infoWr .text a {
		font-size: 2.3rem;
	}
}
/*----------------------------------------------
 * * news single page
 * *----------------------------------------------*/
.news {
	--color: #b74c27;
	min-height: 100svh;
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: auto 1fr auto;
}
.backHome a {
	text-align: center;
	text-decoration: none;
	font-weight: 500;
	font-size: 2.1rem;
	letter-spacing: 0.1em;
}
.news header .backHome a {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--color);
	padding: 20px 0;
	color: #fff;
	&:hover {
		opacity: 0.7;
	}
}
.news footer .copyright {
	background-color: var(--color);
	background-image: none;
	color: #fff;
}
.news main {
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	align-items: flex-start;
	justify-content: center;
	gap: 0 46px
}
.news h1 {
	flex: 0 0 100%;
	margin: 90px auto;
	text-align: center;
	color: var(--color);
	font-weight: 500;
	font-size: 3rem;
}
.news h1 .inner {
	display: inline-block;
}
.news h1 .jp {
	border-top: 3px double #c9a063;
	margin-top: 5px;
	padding-top: 3px;
	display: block;
	font-size: 2rem;
}
.newsbox {
	width: 752px;
	background-color: #fff;
	padding: 70px 50px;
	box-shadow: 10px 10px 40px rgba(4,0,0,0.1);
	font-family: "Noto Sans JP", sans-serif;
	letter-spacing: 0.06em;
}
.newsbox .entryDate {
	font-weight: 500;
	font-size: 2rem;
}
.newsbox .entryTtl {
	margin-top: 10px;
	font-weight: 500;
	font-size: 1.8rem;
}
.newsbox .entryText {
	margin-top: 6px;
	font-size: 1.7rem;
	line-height: 1.7647;
	color: #727171;
}
.newsbox .entryText::after {
	content: "";
	display: block;
	clear: both;
}
.sidebar {
	width: 306px;
}
.sidebar h3 {
	background-color: var(--color);
	margin-bottom: 18px;
	padding: 18px 0;
	font-size: 2rem;
	font-weight: 600;
	text-align: center;
	color: #fff;
}
.sidebar li {
	font-family: "Noto Sans JP", sans-serif;
	letter-spacing: 0.06em;
}
.sidebar li:nth-child(n+2) {
	margin-top: 25px;
}
.sidebar a .entryDate {
	color: #231815;
	font-size: 2rem;
}
.sidebar a .entryTtl {
	margin-top: 5px;
	color: #231815;
	font-size: 1.7rem;
}
.news main .backHome {
	flex: 0 0 100%;
	margin: 100px auto;
	text-align: center;
	color: var(--color);
}
.news main .backHome a:hover {
	text-decoration: underline;
}
@media screen and (max-width: 767px) {
	.backHome a {
		font-size: 2.8vw;
	}
	.news header .backHome a {
		padding: 0.9em 0;
	}
	.news h1 {
		margin: min(60px, 15.3333vw) auto;
		font-size: 4.792vw;
	}
	.news h1 .jp {
		font-size: 3.1827vw;
	}
	.newsbox {
		width: 80%;
		padding: 4.8vw 5.8333%;
		box-shadow: 5px 5px 18px rgba(4,0,0,0.1);
	}
	.newsbox .entryDate,
	.newsbox .entryTtl {
		font-size: 3.3067vw;
	}
	.newsbox .entryText {
		font-size: 2.6453vw;
		line-height: 1.8216;
	}
	.sidebar {
		width: 80%;
		margin-top: 9.0667vw;
	}
	.sidebar h3 {
		width: 50%;
		margin-left: auto;
		margin-right: auto;
		padding: 0.75em 0;
		font-size: 3.212vw;
	}
	.sidebar li:nth-child(n+2) {
		margin-top: 6.1333vw;
	}
	.sidebar a .entryDate {
		font-size: 3.212vw;
	}
	.sidebar a .entryTtl {
		font-size: 2.6453vw;
		line-height: 1.7138;
	}
	.news main .backHome {
		margin: 7.4667vw auto;
	}
}
/*----------------------------------------------
 * * thanks page
 * *----------------------------------------------*/
.thanks {
	--keyColor: #802c3c;
	background-color: #ebeaea;
	min-height: 100svh;
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: auto 1fr auto;
	text-align: center;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 400;
	font-size: 1.9rem;
	letter-spacing: 0.12em;
}
.thanks .backHome a {
	background-color: var(--keyColor);
	padding: 0.8em 0;
	display: flex;
	justify-content: center;
	align-items: center;
	text-transform: uppercase;
	color: #fff;
	font-size: 2.5rem;
	letter-spacing: 0.34em;
}
.thanks main {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.thanks h1 {
	margin-bottom: 65px;
	font-weight: inherit;
	font-size: 2.1rem;
}
.thanksMessage {
	line-height: 3.2105;
}
@media (any-hover: hover) {
	.thanks .backHome a:hover {
		opacity: 0.7;
	}
}
@media (any-hover: none) {
	.thanks .backHome a:active {
		opacity: 0.7;
	}
}
@media screen and (max-width: 767px) {
	.thanks {
		font-size: 1.4rem;
	}
	.thanks .backHome a {
		font-size: min(1.6rem, 3.3333vw);
	}
	.thanks h1 {
		margin-bottom: 8.6667vw;
		font-size: 1.6rem;
	}
	.thanksMessage {
		width: 80%;
		margin: 0 auto;
		text-align: left;
		line-height: 2;
	}
}