/*--------------------------------------------------------------
# Link Component (リンクコンポーネント)
--------------------------------------------------------------*/

.link-container {
	display: flex;
}

.link {
	align-items: center;
	color: var(--color-text);
	display: flex;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 2.4rem; /* 24px */
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: color 0.3s linear;
}

.link--sub {
	font-size: 1.2rem; /* 12px */
	color: var(--color-text-80);
}

.link--disc {
	gap: 0.4rem; /* 4px */
}

.link--disc:before {
	aspect-ratio: 1;
	background-color: var(--color-ui);
	content: "";
	display: block;
	height: 0.4rem; /* 4px */
	margin: 1.2rem; /* 12px */
	width: 0.4rem; /* 4px */
}

.link__text {
	display: block;
	position: relative;
	overflow: hidden;
}

.link__text:after {
	background-color: var(--color-ui-40);
	bottom: 0.2rem; /* 2px */
	content: "";
	height: 1px;
	left: -100%;
	position: absolute;
	transition: transform 0.3s cubic-bezier(0.85, 0, 0.15, 1);
	width: 100%;
}

@media (hover: hover) and (pointer: fine) {
	.link:hover .link__text:after {
		transform: translate(200%);
	}
}

/* Instagram button */
.instagram-button-container,
.instagram-button-l-container {
	margin-bottom: 3.2rem; /* 32px - 下の余白を少し開ける */
	--color-button: #3a833d;
}

.instagram-button {
	align-items: center;
	border-radius: 1.2rem; /* 12px */
	display: flex;
	gap: 1.2rem; /* 12px */
	height: 4.8rem; /* 48px */
	max-width: 32.0rem; /* 320px */
	overflow: hidden;
	padding: 0 2.4rem; /* 24px */
	position: relative;
	z-index: 1;
	text-decoration: none;
	color: var(--color-text);
}

.instagram-button:before {
	background-color: var(--color-primary-light) !important; /* 確実に適用されるように */
	border-radius: 1.2rem; /* 12px */
	content: "";
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	transition: opacity 0.3s cubic-bezier(0, 0.55, 0.45, 1);
	opacity: 1; /* 明示的にopacityを設定 */
}

.instagram-button:hover:before {
	opacity: 0.6;
}

.instagram-button__icon {
	aspect-ratio: 1;
	background-color: var(--color-ui);
	display: block;
	width: 1.6rem; /* 16px */
	-webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath fill='%23282D27' d='M8 1.442c2.136 0 2.39.008 3.233.047 2.168.098 3.181 1.127 3.28 3.279.038.843.046 1.097.046 3.233s-.008 2.389-.046 3.232c-.1 2.15-1.11 3.181-3.28 3.28-.844.038-1.096.046-3.233.046s-2.39-.008-3.233-.046c-2.173-.1-3.18-1.133-3.279-3.28-.039-.844-.047-1.096-.047-3.233s.009-2.389.047-3.233c.1-2.151 1.11-3.18 3.28-3.279C5.61 1.45 5.863 1.442 8 1.442M8 0C5.827 0 5.555.01 4.702.048 1.797.181.182 1.793.049 4.701.009 5.555 0 5.827 0 8s.01 2.445.048 3.299c.133 2.905 1.745 4.52 4.653 4.653C5.555 15.991 5.827 16 8 16s2.445-.01 3.299-.048c2.902-.133 4.521-1.745 4.652-4.653.04-.854.049-1.126.049-3.299s-.01-2.445-.048-3.298c-.13-2.903-1.745-4.52-4.653-4.653C10.445.009 10.173 0 8 0m0 3.892a4.108 4.108 0 1 0 0 8.216 4.108 4.108 0 0 0 0-8.216m0 6.775a2.666 2.666 0 1 1 0-5.333 2.666 2.666 0 0 1 0 5.333m4.27-7.897a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath fill='%23282D27' d='M8 1.442c2.136 0 2.39.008 3.233.047 2.168.098 3.181 1.127 3.28 3.279.038.843.046 1.097.046 3.233s-.008 2.389-.046 3.232c-.1 2.15-1.11 3.181-3.28 3.28-.844.038-1.096.046-3.233.046s-2.39-.008-3.233-.046c-2.173-.1-3.18-1.133-3.279-3.28-.039-.844-.047-1.096-.047-3.233s.009-2.389.047-3.233c.1-2.151 1.11-3.18 3.28-3.279C5.61 1.45 5.863 1.442 8 1.442M8 0C5.827 0 5.555.01 4.702.048 1.797.181.182 1.793.049 4.701.009 5.555 0 5.827 0 8s.01 2.445.048 3.299c.133 2.905 1.745 4.52 4.653 4.653C5.555 15.991 5.827 16 8 16s2.445-.01 3.299-.048c2.902-.133 4.521-1.745 4.652-4.653.04-.854.049-1.126.049-3.299s-.01-2.445-.048-3.298c-.13-2.903-1.745-4.52-4.653-4.653C10.445.009 10.173 0 8 0m0 3.892a4.108 4.108 0 1 0 0 8.216 4.108 4.108 0 0 0 0-8.216m0 6.775a2.666 2.666 0 1 1 0-5.333 2.666 2.666 0 0 1 0 5.333m4.27-7.897a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92'/%3E%3C/svg%3E");
	-webkit-mask-position: center center;
	mask-position: center center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.instagram-button__text {
	display: block;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 1.4rem; /* 14px */
	line-height: 1.2;
	overflow: hidden;
	position: relative;
}

.instagram-button__text__inner {
	display: block;
}

/* 右側: 情報セクション */
.menu__info {
	background-color: #282d27;
	display: flex;
	position: relative;
	width: 60%;
}

.menu__info__bg,
.menu__info__bg:after {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.menu__info__bg:after {
	background-color: #282d27a3;
	content: "";
	display: block;
}

.menu__info__bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.menu__info__container {
	display: flex;
	flex-direction: column;
	gap: 4.0rem; /* 40px */
	justify-content: space-between;
	max-width: 80.0rem; /* 800px */
	min-height: 100%;
	padding: 19.2rem 8.0rem 8.0rem; /* 192px 80px 80px */
	position: relative;
	width: 100%;
}

.menu__info__schedule {
	flex-shrink: 0;
}

.menu__info__footer {
	align-items: flex-end;
	display: flex;
	gap: 2.4rem; /* 24px */
	justify-content: space-between;
}

.menu__info__access {
	flex-shrink: 0;
}

.menu__info__access__title {
	color: var(--color-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 1.8rem; /* 18px */
	font-weight: 600;
	margin-bottom: 0.8rem; /* 8px */
}

.menu__info__access__text {
	color: var(--color-text);
	font-size: 1.4rem; /* 14px */
	line-height: 1.8;
}

.menu__info__access__text__link {
	color: var(--color-text);
	text-decoration: underline;
}

/* Schedule table styles (営業時間テーブル) */
.schedule {
	color: var(--color-text);
}

.schedule__table {
	border-collapse: collapse;
	width: 100%;
}

.schedule__table__head .schedule__table__row {
	border-bottom: 1px solid var(--color-ui-white-40);
	height: 7.2rem; /* 72px */
}

.schedule__table__tbody .schedule__table__row {
	border-bottom: 1px solid var(--color-ui-white-40);
	height: 11.2rem; /* 112px */
}

.schedule__table__column {
	position: relative;
	width: 13.8rem; /* 138px */
}

.schedule__table__column:first-child {
	width: 22.0rem; /* 220px */
	text-align: left;
}

.schedule__table__heading {
	color: var(--color-text-white);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 1.4rem; /* 14px */
	font-weight: 600;
	line-height: 1;
}

.schedule__table__time {
	color: var(--color-text-white-80);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 1.6rem; /* 16px */
	line-height: 1.8;
}

.schedule__table__note {
	color: var(--color-text-white-80);
	font-size: 1.2rem; /* 12px */
	line-height: 1.8;
}

.schedule__table__open {
	aspect-ratio: 1;
	background-color: var(--color-text-white);
	border-radius: 50%;
	margin: auto;
	width: 1.6rem; /* 16px */
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}

/* 火曜日予約制用の★アイコン */
.schedule__table__open--reservation {
	background-color: transparent;
}

.schedule__table__open--reservation i {
	color: var(--color-primary);
	font-size: 1.6rem; /* 16px */
	line-height: 1;
}

/* フッター側の表の★アイコンは白にする */
.footer-hours .schedule__table__open--reservation i {
	color: var(--color-text-white);
}

.schedule__table__close {
	background-color: var(--color-ui-white-40);
	height: 0.2rem; /* 2px */
	margin: auto;
	width: 1.2rem; /* 12px */
}

.schedule__table__annotation {
	bottom: calc(50% + 0.4rem); /* 4px */
	color: var(--color-text-white-80);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 2.0rem; /* 20px */
	left: calc(50% + 0.6rem); /* 6px */
	line-height: 1;
	position: absolute;
}

.schedule__note {
	margin-top: 2.4rem; /* 24px */
}

.schedule__note__item {
	align-items: flex-start;
	color: var(--color-text-white-80);
	display: flex;
}

.schedule__note__item__text {
	font-size: 1.4rem; /* 14px */
	line-height: 1.8;
}

/* 火曜日予約制のアイコン */
.schedule__note__item--reservation {
	align-items: center;
}

.schedule__note__item__icon {
	display: inline-block;
	color: var(--color-text-white);
	font-size: 1.4rem; /* 14px */
	margin-right: 0.4rem; /* 4px */
	line-height: 1;
}

.schedule__note__item__icon i {
	color: var(--color-text-white);
	font-size: inherit;
}

.c-object-fit-cover {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

/* Desktop Navigation (デスクトップナビゲーション) */
@media screen and (min-width: 993px) {
	.header__menu-trigger__text {
		display: block;
	}

	/* デスクトップでも全画面メニューを表示可能にする（テスト用） */
	.site-header.menu-open > .menu {
		display: block !important;
		animation: menuFadeIn 0.3s cubic-bezier(0, 0.55, 0.45, 1);
	}

	.header__nav {
		display: block;
	}

}

@media screen and (max-width: 992px) {
	.header__nav {
		display: none;
	}

	.header__menu-trigger__text {
		display: none;
	}

	/* タブレット以下では全画面メニューを表示可能 */
	.site-header.menu-open > .menu {
		display: block !important;
		animation: menuFadeIn 0.3s cubic-bezier(0, 0.55, 0.45, 1);
	}

	.menu__nav__container {
		flex-wrap: wrap;
	}


	.menu__nav__page {
		border-right: 1px solid rgba(255, 253, 246, 0.4);
		flex: 50%;
	}

	.menu__nav__other {
		flex: 50%;
	}
}

@media screen and (min-width: 993px) and (max-width: 1200px) {
	.menu__nav__container {
		gap: 6.0rem; /* 60px */
		padding: 19.2rem 6.0rem 8.0rem; /* 192px 60px 80px */
	}

	.menu__info__container {
		padding: 19.2rem 6.0rem 8.0rem; /* 192px 60px 80px */
	}
}

@media screen and (max-width: 768px) {
	/* .header__lead 関連のスタイルは header.css に定義済み */
	/* .header__menu-trigger 関連のスタイルは header.css に定義済み */

	.site-header > .menu {
		border-radius: 1.6rem; /* 16px */
		bottom: 0.4rem; /* 4px */
		left: 0.4rem; /* 4px */
		right: 0.4rem; /* 4px */
		top: 0.4rem; /* 4px */
	}

	/* モバイルでは全画面メニューを表示 */
	.site-header.menu-open > .menu {
		display: block !important;
		animation: menuFadeIn 0.3s cubic-bezier(0, 0.55, 0.45, 1);
	}

	.menu__nav__container {
		flex-direction: column;
		padding: 12.0rem 3.6rem 8.0rem; /* 120px 36px 80px */
		gap: 0;
	}

	.menu__nav__main {
		width: 100%;
	}

	.menu__info {
		display: none;
	}

	.list {
		gap: 1.2rem; /* 12px */
	}

	.list__item {
		gap: 1.2rem; /* 12px */
	}

	.instagram-button-container {
		margin-bottom: 3.2rem; /* 32px */
	}

	.schedule__table__head .schedule__table__row {
		height: 4.8rem; /* 48px */
	}

	.schedule__table__tbody .schedule__table__row {
		height: 7.2rem; /* 72px */
	}

	.schedule__table__heading {
		font-size: 1.2rem; /* 12px */
	}

	.schedule__table__time {
		font-size: 1.2rem; /* 12px */
	}

	.schedule__table__note {
		font-size: 1.1rem; /* 11px */
	}

	.schedule__table__open {
		width: 1.2rem; /* 12px */
	}

	.schedule__table__close {
		width: 0.8rem; /* 8px */
	}

	.schedule__table__annotation {
		bottom: calc(50% + 0.1rem); /* 1px */
		font-size: 1.6rem; /* 16px */
		left: calc(50% + 0.8rem); /* 8px */
	}

	.schedule__note {
		margin-top: 1.6rem; /* 16px */
	}

	.schedule__note__item {
		gap: 0.4rem; /* 4px */
	}

	.schedule__note__item__text {
		font-size: 1.2rem; /* 12px */
	}
}

.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
	margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

/* Posts and pages (投稿とページ)
--------------------------------------------- */
.sticky {
	display: block;
}

.post,
.page {
	margin: 0;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* Comments
--------------------------------------------- */
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

