@charset "utf-8";

@font-face {
	font-family: "CIRCLE20";
	src: url("../../font/CIRCLE20.TTF") format("truetype");
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: "CIRCLE20";
	src: url("../../font/CIRCLE20.TTF") format("truetype");
	font-weight: 700;
	font-style: normal;
}

@font-face {
	font-family: "CIRCLE20";
	src: url("../../font/CIRCLE20.TTF") format("truetype");
	font-weight: 300;
	font-style: normal;
}

/* ----------------------------------------------
common
------------------------------------------------*/
:root {
	--base-white: #fff;
	--base-black: #000;
	--base-red: #9e1f36;
	--base-green: #506448;
	--base-deep-green: #72813c;
	--base-blue: #3e4b6a;
	--base-beige: #f2eade;
	--txt-black: #3b3b3b;
}

:root {
	--leading-trim: calc((1em - 1lh) / 2);
	--fontsize11: min(calc(11 / 1820 * 100vw), 11px);
	--fontsize12: min(calc(12 / 1820 * 100vw), 12px);
	--fontsize13: min(calc(13 / 1820 * 100vw), 13px);
	--fontsize14: min(calc(14 / 1820 * 100vw), 14px);
	--fontsize15: min(calc(15 / 1820 * 100vw), 15px);
	--fontsize16: min(calc(16 / 1820 * 100vw), 16px);
	--fontsize12_16: min(calc(16 / 1820 * 100vw), 16px);
	--fontsize13_16: min(calc(16 / 1820 * 100vw), 16px);
	--fontsize17: min(calc(17 / 1820 * 100vw), 17px);
	--fontsize18: min(calc(18 / 1820 * 100vw), 18px);
	--fontsize19: min(calc(19 / 1820 * 100vw), 19px);
	--fontsize20: min(calc(20 / 1820 * 100vw), 20px);
	--fontsize21: min(calc(21 / 1820 * 100vw), 21px);
	--fontsize22: min(calc(22 / 1820 * 100vw), 22px);
	--fontsize23: min(calc(23 / 1820 * 100vw), 23px);
	--fontsize24: min(calc(24 / 1820 * 100vw), 24px);
	--fontsize24_2: min(calc(24 / 1820 * 100vw), 24px);
	--fontsize25: min(calc(25 / 1820 * 100vw), 25px);
	--fontsize26: min(calc(26 / 1820 * 100vw), 26px);
	--fontsize27: min(calc(27 / 1820 * 100vw), 27px);
	--fontsize28: min(calc(28 / 1820 * 100vw), 28px);
	--fontsize29: min(calc(29 / 1820 * 100vw), 29px);
	--fontsize30: min(calc(30 / 1820 * 100vw), 30px);
	--fontsize31: min(calc(31 / 1820 * 100vw), 31px);
	--fontsize32: min(calc(32 / 1820 * 100vw), 32px);
	--fontsize34: min(calc(34 / 1820 * 100vw), 34px);
	--fontsize35: min(calc(35 / 1820 * 100vw), 35px);
	--fontsize36: min(calc(36 / 1820 * 100vw), 36px);
	--fontsize38: min(calc(38 / 1820 * 100vw), 38px);
	--fontsize40: min(calc(40 / 1820 * 100vw), 40px);
	--fontsize41: min(calc(41 / 1820 * 100vw), 41px);
	--fontsize42: min(calc(42 / 1820 * 100vw), 42px);
	--fontsize43: min(calc(43 / 1820 * 100vw), 43px);
	--fontsize44: min(calc(44 / 1820 * 100vw), 44px);
	--fontsize45: min(calc(45 / 1820 * 100vw), 45px);
	--fontsize46: min(calc(46 / 1820 * 100vw), 46px);
	--fontsize48: min(calc(48 / 1820 * 100vw), 48px);
	--fontsize50: min(calc(50 / 1820 * 100vw), 50px);
	--fontsize52: min(calc(52 / 1820 * 100vw), 52px);
	--fontsize55: min(calc(55 / 1820 * 100vw), 55px);
	--fontsize56: min(calc(56 / 1820 * 100vw), 56px);
	--fontsize60: min(calc(60 / 1820 * 100vw), 60px);
	--fontsize64: min(calc(64 / 1820 * 100vw), 64px);
	--fontsize65: min(calc(65 / 1820 * 100vw), 65px);
	--fontsize69: min(calc(69 / 1820 * 100vw), 69px);
	--fontsize70: min(calc(70 / 1820 * 100vw), 70px);
	--fontsize72: min(calc(72 / 1820 * 100vw), 72px);
	--fontsize80: min(calc(80 / 1820 * 100vw), 80px);
	--fontsize100: min(calc(100 / 1820 * 100vw), 100px);
	--fontsize110: min(calc(110 / 1820 * 100vw), 110px);
	--fontsize120: min(calc(120 / 1820 * 100vw), 120px);
	--fontsize150: min(calc(150 / 1820 * 100vw), 150px);
	--fontsize160: min(calc(160 / 1820 * 100vw), 160px);
}

@media screen and (max-width: 1199px) {
	:root {
		--fontsize11: min(calc(11 / 1200 * 100vw), 11px);
		--fontsize12: min(calc(12 / 1200 * 100vw), 12px);
		--fontsize13: min(calc(13 / 1200 * 100vw), 13px);
		--fontsize14: min(calc(14 / 1200 * 100vw), 14px);
		--fontsize15: min(calc(15 / 1200 * 100vw), 15px);
		--fontsize16: min(calc(16 / 1200 * 100vw), 16px);
		--fontsize12_16: min(calc(16 / 390 * 100vw), 16px);
		--fontsize13_16: min(calc(16 / 390 * 100vw), 16px);
		--fontsize17: min(calc(17 / 1200 * 100vw), 17px);
		--fontsize18: min(calc(18 / 1200 * 100vw), 18px);
		--fontsize19: min(calc(19 / 1200 * 100vw), 19px);
		--fontsize20: min(calc(20 / 1200 * 100vw), 20px);
		--fontsize21: min(calc(21 / 1200 * 100vw), 21px);
		--fontsize22: min(calc(22 / 1200 * 100vw), 22px);
		--fontsize23: min(calc(23 / 1200 * 100vw), 23px);
		--fontsize24: min(calc(24 / 1200 * 100vw), 24px);
		--fontsize25: min(calc(25 / 1200 * 100vw), 25px);
		--fontsize26: min(calc(26 / 1200 * 100vw), 26px);
		--fontsize27: min(calc(27 / 1200 * 100vw), 27px);
		--fontsize28: min(calc(28 / 1200 * 100vw), 28px);
		--fontsize29: min(calc(29 / 1200 * 100vw), 29px);
		--fontsize30: min(calc(30 / 1200 * 100vw), 30px);
		--fontsize31: min(calc(31 / 1200 * 100vw), 31px);
		--fontsize32: min(calc(32 / 1200 * 100vw), 32px);
		--fontsize34: min(calc(34 / 1200 * 100vw), 34px);
		--fontsize35: min(calc(35 / 1200 * 100vw), 35px);
		--fontsize36: min(calc(36 / 1200 * 100vw), 36px);
	}
}

@media screen and (max-width: 767px) {
	:root {
		--fontsize11: min(calc(11 / 390 * 100vw), 11px);
		--fontsize12: min(calc(12 / 390 * 100vw), 12px);
		--fontsize13: min(calc(13 / 390 * 100vw), 13px);
		--fontsize14: min(calc(14 / 390 * 100vw), 14px);
		--fontsize15: min(calc(15 / 390 * 100vw), 15px);
		--fontsize16: min(calc(16 / 390 * 100vw), 16px);
		--fontsize12_16: min(calc(16 / 390 * 100vw), 16px);
		--fontsize13_16: min(calc(16 / 390 * 100vw), 16px);
		--fontsize17: min(calc(17 / 390 * 100vw), 17px);
		--fontsize18: min(calc(18 / 390 * 100vw), 18px);
		--fontsize19: min(calc(19 / 390 * 100vw), 19px);
		--fontsize20: min(calc(20 / 390 * 100vw), 20px);
		--fontsize21: min(calc(21 / 390 * 100vw), 21px);
		--fontsize22: min(calc(22 / 390 * 100vw), 22px);
		--fontsize23: min(calc(23 / 390 * 100vw), 23px);
		--fontsize24: min(calc(24 / 390 * 100vw), 24px);
		--fontsize25: min(calc(25 / 390 * 100vw), 25px);
		--fontsize26: min(calc(26 / 390 * 100vw), 26px);
		--fontsize27: min(calc(27 / 390 * 100vw), 27px);
		--fontsize28: min(calc(28 / 390 * 100vw), 28px);
		--fontsize29: min(calc(29 / 390 * 100vw), 29px);
		--fontsize30: min(calc(30 / 390 * 100vw), 30px);
		--fontsize31: min(calc(31 / 390 * 100vw), 31px);
		--fontsize32: min(calc(32 / 390 * 100vw), 32px);
		--fontsize34: min(calc(34 / 390 * 100vw), 34px);
		--fontsize35: min(calc(35 / 390 * 100vw), 35px);
		--fontsize36: min(calc(36 / 390 * 100vw), 36px);
		--fontsize38: min(calc(38 / 390 * 100vw), 38px);
		--fontsize40: min(calc(40 / 390 * 100vw), 40px);
		--fontsize41: min(calc(41 / 390 * 100vw), 41px);
		--fontsize42: min(calc(42 / 390 * 100vw), 42px);
		--fontsize43: min(calc(43 / 390 * 100vw), 43px);
		--fontsize44: min(calc(44 / 390 * 100vw), 44px);
		--fontsize45: min(calc(45 / 390 * 100vw), 45px);
		--fontsize46: min(calc(46 / 390 * 100vw), 46px);
		--fontsize48: min(calc(48 / 390 * 100vw), 48px);
		--fontsize50: min(calc(50 / 390 * 100vw), 50px);
		--fontsize52: min(calc(50 / 390 * 100vw), 52px);
		--fontsize55: min(calc(55 / 390 * 100vw), 55px);
		--fontsize56: min(calc(56 / 390 * 100vw), 56px);
		--fontsize65: min(calc(65 / 390 * 100vw), 65px);
		--fontsize70: min(calc(70 / 390 * 100vw), 70px);
	}
}

body {
	position: relative;
	font-family: "Kiwi Maru", serif;
	overflow-x: hidden;
}

.inner {
	width: 95%;
	max-width: 1820px;
	margin-inline: auto;
}

.small-inner {
	width: 95%;
	max-width: 1200px;
	margin-inline: auto;
}

#home .main-bg {
	padding: 0;
	background: var(--base-beige);
}

.main-bg {
	padding-top: 100px;
	background: var(--base-beige);
	padding-bottom: 40px;
}

@media screen and (max-width: 767px) {
	.main-bg {
		padding-top: 80px;
	}
}

/* パンくずリスト
-------------------------------*/
.breadcrumb {
	/* padding: 10px 0 50px; */
	padding: 10px 0 40px;
}

.breadcrumb__list {
	display: flex;
}

.breadcrumb__item {
	position: relative;
}

.breadcrumb__item::after {
	content: ">";
	padding: 0 5px;
}

.breadcrumb__item:last-child::after {
	content: none;
}

.breadcrumb__item,
.breadcrumb__item a {
	font-size: var(--fontsize14);
	color: var(--txt-black);
}

/* ----------------------------------------------
header
------------------------------------------------*/
#home header {
	background: initial;
}

header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	height: auto;
	z-index: 100;
	background: #c9c4ad;
}

.header__wrap {
	width: 95%;
	margin-inline: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 100px;
}

.header__logo {
	/* padding-top: min(45/1820 * 100vw, 45px); */
	width: min(25vw, 280px);
}

/* ナビゲーション
----------------------------- */
.header__nav {
	display: flex;
	gap: min(25/1820 * 100vw, 25px);
}

.header__nav-list {
	/* padding-top: min(55/1820 * 100vw, 55px); */
	display: flex;
	gap: min(30/1820 * 100vw, 30px);
	align-items: center;
}

.header__nav-list a {
	position: relative;
	padding-bottom: 10px;
	font-size: var(--fontsize20);
}

.header__nav-list a::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	translate: -50%;
	width: 30%;
	height: 1px;
	background: var(--base-green);
	scale: 0;
	transition: all 0.8s;
}

.header__nav-list a:hover::after {
	scale: 1;
	transition: all 0.8s;
}

/* ボタン
------------------------------*/

.header__nav-contact {
	/* padding-top: min(45/1820 * 100vw, 45px); */
}

.header__nav-contact a {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	padding: 10px min(22/1200 * 100vw, 22px) 10px min(12/1200 * 100vw, 12px);
	border-radius: 10px;
	font-size: var(--fontsize20);
	color: var(--base-white);
	background: var(--base-red);
	gap: 10px;
}

/* .header__nav-contact a::before {
  content: "";
  display: block;
  background: url(../../img/common/mail-icon.png) no-repeat center;
  background-size: min(20/1200 * 100vw, 20px) min(20/1200 * 100vw, 20px);
  width: min(20/1200 * 100vw, 20px);
  height: min(20/1200 * 100vw, 20px);
  margin-right: min(15/1200 * 100vw, 15px);
} */

.header__hmb {
	display: none;
}

.header__hmb {
	position: relative;
	width: 45px;
	height: 45px;
	margin-top: 10px;
}

.header__hmb::after {
	content: "MENU";
	font-size: var(--fontsize16);
	position: absolute;
	bottom: 0;
	left: 50%;
	translate: -50%;
	white-space: nowrap;
	line-height: 1;
}

.header__hmb span {
	width: 80%;
	height: 2px;
	background: var(--base-deep-green);
}

.header__hmb span:nth-child(1) {
	position: absolute;
	top: 0;
	left: 50%;
	translate: -50%;
}

.header__hmb.active span:nth-child(1) {
	rotate: -45deg;
	top: 10px;
}

.header__hmb span:nth-child(2) {
	position: absolute;
	top: 10px;
	left: 50%;
	translate: -50%;
}

.header__hmb.active span:nth-child(2) {
	display: none;
}

.header__hmb span:nth-child(3) {
	position: absolute;
	top: 20px;
	left: 50%;
	translate: -50%;
}

.header__hmb.active span:nth-child(3) {
	top: 10px;
	rotate: 45deg;
}

.header-sp__nav {
	display: none;
	position: fixed;
	padding: 20px 2.5%;
	top: 80px;
	left: 0;
	background: #c9c4ad;
	width: 100vw;
	min-height: 100vh;
	height: 100%;
}

.header-sp__nav.active {
	display: block;
}

.header-sp__nav-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.header-sp__nav-item a {
	font-size: var(--fontsize16);
}

@media screen and (max-width: 767px) {
	#home header,
	header {
		position: fixed;
		background: #c9c4ad;
	}

	.header__wrap {
		height: 80px;
	}

	.header__logo {
		width: min(50vw, 200px);
		display: flex;
		align-items: center;
		padding: 0;
	}

	.header__nav {
		display: none;
	}

	.header__hmb {
		display: block;
	}
}

/* ----------------------------------------------
parts
------------------------------------------------*/
.heading {
	font-family: "CIRCLE20", sans-serif;
	display: flex;
	flex-direction: column;
	line-height: 1.35;
	margin-bottom: min(50/1820 * 100vw, 50px);
}

.heading__en-txt {
	font-size: var(--fontsize80);
	font-weight: 600;
	color: var(--base-deep-green);
	font-family: "CIRCLE20", sans-serif;
}

.heading__en-txt::first-letter {
	color: var(--base-green);
}

.heading__en-txt--white {
	color: var(--base-white);
}

.heading__en-txt--white::first-letter {
	color: var(--base-white);
}

.heading__jp-txt {
	position: relative;
	font-size: var(--fontsize30);
	font-family: "Kiwi Maru", serif;
	padding-left: 0.5em;
}

.heading__jp-txt::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	translate: 0 -50%;
	width: 8px;
	height: 8px;
	background: var(--base-deep-green);
	border-radius: 50%;
	opacity: 0.6;
}

.heading__jp-txt--white {
	color: var(--base-white);
}

.heading__jp-txt--white::before {
	background: var(--base-white);
}

@media screen and (max-width: 767px) {
	.heading {
		margin-bottom: min(30/390 * 100vw, 30px);
	}

	.heading__en-txt {
		font-size: var(--fontsize40);
	}

	.heading__jp-txt {
		font-size: var(--fontsize20);
	}

	.heading__jp-txt::before {
		width: 4px;
		height: 4px;
	}
}

/* ----------------------------------------------
footer
------------------------------------------------*/
footer {
	position: relative;
	background: #f9f5ef;
}

.footer__wrap {
	padding-top: min(70/1820 * 100vw, 70px);
	display: grid;
	grid-template-columns: min(700/1820 * 100vw, 700px) auto;
	margin-bottom: min(75/1820 * 100vw, 75px);
}

.footer__left {
	border-right: 1px solid #c3c3c3;
}

.footer__logo {
	width: min(50%, 420px);
	margin-bottom: min(55/1820 * 100vw, 55px);
}

.footer__address {
	font-size: var(--fontsize24_2);
	margin-bottom: min(35/1820 * 100vw, 35px);
	color: var(--txt-black);
}

.footer__link {
	display: flex;
	gap: 10px;
}

.footer__link a {
	display: block;
	width: min(59/1200 * 100vw, 59px);
	height: min(59/1200 * 100vw, 59px);
}

.footer__link a img {
	width: 100%;
	display: block;
}

.footer__nav {
	display: flex;
	justify-content: flex-end;
	gap: min(150/1820 * 100vw, 150px);
}

.footer__list {
	display: flex;
	flex-direction: column;
	gap: 15px;
}

.footer__list a {
	font-size: var(--fontsize24_2);
	display: block;
}

/* コピーライト */
.footer__copy {
	display: block;
	font-size: var(--fontsize24_2);
	padding-bottom: 40px;
}

@media screen and (max-width: 767px) {
	.footer__wrap {
		grid-template-columns: 1fr;
		padding-top: min(30 / 390 * 100vw, 30px);
		margin-bottom: min(25 / 390 * 100vw, 25px);
	}

	.footer__logo {
		margin-bottom: min(15/390 * 100vw, 15px);
	}

	.footer__left {
		border-right: initial;
	}

	.footer__address {
		font-size: var(--fontsize14);
		margin-bottom: min(15/390 * 100vw, 15px);
	}

	.footer__link {
		gap: 10px;
		margin-bottom: min(15/390 * 100vw, 15px);
	}

	.footer__link a {
		width: min(30/390 * 100vw, 30px);
		height: min(30/390 * 100vw, 30px);
	}

	.footer__nav {
		display: flex;
		justify-content: initial;
		flex-direction: column;
		gap: min(15/390 * 100vw, 15px);
	}

	.footer__list {
		gap: 5px;
	}

	.footer__list a {
		font-size: var(--fontsize16);
	}

	.footer__copy {
		font-size: var(--fontsize12);
		padding-bottom: 20px;
	}
}

/* 404 */
.l-mainContent__inner.not-found {
	margin: 0 0 60px 0;
}