/*--------------------------------------------------------------
# カスタムプロパティ
--------------------------------------------------------------*/
:root {
	/* 色 */
	--color-primary: #8B7A5D;
	--color-secondary: #FF8A00;
	--color-highlight: #FF420E;
	--color-danger: #ff2020;
	--color-grey: #b0b0b0;
	/* メイン領域の最大幅 */
	--main-width: 500px;
	/* サイド領域の最大幅 */
	--side-width: 360px;
	/* コンテナーの幅 */
	--container-width: 90%;
	/* コンテナーの幅(上書き用) */
	--container-width-narrow: 90%;
	/* コンテナーの最大幅 */
	--container-max-width: 1260px;
	/* コンテナーの最大幅 */
	--container-max-width-narrow: 1070px;
	/* 余白 */
	--footer-padding: 4rem;/* フッター */
	--main-area-padding: 6rem;/* メイン領域の上下 */
	--section-padding: 6rem;/* セクションの上下 */
	/* Fontawesome */
	--fontawesome: "Font Awesome 6 Pro";
	--fontawesome-sharp: "Font Awesome 6 sharp";
	--fontawesome-brands: "Font Awesome 6 Brands";
	/* font-family */
	--font-main: "noto-sans-cjk-jp", "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	--font-accent-handwriting: "tk-takumi-shokei-font", "noto-sans-cjk-jp", "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	--font-accent-serif: "biz-udpmincho", "noto-sans-cjk-jp", "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	--font-accent-heading: "Lexend Exa", "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	/* フォントサイズ */
	--font-size-small: .75rem;
	/* ヘッダーの高さ */
	--header-height: 80px;
	/* ボーダー */
	--border-solid-primary: 1px solid var(--border-color);
	/* アニメーション duration */
	--duration-default: .25s;
}

@media screen and (min-width: 992px) {
	:root {
		/* ヘッダーの高さ */
		--header-height: 80px;
		/* コンテナーの幅(上書き用) */
		--container-width-narrow: 80%;
		/* コンテナーの最大幅 */
		--container-max-width-narrow: 1070px;
		/* 余白 */
		--main-area-padding: 8rem;/* メイン領域の上下 */
		/* 余白 */
		--footer-padding: 8rem;/* フッター */
		--section-padding: 8rem;/* セクションの上下 */
	}
}

/* 色の割り当て
--------------------------------------------- */
:root {
	/* 文字色 */
	--color-headline-primary: #000;
	--color-text-primary: #000;
	--color-text-secondary: #fff;
	/* 背景色 */
	--color-background: #FAF8F5;
	--color-background-secondary: rgba(253, 205, 36, 0.1);
	--color-background-tertiary: #fae9e5;
	--color-background-yellow: #fffae9;
	/* テキストリンク文字色 */
	--btn-text-color: var(--color-primary);
	--btn-text-hover-color: var(--color-highlight);
}

/* normalize
--------------------------------------------- */
html {
	font-size: 16px;
}

body {
	font-family: var(--font-main);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

a:hover, a:focus, a:active {
	color: inherit;
}

a {
	cursor: pointer;
}

a:focus {
	outline: none;
}

li a,
li a:visited {
	display: inline;
}

.post,
.page {
	margin: 0;
}

/* コンテンツの幅
--------------------------------------------- */
.container {
	width: var(--container-width);
	max-width: var(--container-max-width);
	margin-right: auto;
	margin-left: auto;
}

.container__narrow {
	width: var(--container-width-narrow);
	max-width: var(--container-max-width-narrow);
}

/*--------------------------------------------------------------
# レイアウト崩れ防止
--------------------------------------------------------------*/
/* footerが常に画面最下部にいるように固定
--------------------------------------------- */
.site__main {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--color-background);
	min-height: 100vh;
	padding-top: var(--header-height);
}

.site__footer {
	background: var(--color-text-primary);
	color: #fff;
	margin-top: auto;
}

/*--------------------------------------------------------------
# アコーディオン
--------------------------------------------------------------*/
.accordion__checkbox {
	display: none !important;
}

.accordion__wrapper {
	display: grid;
	grid-template-rows: 0fr;
	width: 100%;
	transition: grid-template-rows .3s;
}

.accordion__checkbox:checked ~ .accordion__wrapper {
	grid-template-rows: 1fr;
}

.accordion__content {
	overflow: hidden;
}

/*--------------------------------------------------------------
# 画像
--------------------------------------------------------------*/
/* cover */
.image__cover {
	overflow: hidden;
}

.image__cover img {
	display: block;
	object-fit: cover;
	object-position: center center;
	width: 100%;
	height: 100%;
}

/* contain */
.image__contain img {
	display: block;
	object-fit: contain;
	object-position: center center;
	width: 100%;
	height: 100%;
}

/*--------------------------------------------------------------
# サムネイル
--------------------------------------------------------------*/
.image__post-thumbnail {
	aspect-ratio: 7 / 5;
	width: 100%;
	overflow: hidden;
}

.image__post-thumbnail img {
	display: block;
	object-fit: cover;
	object-position: center center;
	width: 100%;
	height: 100%;
	transition: transform var(--duration-default);
}

.image__post-thumbnail__empty img {
	object-fit: contain;
	background: #fff;/* test */
	padding: 10%;
}

.post__link:hover .image__post-thumbnail img {
	transform: scale(1.1);
}

/*--------------------------------------------------------------
# ロゴ
--------------------------------------------------------------*/
.site__logo {
	display: flex;
	justify-content: center;
	align-items: center;
	aspect-ratio: 3 / 1;
	margin-right: auto;
	margin-left: auto;
}

.site__logo > img,
.site__logo > svg {
	display: block;
	object-fit: contain;
	width: 100%;
	height: 100%;
}

.site__header__logo .site__logo > svg {
	fill: var(--color-text-secondary);
}

/*--------------------------------------------------------------
# ボタン
--------------------------------------------------------------*/
a[class*=button__] {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--color-text-primary);
	font-size: 1rem;
	font-weight: 700;
	width: 100%;
	text-decoration: none;
}

a[class*=button__]:not(:first-child) {
	margin-top: var(--section-padding);
}

@media screen and (min-width: 768px) {
	a[class*=button__] {
		max-width: 320px;
		margin-right: auto;
		margin-left: auto;
	}	
}

/* 角丸ボタン
--------------------------------------------- */
a[class*=button__]::after {
	position: absolute;
	right: 2rem;
}

a.button__rounded {
	color: #fff;
	background: var(--color-text-primary);
	padding: 1.5em 0;
	border: 2px solid var(--color-text-primary);
	border-radius: 2.5rem;
	overflow: hidden;
}

/* アイコン設定
--------------------------------------------- */
/* next */
a.button__next::after {
	content: '\f054';
	font-family: var(--fontawesome-sharp);
	font-weight: 700;
	transition: color var(--duration-default);
	z-index: 1;
}

/* prev */
a.button__prev::before {
	position: absolute;
	content: '\f053';
	font-family: var(--fontawesome-sharp);
	font-weight: 700;
	left: 2rem;
	transition: color var(--duration-default);
	z-index: 1;
}

/* アニメーション
--------------------------------------------- */
a.button__rounded.button__next > *,
a.button__rounded.button__prev > * {
	position: relative;
	z-index: 1;
}

a.button__rounded.button__next::before,
a.button__rounded.button__prev::after {
	content: '';
	position: absolute;
	background: #fff;
	aspect-ratio: 1 / 1;
	width: calc(100% + 4px);
	height: auto;
	top: 50%;
	left: 50%;
	border-radius: 50%;
	transform: translate(-50%, -50%) scale(0);
	transition: transform var(--duration-default), color var(--duration-default);
	z-index: 0;
}

a.button__rounded.button__next:hover,
a.button__rounded.button__prev:hover {
	color: var(--color-text-primary);
}

a.button__rounded.button__next:hover::before,
a.button__rounded.button__prev:hover::after {
	transform: translate(-50%, -50%) scale(1);
}

/*--------------------------------------------------------------
# 装飾テキスト
--------------------------------------------------------------*/
/* 太字＋下線 .text__underline
--------------------------------------------- */
.text__underline {
	font-weight: 700;
	background: linear-gradient(transparent 80%, #eb666180 80%);
}

/*--------------------------------------------------------------
# テキスト .br__wrapper
--------------------------------------------------------------*/
/* 改行調整 */
.br__wrapper {
	display: inline-block;
}

/*--------------------------------------------------------------
# セクション .front__section
--------------------------------------------------------------*/
.front__section {
	padding-top: var(--section-padding);
	padding-bottom: var(--section-padding);
}

.front__section__has_background {
	background: var(--color-background-secondary);
	padding-top: var(--section-padding);
}

/*--------------------------------------------------------------
# ナビゲーション
--------------------------------------------------------------*/
[class*=navigation__] {
	list-style: none;
	margin: 0;
	padding: 0;
}

.navigation__parent,
.navigation__child {
	white-space: nowrap;
}

.navigation__parent__item {
	position: relative;
	display: flex;
	flex-direction: column;
	font-size: 1rem;
	line-height: 1em;
}

.link__navigation__parent {
	display: flex;
	align-items: center;
	width: fit-content;
}

.navigation__accordion__label {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 2em;
	height: 2em;
	top: 1em;
	right: 0;
	border: 1px solid var(--color-primary);
	border-radius: 50%;
	transition: .2s;
	cursor: pointer;
	transition-duration: .25s;
}

.navigation__accordion__label > span,
.navigation__accordion__label > span::before {
	content: "";
	position: absolute;
	display: block;
	background-color: var(--color-primary);
	height: 2px;
	width: 15px;
	transition: transform .3s;
}

.navigation__accordion__label > span::before {
	transform: rotate(90deg);
}

.navigation__accordion__checkbox:checked ~ .navigation__accordion__label > span::before {
	transform: rotate(180deg);
}

.navigation__accordion__label > span::after {
	content: '';
	position: absolute;
	width: 3em;
	height: 3em;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.navigation__child__item > a {
	display: inline-block;
	padding: .75em 0;
}

@media screen and (max-width: 767px) {
	.navigation__global__horizontal,
	.link__navigation__parent__label__ja {
		display: none;
	}
}

@media screen and (min-width: 768px) {
	.navigation__global__horizontal {
		flex: 1;
		max-width: 960px;
		height: 60%;
	}
	
	.navigation__global__horizontal .navigation__parent {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		height: 100%;
	}
	
	.navigation__global__horizontal .navigation__parent__item {
		width: 100%;
		max-width: 8rem;
		height: 100%;
	}
	
	.navigation__global__horizontal a.link__navigation__parent {
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 1rem;
		font-weight: 500;
		color: var(--color-text-secondary);
		width: 100%;
		height: 100%;
	}
	
	.navigation__global__horizontal .navigation__parent__item .accordion__wrapper {
		position: absolute;
		padding-top: .5rem;
		z-index: 2;
	}
	
	.navigation__global__horizontal .navigation__parent__item:hover .accordion__wrapper {
		grid-template-rows: 1fr;
	}
	
	.navigation__global__horizontal .navigation__parent__item__contact {
		background: var(--color-primary);
		height: 80%;
		border-radius: 2rem;
	}
	
	.navigation__global__horizontal .navigation__parent__item__contact a.link__navigation__parent {
		color: var(--color-background);
	}
	
	.navigation__global__horizontal .accordion__content {
		background: var(--color-darkblue);
		border-radius: 1rem;
	}
	
	.navigation__global__horizontal .navigation__child__item:first-child {
		padding-top: 1rem;
	}
	
	.navigation__global__horizontal .navigation__child__item:last-child {
		padding-bottom: 1rem;
	}
	
	.navigation__global__horizontal .navigation__child__item a {
		font-weight: 700;
		color: var(--color-background);
		width: 100%;
		text-align: center;
		padding: .75rem 0;
	}
	
	.navigation__global__horizontal li.navigation__child__item a::after {
		content: none;
	}
	
	.navigation__global__horizontal .link__navigation__parent__label {
		position: relative;
		width: 100%;
		min-height: 1.5em;
		overflow: hidden;
	}
	
	.navigation__global__horizontal .link__navigation__parent__label__en,
	.navigation__global__horizontal .link__navigation__parent__label__ja {
		position: absolute;
		display: block;
		top: 50%;
		left: 50%;
		white-space: nowrap;
		transition: transform .2s, opacity .2s;
	}
	
	.navigation__global__horizontal .link__navigation__parent__label__en {
		transform: translate(-50%, -50%);
	}
	
	.navigation__global__horizontal .link__navigation__parent__label__ja {
		opacity: 0;
		transform: translate(-50%, 150%);
	}
	
	.navigation__global__horizontal .navigation__parent__item:hover .link__navigation__parent__label__en {
		opacity: 0;
		transform: translate(-50%, -150%);
	}
	
	.navigation__global__horizontal .navigation__parent__item:hover .link__navigation__parent__label__ja {
		opacity: 1;
		transform: translate(-50%, -50%);
	}	
}

@media screen and (min-width: 992px) {
	.navigation__global__horizontal a.link__navigation__parent {
		font-size: 1.25rem;
	}

	.navigation__global__horizontal .navigation__parent__item {
		max-width: 10rem;
	}
}

/* フッターナビゲーション .navigation__footer
--------------------------------------------- */
.navigation__footer .navigation__parent {
	display: block;
	list-style: none;
}

.navigation__footer .link__navigation__parent {
	color: #fff;
	font-size: .9rem;
}

.navigation__footer .navigation__parent__item {
	display: inline-block;
}

.navigation__footer .navigation__parent__item:not(:last-child) {
	margin-right: 1.25em;
	padding-right: 1.25em;
	border-right: 1px solid #ddd;
}

/*--------------------------------------------------------------
# ドロワー
--------------------------------------------------------------*/
/* ドロワー展開時のbodyスクロール禁止
--------------------------------------------- */
body.drawer__open {
	width: 100%;
	height: 100%;
	position: fixed;
}

/* ハンバーガーアイコン
--------------------------------------------- */
@media screen and (max-width: 767px) {
	.drawer__button__label {
		position: relative;
		display: flex;
		height: var(--header-height);
		width: var(--header-height);
		justify-content: center;
		align-items: center;
		margin-left: auto;
		top: 0;
		right: 0;
		z-index: 90;
		transition: 0.2s;
		cursor: pointer;
	}
	
	.drawer__button__bars {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		color: var(--color-text-secondary);
		transition: color .5s;
	}
	
	.drawer__button__bars::before {
		content: '\f0c9';
		position: relative;
		display: block;
		font-family: var(--fontawesome);
		font-size: 2.75rem;
		line-height: 1em;
		z-index: 99;
	}
	
	#drawer__button__checkbox:checked ~ .drawer__button__bars::before {
		content: '\f00d';
	}
	
	#drawer__button__checkbox {
		display: none;
	}

	.drawer__body {
		position: absolute;
		display: grid;
		grid-template-rows: 0fr;
		width: 100%;
		left: 0;
		transition: grid-template-rows .3s;
	}
	
	#drawer__button__checkbox:checked ~ .drawer__body {
		grid-template-rows: 1fr;
	}
	
	.accordion__content {
		overflow: hidden;
	}

	.drawer__unshown__background {
		position: fixed;
		background: #000;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		transition: opacity var(--duration-default) var(--duration-default), visibility  var(--duration-default) var(--duration-default);
		visibility: hidden;
		opacity: 0;
		z-index: 2;
	}

	.site__header__inner:has(#drawer__button__checkbox:checked) ~ .drawer__unshown__background {
		visibility: visible;
		opacity: .75;
	}
}

@media screen and (min-width: 768px) {
	.drawer__wrapper,
	.drawer__unshown__background {
		display: none;
	}
}

/* ドロワー内のナビゲーション
--------------------------------------------- */
@media screen and (max-width: 767px) {
	.drawer__inner {
		overflow: hidden;
	}
	
	.navigation__drawer {
		background: var(--color-background);
		width: 100%;
		min-height: 100%;
		padding: 1rem 0;
		border-radius: 1rem;
	}

	.navigation__drawer .navigation__parent {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.navigation__drawer .navigation__parent__item {
		width: 100%;
	}

	.navigation__drawer .link__navigation__parent {
		justify-content: center;
		color: var(--color-primary);
		font-weight: 700;
		text-decoration: none;
		width: 100%;
		padding: .5rem;
	}
}

/*--------------------------------------------------------------
# ヘッダー 
--------------------------------------------------------------*/
.site__header {
	position: fixed;
	width: 100%;
	height: var(--header-height);
	top: 0;
	left: 0;
	padding: 10px 0;
	transition: opacity var(--duration-default);
	opacity: 1;
	z-index: 90;
}

.scrollDown .site__header {
	opacity: 0;
	pointer-events: none;
}

.site__header__inner {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1.5rem;
	background: var(--color-primary);
	width: 100%;
	height: 100%;
	padding: 0 .5rem 0 1.5rem;
	border-radius: 2.75rem;
	z-index: 3;
}

.site__header .container {
	width: var(--container-width);
	max-width: var(--container-max-width);
}

.site__header__logo {
	position: relative;
	height: 60%;
	z-index: 81;
}

.site__header__logo .site__logo {
	width: auto;
	height: 100%;
}

/*--------------------------------------------------------------
# フッター .site__footer
--------------------------------------------------------------*/
.site__footer__inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: .9rem;
	padding: calc(var(--section-padding) / 4) 0;
}

@media screen and (max-width: 767px) {
	.site__footer__inner {
		flex-direction: column;
		gap: 1.5rem;
	}
}

/*--------------------------------------------------------------
# サブヘッダー .sub-header
--------------------------------------------------------------*/
.sub-header {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 240px;
}

.sub-header__title {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin: 0;
}

.sub-header__title__en {
	font-family: var(--font-accent-heading);
	font-size: 2rem;
	font-weight: 700;
	color: #eea200;
	letter-spacing: .1em;
}

.sub-header__title__ja {
	position: relative;
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: .9rem;
	font-weight: 500;
	color: var(--color-text-primary);
	letter-spacing: .2em;
}

.sub-header__title__ja::before,
.sub-header__title__ja::after {
	content: '';
	display: block;
	background: var(--color-text-primary);
	width: 2rem;
	height: 1px;
}

@media screen and (min-width: 992px) {
	.sub-header__title__en {
		font-size: 2.5rem;
	}
}

/*--------------------------------------------------------------
# パンくずリスト .breadcrumb
--------------------------------------------------------------*/
.breadcrumb__wrapper {
	background: var(--color-background-yellow);
	overflow-x: scroll;
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.breadcrumb__wrapper::-webkit-scrollbar {
	display: none;
}

.breadcrumb {
	font-size: .75rem;
	font-weight: 500;
	color: var(--color-primary);
	list-style: none;
	width: var(--container-width);
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: .5rem 0;
	white-space: nowrap;
}

.breadcrumb > li {
	display: inline-flex;
	color: #888;
	padding: 0 1em;
}

.breadcrumb > li:first-child {
	padding-left: 0;
}

.breadcrumb > li:not(:last-child) {
	border-right: 1px solid #888;
}

.breadcrumb a {
	color: var(--color-primary);
}

/*--------------------------------------------------------------
# CTA .section__cta
--------------------------------------------------------------*/
.section__cta {
	background: var(--color-background-yellow);
	padding: var(--section-padding) 0;
}

.section__cta .section__title,
.section__cta .contact__text {
	margin-bottom: 1.5rem;
}

.section__cta a[class*=button__]:not(:first-child) {
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
}

.section__cta__inner {
	background: var(--color-background-tertiary);
	padding: 2.5rem 1rem 0 1rem;
	border-radius: 1rem;
}

.site__main__single .section__cta {
	padding-top: 0;
}

@media screen and (min-width: 768px) {
	.section__cta .form__image__wrapper {
		max-width: 640px;
	}
}

/*--------------------------------------------------------------
# アーカイブ
--------------------------------------------------------------*/
.archive__body {
	background: var(--color-background-yellow);
	padding: calc(var(--section-padding) / 2) 0;
}

.column__wrapper {
	position: relative;
	display: grid;
	gap: 3rem;
}

@media screen and (min-width: 992px) {
	.column__wrapper {
		grid-template-columns: 200px 1fr;
	}
}

/* .post__wrapper
--------------------------------------------- */
.post__wrapper {
	display: grid;
	gap: 3rem;
}

@media screen and (min-width: 768px) {
	.post__wrapper {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ポスト .archive__post__entry
--------------------------------------------- */
.archive__post__link {
	display: block;
	width: 100%;
	height: 100%;
	text-decoration: none;
	cursor: pointer;
}

.archive__post__meta {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1rem;
}

.archive__post__thumbnail {
	aspect-ratio: 7 / 4;
	margin-bottom: .75rem;
	border-radius: .5rem;
	overflow: hidden;
}

.archive__post__thumbnail img {
	object-fit: cover;
	width: 100%;
	height: 100%;
	transition: transform var(--duration-default);
}

.archive__post__link:hover .archive__post__thumbnail img {
	transform: scale(1.05);
}

.archive__post__entry__title {
	color: var(--color-text-primary);
	font-size: 1rem;
	font-weight: 500;
	margin: 0;
	line-height: 2em;
	transition: color var(--duration-default);
}

.archive__post__link:hover .archive__post__entry__title {
	color: var(--color-primary);
}

.archive__post__category__list {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: .25rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.archive__post__category {
	display: inline-block;
	background: var(--color-primary);
	color: var(--color-text-secondary);
	font-size: .9rem;
	font-weight: 500;
	width: fit-content;
	line-height: 1em;
	padding: .75em 1.25em;
	border-radius: 1.5rem;
}

.archive__post__entry__clientName {
	font-size: .75rem;
	font-weight: 500;
	color: var(--color-primary);
	margin-top: .5rem;
}

@media screen and (min-width: 768px) {
	.archive__post__entry__title {
		font-size: 1.25rem;
	}

	.archive__post__entry__clientName {
		margin-top: .75rem;
	}
}

/* カテゴリーリスト .list__categories
--------------------------------------------- */
.list__categories {
	display: flex;
	list-style: none;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 0;
	padding: 0;
}

.list__categories__item {
	font-size: .9rem;
	font-weight: 500;
}

li.list__categories__item a {
	display: inline-block;
	background: var(--color-text-secondary);
	color: var(--color-primary);
	text-decoration: none;
	padding: .5em 1em;
	border: 2px solid var(--color-primary);
	border-radius: 1.5rem;
	line-height: 1em;
	text-align: center;
	transition: background-color var(--duration-default);
}

li.list__categories__item a:hover {
	background: #8b7a5c24;
}

li.list__categories__item.current a {
	background: var(--color-primary);
	color: var(--color-text-secondary);
}

@media screen and (max-width: 767px) {
	li.list__categories__item {
		width: 100%;
	}

	li.list__categories__item a {
		width: 100%;
		padding: 1em;
	}
}

@media screen and (min-width: 992px) {
	.list__categories__wrapper {
		position: sticky;
		top: calc(var(--header-height) + 1rem);
		height: fit-content;
		transition: top var(--duration-default);
	}

	.scrollDown .list__categories__wrapper {
		top: 1rem;
	}

	.list__categories {
		flex-direction: column;
	}

	li.list__categories__item a {
		width: 100%;
		padding: 1em;
	}
}

/* カテゴリーリストオープナー #list__categories__opener
--------------------------------------------- */
.list__categories__checkbox,
.list__categories__opener__label {
	display: none;
}

@media screen and (max-width: 991px) {
	.list__categories__wrapper {
		background: #eee9e2;
		border-radius: .5rem;
	}

	.list__categories__opener__label {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: .5rem;
		color: var(--color-primary);
		font-size: 1rem;
		font-weight: 500;
		width: 100%;
		padding: 1rem;
		cursor: pointer;
	}

	.list__categories__opener__label::before {
		content: '\f00e';
		font-family: var(--fontawesome-sharp);
		font-weight: 400;
	}

	#list__categories__opener:checked ~ .list__categories__opener__label::before {
		content: '\f010';
	}

	.list__categories__inner {
		display: grid;
		grid-template-rows: 0fr;
		width: 100%;
		transition: grid-template-rows var(--duration-default);
	}

	.list__categories {
		padding: 0 1rem;
		overflow: hidden;
	}

	#list__categories__opener:checked ~ .list__categories__inner {
		grid-template-rows: 1fr;
	}

	li.list__categories__item:last-child {
		padding-bottom: 1rem;
	}
}

/* ページネーション
--------------------------------------------- */
.navigation.pagination {
	width: fit-content;
	margin: calc(var(--section-padding) / 2) auto 0;
}

.nav-links {
	width: fit-content;
}

ul.page-numbers {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: .25rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.page-numbers > li {
	display: block;
}

ul.page-numbers > li > * {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #fff;
	width: 2.5rem;
	height: 2.5rem;
	line-height: 1em;
	border-radius: 50%;
	transition: background-color .2s;
}

ul.page-numbers > li a {
	font-weight: 500;
	color: var(--color-primary);
	background: #fff;
	text-decoration: none;
	border: 2px solid var(--color-primary);
}

ul.page-numbers > li a:hover {
	background: #8b7a5c24;
}

ul.page-numbers > li > .current {
	color: #fff;
	background: var(--color-primary);
	border: 2px solid var(--color-primary);
}

ul.page-numbers .page-numbers.dots {
	content: '\f141';
	font-family: var(--fontawesome);
	font-weight: 500;
	color: var(--color-primary);
}

@media screen and (min-width: 768px) {
	ul.page-numbers {
		gap: .5rem;
	}

	ul.page-numbers > li > * {
		font-size: 1rem;
		width: 3rem;
		height: 3rem;
		line-height: 1em;
	}
}

@media screen and (min-width: 992px) {
	.navigation.pagination {
		grid-column: 2 / 3;
	}
}

/*--------------------------------------------------------------
# シングル
--------------------------------------------------------------*/
.single__section {
	background: var(--color-background-yellow);
}

.single__section:not(:last-child) {
	padding-bottom: var(--section-padding);
}

.single__section__post__header {
	margin-top: 240px;
}

.single__section__post__header:not(:last-child),
.single__section__post__meta:not(:last-child) {
	padding-bottom: calc(var(--section-padding) / 2);
}

.single__post__thumbnail {
	aspect-ratio: 7 / 4;
	margin-top: calc((160px - (var(--section-padding) / 2)) * -1);
	margin-bottom: .75rem;
	border-radius: 1rem;
	overflow: hidden;
}

.single__post__thumbnail img {
	object-fit: cover;
	width: 100%;
	height: 100%;
	transition: transform var(--duration-default);
}

.single__post__category__list {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: .5rem;
	list-style: none;
	margin: 0 0 3rem 0;
	padding: 0;
}

a.single__post__category {
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 500;
	background: var(--color-primary);
	color: #fff;
	width: fit-content;
	line-height: 1em;
	padding: 1.25em 2em;
	border-radius: 2rem;
	text-decoration: none;
	transition: color var(--duration-default), background-color var(--duration-default);
}

a.single__post__category:hover {
	background: #fff;
	color: var(--color-primary);
}

.single__post__client {
	font-weight: 700;
	margin-bottom: 1rem;
}

.single__post__title {
	font-size: 1.25rem;
	margin: 0 0 1.5rem;
	line-height: 1.75em;
}

a.single__post__sitelink {
	color: var(--color-primary);
	font-weight: 500;
}

.single__section__body {
	font-size: 1rem;
	font-weight: 500;
}

@media screen and (max-width: 767px) {
	a.single__post__category {
		font-size: .75rem;
		padding: 1rem 1.5rem;
	}
}

@media screen and (min-width: 992px) {
	.single__post__title {
		font-size: 1.75rem;
	}	
}

/*--------------------------------------------------------------
# セクション
--------------------------------------------------------------*/
.section__title {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin: 0 0 3.5rem;
}

.section__title__en {
	font-family: var(--font-accent-heading);
	font-size: 2rem;
	font-weight: 700;
	color: #eea200;
	letter-spacing: .1em;
}

.services__front__section .section__title__en,
.message__front__section .section__title__en {
	color: #EB6661;
}

.contact__front__section .section__title__en,
.section__cta .section__title__en {
	color: #af203a;
}

.section__title__ja {
	position: relative;
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: .9rem;
	font-weight: 500;
	color: var(--color-text-primary);
	letter-spacing: .2em;
}

.section__title__ja::before,
.section__title__ja::after {
	content: '';
	display: block;
	background: var(--color-text-primary);
	width: 2rem;
	height: 1px;
}

@media screen and (min-width: 992px) {
	.section__title__en {
		font-size: 2.5rem;
	}
}

/*--------------------------------------------------------------
# メインビジュアル #top
--------------------------------------------------------------*/
#top .container {
	max-width: 100%;
	padding-bottom: calc(var(--section-padding) / 2);
}

.main-visual__wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	aspect-ratio: 5 / 7;
	width: 100%;
	max-height: calc(100vh - var(--header-height));
}

.main-visual__content {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 3rem;
	width: 100%;
	height: 90%;
	z-index: 1;
}

.main-visual__copy {
	font-family: var(--font-accent-handwriting);
	font-size: min(8vw, 3rem);
	font-weight: 700;
	text-align: center;
	line-height: 1.75em;
}

.main-visual__background {
	position: absolute;
	width: 100%;
	height: 90%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 0;
}

.main-visual__background > img {
	display: block;
	width: 100%;
	height: 100%;
}

.main-visual__background__vertical {
	display: none !important;
}

@media (orientation: portrait) {
	.main-visual__background__vertical {
		display: block !important;
	}

	.main-visual__background__horizonal {
		display: none !important;
	}
}

@media screen and (min-width: 768px) {
	.image__contain {
		width: 80%;
	}
}

/*--------------------------------------------------------------
# セクション サービス
--------------------------------------------------------------*/
.services__front__section {
	background: #eee9e2;
}

.section__services__list {
	display: grid;
	gap: 3rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.section__services__list__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2rem;
}

.section__services__list__item__icon {
	width: 40%;
	max-width: 100px;
}

.section__services__list__item__icon img {
	display: block;
	width: 100%;
	height: auto;
}

.section__services__list__item__text {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
}

.section__services__list__item__title {
	background: var(--color-text-primary);
	color: var(--color-text-secondary);
	font-size: 1.25rem;
	font-weight: 500;
	width: fit-content;
	margin: 0;
	padding: .25em .75em;
}

.section__services__list__item__description {
	display: block;
}

.section__services__list__item__description {
	font-size: 1rem;
	font-weight: 500;
	margin: 0;
	line-height: 2em;
}

@media screen and (max-width: 767px) {
	.section__services__list {
		width: 90%;
		margin: 0 auto;
	}
}

@media screen and (min-width: 768px) {
	.section__services__list {
		gap: 2rem;
		grid-template-columns: repeat(3, 1fr);
	}

	.section__services__list__item__icon {
		width: auto;
		max-width: 100%;
		height: 80px;
	}

	.section__services__list__item__icon img {
		object-fit: contain;
		object-position: center center;
		height: 100%;
	}
}

@media screen and (min-width: 992px) {
	.section__services__list {
		gap: 3rem
	}
}

/*--------------------------------------------------------------
# メッセージ
--------------------------------------------------------------*/
.message__front__section {
	background: #eee9e2;
}

.message__wrapper {
	background: #fff;
	padding: 3rem;
	border-radius: 2rem;
}

.message__title {
	font-family: var(--font-accent-handwriting);
	font-size: min(6.25vw, 2rem);
	font-weight: 400;
	margin: 0 0 1.75rem;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid var(--color-primary);
}

.message__body {
	display: flex;
	gap: 1.75rem;
}

.message__image {
	aspect-ratio: 1 / 1;
	width: 100%;
	max-width: 400px;
	height: fit-content;
	margin-right: auto;
	margin-left: auto;
	border-radius: 50%;
	overflow: hidden;
}

.message__image img {
	display: block;
	object-fit: cover;
	object-position: center 15%;
	width: 100%;
	height: 100%;
}

.message__text {
	font-family: var(--font-accent-serif);
}

.message__name {
	font-size: 1.5rem;
	margin-bottom: 1.5rem;
}

.message__description {
	margin: 0;
	line-height: 2em;
}

.message__description:not(:last-child) {
	margin-bottom: .75em;
}

@media screen and (max-width: 767px) {
	.message__wrapper {
		padding: 2rem;
	}

	.message__title {
		text-align: center;
	}

	.message__body {
		flex-direction: column;
	}

	.message__name {
		text-align: center;
	}
}

@media screen and (min-width: 768px) {
	.message__body {
		align-items: flex-start;
		gap: 3rem;
	}

	.message__image {
		flex: 1;
		width: 100%;
		min-width: 240px;
	}

	.message__text {
		width: fit-content;
	}
}

@media screen and (min-width: 1200px) {
	.message__body {
		align-items: center;
	}
}

/*--------------------------------------------------------------
# お問い合わせ
--------------------------------------------------------------*/
#contact .container {
	max-width: 880px;
}

#contact .section__title {
	margin-bottom: 1.75rem;
}

.contact__front__section {
	background: var(--color-background-tertiary);
}

.contact__section__inner {
	position: relative;
	background: #fff;
	margin-top: -4px;
	padding: 2rem 1rem 3.5rem;
	border: 2px solid #1d1d1b;
	border-radius: 2rem;
	z-index: 2;
}

.contact__text {
	text-align: center;
	margin: 0 0 3.5rem;
}

.contact__description {
	font-weight: 500;
	margin: 0;
	line-height: 2em;
}

.form__image__wrapper {
	position: relative;
	display: flex;
	gap: .5rem;
	width: 85%;
	margin-right: auto;
	margin-left: auto;
	z-index: 1;
}

.form__parameter {
	display: none !important;
}

@media screen and (max-width: 767px) {
	.form__image__wrapper .image__contain:nth-child(2) {
		display: none;
	}
}

@media screen and (min-width: 768px) {
	.contact__section__inner {
		padding: 5rem;
	}
}

/*--------------------------------------------------------------
# 404
--------------------------------------------------------------*/
.error__section h2.section__title {
	margin-bottom: calc(var(--section-padding) / 4);
}

.error__404__message {
	font-size: 1rem;
	font-weight: 500;
	margin: 0;
	line-height: 2em;
}

.site__main__error {
	gap: calc(var(--section-padding) / 2);
}

@media screen and (min-width: 768px) {
	.site__main__error {
		justify-content: center;
		padding-top: 0;
	}

	.error__404__message {
		text-align: center;
	}
}

/*--------------------------------------------------------------
# グーテンベルク
--------------------------------------------------------------*/
.single__content__wrapper > * {
	margin-bottom: 0;
}

.single__content__wrapper > *:first-child {
	margin-top: 0;
}

.single__content__wrapper > *:not(:first-child) {
	margin-top: calc(var(--section-padding) / 2);
	
}

/* youtube */
.wp-block-embed-youtube iframe {
	aspect-ratio: 16 / 9;
	width: 100%;
	height: auto;
}

/* model-viewer */
model-viewer {
	background: #fff;
}

wp-model-viewer {
	display: block;
}

wp-model-viewer:not(:last-child) {
	margin-bottom: 2rem;
}

/* gallery */
.single__content__wrapper .wp-block-gallery {
	display: grid;
	gap: 1.5rem !important;
}

.single__content__wrapper .wp-block-gallery figure.wp-block-image {
	width: 100% !important;
}

@media screen and (min-width: 768px) {
	.single__content__wrapper .wp-block-gallery.columns-2 {
		grid-template-columns: repeat(2, 1fr);
	}
}

/*--------------------------------------------------------------
# Webフォントちらつき防止
--------------------------------------------------------------*/
html {
	visibility: hidden;
}

html.wf-active,
html.wfno-load {
	visibility: visible;
}

/*--------------------------------------------------------------
# Google reCaptcha
--------------------------------------------------------------*/
.grecaptcha-badge { visibility: hidden; }

.term__recaptcha {
	font-size: .75rem;
	text-align: center;
	line-height: 1.75em;
}

.term__recaptcha a {
	color: var(--color-primary);
}