@charset "UTF-8";

/* ============================================================
   CSS Variables
   ============================================================ */
:root {
	--color-dark:      #454c50;
	--color-white:     255 255 255;
	--color-light-bg:  #f0f0f0;
	--color-gray-bg:   #d9d9d9;
	--color-red:       #cc0000;
	--color-border:    #d0d0d0;
	--color-accent:    #516c8d;
	--font-en:         'Marcellus', serif;
	--font-ja:         'Noto Sans JP', sans-serif;
	--font-tel:        'Bebas Neue', sans-serif;
	--font-enContact:  'Roboto', sans-serif;

	--hero-text-h: 45vh;
	--hero-full-h: 100vh;
}

/* ============================================================
   Reset / Base
   ============================================================ */
	*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
	html { scroll-behavior: smooth; }
	body {
		font-family: var(--font-ja);
		color: var(--color-dark);
		background: rgb(var(--color-white));
		overflow-x: clip; /* hiddenはfixed要素をクリップする場合があるためclipを使用 */
	}
	body:not(.indexP) {	
			background: url("../images/share/header-bg.png") top right no-repeat;
			background-size: 40% auto;
	}
	img { display: block; max-width: 100%; }
	a   { text-decoration: none; color: inherit; }
	ul, ol { list-style: none; }
	button { cursor: pointer; border: none; background: none; font-family: inherit; }
	h1, h2, h3, h4, h5, h6 {
		font-size: 100%;
		font-weight: normal;
	}

/* ============================================================
   Utility
   ============================================================ */
	.inbl { display: inline-block; }
	.tel-font { font-family: var(--font-tel); }

/* ============================================================
   loading
   ============================================================ */
	.loading {
		position: fixed;
		inset: 0;
		z-index: 99999;
		background: rgb(var(--color-white));
		display: flex;
		align-items: center;
		justify-content: center;
		transition: opacity .6s ease;
	}
	.loading.is-hidden {
		opacity: 0;
		pointer-events: none;
	}
	.loading__logo {
		width: clamp(180px, 20vw, 320px);
		height: auto;
		animation: loading-pulse 1.6s ease-in-out infinite;
	}
	@keyframes loading-pulse {
		0%, 100% { opacity: 1; }
		50%       { opacity: .25; }
	}

/* ============================================================
   site-header
   ロゴとメニューボタンをまとめる fixed コンテナ。
   site-header 自体は pointer-events: none で透過し、
   子要素だけをクリック可能にする。
   ============================================================ */
	.site-header {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 300;
		pointer-events: none;
	}
	.site-header__logo {
		position: absolute;
		top: clamp(14px, 1.04vw, 20px);
		left: clamp(16px, 1.56vw, 30px);
		pointer-events: auto;
		transition: opacity .4s;
	}
	.site-header__logo img {
		width: min(clamp(240px, 40.3vw, 484px), calc(100vw - 116px));
		height: auto;
	}

/* ============================================================
   menu-btn
   ============================================================ */
	.menu-btn {
		position: fixed;
		top: clamp(10px, 1.04vw, 20px);
		right: clamp(10px, 1.04vw, 20px);
		width:  clamp(80px, 9.27vw, 102px);
		height: clamp(80px, 9.27vw, 102px);
		border-radius: 50%;
		background: var(--color-dark);
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		z-index: 300;
		transition: background .3s;
		gap: 0;
		padding: 0;
		pointer-events: auto; /* site-header の pointer-events: none を上書き */
	}
	.menu-btn__bars {
		position: relative;
		width: clamp(28px, 2.22vw, 36px);
		height: clamp(20px, 1.67vw, 24px);
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	.menu-btn__bars span {
		display: block;
		width: 100%;
		height: 1.5px;
		background: rgb(var(--color-white));
		transition: transform .35s ease, opacity .2s ease;
		transform-origin: center center;
		position: absolute;
		left: 0;
	}
	.menu-btn__bars span:nth-child(1) { top: 0; }
	.menu-btn__bars span:nth-child(2) { top: 50%; transform: translateY(-50%); }
	.menu-btn__bars span:nth-child(3) { bottom: 0; }

	.menu-btn.is-open .menu-btn__bars span:nth-child(1) {
		top: 50%;
		transform: translateY(-50%) rotate(45deg);
	}
	.menu-btn.is-open .menu-btn__bars span:nth-child(2) { opacity: 0; }
	.menu-btn.is-open .menu-btn__bars span:nth-child(3) {
		bottom: auto;
		top: 50%;
		transform: translateY(-50%) rotate(-45deg);
	}
	.menu-btn__label {
		font-family: var(--font-en);
		font-size: clamp(11px, 1.11vw, 16px);
		letter-spacing: .14em;
		color: rgb(var(--color-white));
		line-height: 1;
		margin-top: clamp(7px, 0.63vw, 9px);
		display: block;
	}

/* ============================================================
   nav-overlay
   ============================================================ */
	.nav-overlay {
		position: fixed;
		inset: 0;
		background: rgba(69, 76, 80, .9);
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
		z-index: 200;
		display: flex;
		align-items: center;
		justify-content: center;
		opacity: 0;
		pointer-events: none;
		transition: opacity .4s ease;
	}
	.nav-overlay.is-open {
		opacity: 1;
		pointer-events: auto;
	}
	.nav-overlay__inner {
		display: flex;
		gap: clamp(48px, 6.25vw, 120px);
		align-items: flex-start;
	}
	.nav-overlay__main {
		display: flex;
		flex-direction: column;
		width: clamp(320px, 38.1vw, 480px);
	}
	.nav-overlay__main li { border-bottom: 1px solid rgba(255,255,255,.2); }
	.nav-overlay__main a {
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		gap: 12px;
		padding: clamp(12px, 1.04vw, 20px) 0;
		color: rgb(var(--color-white));
		transition: background .2s;
		flex-wrap: wrap;
	}
	.nav-overlay__main a:hover { background: rgba(255, 255, 255, .06); }
	.nav-overlay__right {
		display: flex;
		flex-direction: column;
		width: clamp(320px, 38.1vw, 400px);
	}
	.nav-overlay__sub { display: flex; flex-direction: column; }
	.nav-overlay__sub li { border-bottom: 1px solid rgba(255,255,255,.2); }
	.nav-overlay__sub a {
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		gap: 12px;
		padding: clamp(12px, 1.04vw, 20px) 0;
		color: rgb(var(--color-white));
		transition: background .2s;
		flex-wrap: wrap;
	}
	.nav-overlay__sub a:hover { background: rgba(255, 255, 255, .06); }

	/* nav-en / nav-ja はオーバーレイとフッターで共通 */
	.nav-en {
		font-family: var(--font-en);
		font-size: clamp(18px, 1.94vw, 24px);
		letter-spacing: .03em;
		line-height: 1;
		flex-shrink: 0;
		opacity: .75;
	}
	.nav-ja {
		font-size: clamp(12px, 1.11vw, 14px);
		letter-spacing: .1em;
		white-space: nowrap;
		margin-left: auto;
	}

	/* オーバーレイ内のCONTACTボタン */
	.btn-contact {
		display: block;
		margin-top: clamp(20px, 1.67vw, 32px);
		padding: clamp(14px, 1.25vw, 22px) 0;
		background: rgba(220, 235, 240, .2);
		border: 1px solid rgba(220, 235, 240, .5);
		color: rgb(var(--color-white));
		font-family: var(--font-en);
		font-size: clamp(16px, 1.67vw, 20px);
		letter-spacing: .14em;
		text-align: center;
		transition: background .2s;
		width: 100%;
	}
	.btn-contact:hover { background: rgba(220, 235, 240, .35); }

/* ============================================================
   hero
   ============================================================ */
	.hero {
		position: relative;
		height: var(--hero-full-h);
		overflow: hidden;
	}
	.hero__visual {
		position: absolute;
		top: var(--hero-text-h);
		left: 0;
		right: 0;
		bottom: 0;
		border-radius: clamp(30px, 3.13vw, 60px) clamp(30px, 3.13vw, 60px) 0 0;
		overflow: hidden;
		z-index: 0;
	}
	.hero__visual img {
		width: 100%;
		height: 130%;
		object-fit: cover;
		object-position: center center;
		will-change: transform;
		transform: translateY(-10%);
	}
	.hero__text {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: var(--hero-text-h);
		z-index: 10;
		display: flex;
		align-items: center;
		justify-content: center;
		will-change: transform, opacity;
	}
	.hero__title { text-align: center; }
	.hero__title-en {
		display: block;
		font-family: var(--font-en);
		font-size: clamp(22px, 2.5vw, 48px);
		letter-spacing: .06em;
		line-height: 1;
		color: var(--color-dark);
		opacity: 0; /* JS処理前は非表示（animateHeroTitle実行後に1になる） */
	}
	.hero__title-ja {
		display: block;
		font-size: clamp(20px, 0.68vw, 20px);
		letter-spacing: .2em;
		text-indent: .2em; /* letter-spacingによる視覚的な左寄りを補正 */
		margin-top: clamp(1em, 0.73vw, 14px);
		color: var(--color-dark);
	}

	/* hero title アニメーション */
	@keyframes heroLetterIn {
		from { opacity: 0; transform: translateY(-10px); }
		to   { opacity: 1; transform: translateY(0); }
	}
	@keyframes heroJaIn {
		from { opacity: 0; transform: translateY(-10px); }
		to   { opacity: 0.65; transform: translateY(0); }
	}
	.hero__title-en span {
		display: inline-block;
		opacity: 0;
	}
	.hero__title-en span.is-animate {
		animation: heroLetterIn 0.4s ease forwards;
	}
	.hero__title-ja {
		opacity: 0;
	}
	.hero__title-ja.is-animate {
		animation: heroJaIn 0.5s ease forwards;
	}

/* ============================================================
   page-content
   ============================================================ */
	.page-content {
		position: relative;
		z-index: 20;
		/*background: rgb(var(--color-white));*/
		padding: 100px 0 150px;
	}
	.page-inner {
		/* page-content 内の固有コンテンツラッパー */
	}

@media (max-width: 1000px) {
	.page-content {
		padding: 50px 0 80px;
	}
}
/* ============================================================
   page-text  共通テキスト要素
   ============================================================ */
	.lead-txt {
		width: 90%;
		font-size: 1.2em;
		line-height: 2;
		text-align: center;
		margin: 0 auto;
		padding-bottom: 100px;
	}
@media (max-width: 1000px) {
	.lead-txt {
		font-size: 1.0em;
		line-height: 2;
		text-align: left;
		padding-bottom: 50px;
	}
	.lead-txt br.SP_inbl {
		display: none;
	}
}

	.pt-heading { font-size: 1.4em; }
	.pt-heading .h-word {
		display: inline-block;
		line-height: 1.2;
		letter-spacing: 0.1em;
		font-size: 1.6em;
		font-family: var(--font-en);
	}
	.pt-heading .h-word-ja {
		display: inline-block;
		font-size: 0.8em;
	}

	/* アイコン付きボタン */
	.ico-btn {
		display: flex;
		align-items: center;
		column-gap: 15px;
	}
	.ico-btn::after {
		content: "〉";
		display: block;
		width: 1.5em;
		height: 1.5em;
		line-height: 1.5em;
		text-align: right;
		font-size: 1.5em;
		color: #FFF;
		background: var(--color-dark);
	}

	/* テキストリンクボタン */
	.btn {
		max-width: 200px;
		margin-top: 1.2em;
	}
	.btn a, .btn > span {
		position: relative;
		display: flex;
		direction: ltr;
		justify-content: center;
		align-items: center;
		column-gap: 5px;
		color: #FFF;
		font-size: 0.9em;
		line-height: 2em;
		background: var(--color-dark);
		cursor: pointer;
	}
	.btn a::before, .btn > span::before {
		content: "";
		position: absolute;
		pointer-events: none;
		top: 0;
		left: 0;
		display: block;
		width: 100%;
		height: 100%;
		transform: scaleX(0);
		transform-origin: left center;
		background: rgb(255 255 255 / .2);
		transition: transform 0.3s ease;
	}
	.btn a:hover::before, a:hover .btn > span::before { transform: scaleX(1); }
	.btn a::after, .btn > span::after {
		content: "》";
		color: #FFF;
	}

/* ============================================================
   container
   ============================================================ */
	.container {
		width: 90%;
		max-width: 1260px;
		margin: 0 auto;
	}
	.container + .container { margin-top: 100px; }

/* ============================================================
   column-layout  サイドナビ + メインコンテンツの2カラム構成
   ============================================================ */
	.column-layout {
		position: relative;
		display: flex;
		column-gap: calc(80 / 1440 * 100%);
		justify-content: space-between;
		margin-bottom: 80px;
	}
	.column-layout__nav {
		position: sticky;
		top: 0;
		align-self: flex-start;
		width: calc(360 / 1440 * 100%);
		max-width: 360px;
		padding-top: 80px;
	}
	.column-layout__content {
		width: calc(1060 / 1440 * 100%);
		max-width: 1060px;
		padding: 80px 0 0;
	}

	.column-layout__nav h2 {
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		aspect-ratio: 1 / 1;
		background: var(--color-accent);
	}
	.column-layout__nav h2::before {
		content: "";
		display: block;
		position: absolute;
		z-index: 0;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-size: cover;
		opacity: .2;
	}
	.column-layout__nav h2 > * {
		display: block;
		position: relative;
		z-index: 10;
		color: #FFF;
		font-size: 1.2em;
	}
	.column-layout__nav ul { margin-top: 50px; }
	.column-layout__nav ul li { margin-bottom: 0.8em; }
	.column-layout__nav ul li::before {
		content: "―";
		display: inline-block;
		margin-right: 0.2em;
	}

/* ============================================================
   content-unit
   ============================================================ */
	.content-unit + .content-unit { margin-top: 80px; }
	.content-unit h3 {
		font-size: 1.2em;
		font-weight: bold;
		margin-bottom: 1.6em;
		padding: 0.5em 0 0.8em 1.4em;
		border-left: 4px solid var(--color-accent);
		border-bottom: 1px dotted var(--color-accent);
	}

	.text-unit { padding-left: 1.5em; }
	.text-unit > img { width: 100%; max-width: 100%; height: auto; }
	.text-unit > * + * { margin-top: 30px; }
	.text-box { line-height: 1.8; }

	.dl-group dt {
		display: flex;
		align-items: flex-end;
		font-weight: bold;
	}
	.dl-group dt::before {
		content: "";
		display: inline-block;
		width: 1em;
		height: 1em;
		background: var(--color-accent);
		margin-right: 0.5em;
	}
	.dl-group div {
		display: inline-block;
		font-size: 1.1em;
		width: fit-content;
		min-width: 50%;
		margin-top: 1em;
		padding: 1em 1.4em;
		border: 1px solid #CCC;
	}
	.dl-group div dd {
		padding-left: 1em;
		text-indent: -1em;
	}
	.dl-group div dd + dd { margin-top: 0.4em; }
	.dl-group div dd::before { content: "・"; display: inline; }

@media (max-width: 1000px) {
	.text-unit { padding-left: 0em; }
	.dl-group div {
		width: 100%;
	}
}

/* ============================================================
   page-top-btn  全ページ共通
   ============================================================ */
	.page-top-btn {
		position: relative;
		margin: -50px 0 -10px;
	}
	.page-top-btn a {
		overflow: hidden;
		position: relative;
		display: block;
		width: 70px;
		height: 70px;
		text-indent: 200%;
		background: var(--color-dark);
		margin-left: auto;
		margin-right: 15px;
		border-radius: 50% 50% 0 0;
		transition: 0.3s transform ease;
	}
	.page-top-btn a::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		border: 10px solid transparent;
		border-bottom-color: rgb(var(--color-white));
	}
	.page-top-btn a:hover {
		transform-origin: center bottom;
		transform: translateY(-10px);
	}

/* ============================================================
   l-nav  大バナーナビゲーション（for BUSINESSなど複数ページで共用）
   ============================================================ */
	.l-nav {
		display: flex;
		border: 0px solid #516c8d;
		border-width: 2.4em 0;
	}
	.l-nav .l-nav__item {
		position: relative;
		display: block;
		width: 100%;
		height: 100%;
		font-size: 0.86em;
		text-align: center;
		overflow: hidden;
	}
	.l-nav__text {
		display: flex;
		flex-direction: column;
		justify-content: center;
		position: absolute;
		z-index: 10;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 80%;
	}
	.l-nav__text a {
		display: block;
		width: 100%;
		height: 100%;
		padding: 3vw;
		background: rgb(255 255 255 / .8);
	}
	.l-nav__text a .l-nav__heading-ja {
		font-size: clamp(1.0em , 2.6vw, 1.6em);
		font-weight: bold;
		line-height: 1.8;
	}
	.l-nav__heading-ja .inbl {
		display: inline-block;
	}
	.l-nav__text a .l-nav__ico-btn {
		position: absolute;
		bottom: 0;
		right: 0;
	}
	.l-nav__text + img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform 0.5s ease;
	}
	.l-nav__text:hover + img {
		transform: scale(1.1);
		transition: transform 0.8s ease;
	}
	/* l-nav 内での pt-heading はサイズリセット（.pt-heading の 1.4em を打ち消す） */
	.l-nav .pt-heading {
		font-size: 1em;
	}
	.l-nav__ico-btn {
		display: flex;
		align-items: center;
		column-gap: 15px;
	}
	.l-nav__ico-btn::after {
		content: "〉";
		display: block;
		width: 1.5em;
		height: 1.5em;
		line-height: 1.5em;
		text-align: right;
		font-size: 1.5em;
		color: #FFF;
		background: var(--color-dark);
		transform: rotate(90deg);
	}

@media (max-width: 900px) {
	.l-nav {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 600px) {
	.l-nav {
		display: block;
	}
	.l-nav .l-nav__item {
		display: grid;
		direction: rtl;
		grid-template-columns: 1fr 120px;
		border-top: 1px solid #516c8d;
	}
	.l-nav__text {
		position: relative;
		transform: translate(0, 0);
		top: 0;
		left: 0;
		width: 100%;
		background: #FFF;
	}
	.l-nav__text a {
		display: flex;
		direction: ltr;
		justify-content: flex-start;
		align-items: center;
	}
	.l-nav__text a .l-nav__heading-ja {
		font-size: min(2em,4.3vw);
	}
	.l-nav__text:hover + img {
		overflow: hidden;
	}
}


/* ============================================================
   breadcrumb
   ============================================================ */
	.breadcrumb {
		background: #28385e;
		padding: 5px 0;
	}
	.breadcrumb__list {
		text-align: right;
		margin-right: 0.6em;
	}
	.breadcrumb__item {
		display: inline-block;
		color: rgb(var(--color-white) / .8);
	}
	.breadcrumb__item + .breadcrumb__item::before {
		content: "＞";
		display: inline-block;
		margin: 0 0.2em;
		opacity: .5;
	}
	.breadcrumb__item a { text-decoration: underline; }
	.breadcrumb__item a:hover { text-decoration: none; }

/* ============================================================
   hero--no-visual  ビジュアルなし（アクセス・プライバシーなど）
   ============================================================ */
	.hero--no-visual {
		height: 30vh;
		min-height: 30vh;
		display: flex;
		align-items: flex-end;
	}
	.hero--no-visual .hero__text {
		position: relative;
		z-index: 1;
		width: 100%;
		height: 30vh;
		padding-top: 2em;
		padding-bottom: 0;
		opacity: 1;
		transform: none;
	}

/* ============================================================
   RESPONSIVE — スマホ (max-width: 768px)
   ============================================================ */
@media (max-width: 768px) {

	.hero__text {
		background-position: bottom right;
		background-size: 60% auto;
	}

	.nav-overlay__inner {
		flex-direction: column;
		gap: 0;
		width: 100%;
		padding: 80px 36px 48px;
		overflow-y: auto;
		max-height: 100vh;
	}
	.nav-overlay__main,
	.nav-overlay__right { width: 100%; }


	.column-layout { flex-direction: column; }
	.column-layout__nav {
		position: static;
		width: 100%;
		max-width: 100%;
		padding-top: 40px;
	}
	.column-layout__content {
		width: 100%;
		max-width: 100%;
	}
}


/* ============================================================
   FOOTER（トップページ用）
   footerWrap / contactWrap / pageTopBtn / siteFooterWrap
   ============================================================ */
/* ============================================================
   FOOTER
   ============================================================ */
	.site-footer {
		font-size: clamp(0.875rem, 0.7235rem + 0.316vw, 1rem);
	}

	.site-footer__contact {
		display: grid;
		grid-template-columns: 25% 30% 1fr;
		color: rgb(var(--color-white));
		background: #516c8d url("../images/share/contact-bg.png") center center no-repeat;
		background-size: cover;
		padding-bottom: 2em;
	}
	.site-footer__contact .site-footer__contact-title {
		text-align: right;
		padding: 3em min(10%, 4em);


		border-right: 3px solid rgb(var(--color-white));
	}
	.site-footer__contact .site-footer__contact-title strong {
		display: block;
		font-family: var(--font-enContact);
		font-optical-sizing: auto;
		font-weight: 400;
		font-style: normal;
		font-variation-settings:"wdth" 100;
		font-size: 4em;
		letter-spacing: -0.03em;
	}

	.site-footer__tel-wrap {
		display: flex;
		justify-content: center;
		align-self: center;
		padding: 2em 2em;
		border-right: 1px solid rgb(var(--color-white) / .6);
	}
	.site-footer__tel-inner {
	}
	.site-footer__tel-wrap a {
		display: flex;
		column-gap: 0.3em;
		align-items: center;
		letter-spacing: 0.05em;
		font-size: clamp(1.6em, 11.5vw, 3em);
	}
	.site-footer__tel-wrap a .site-footer__tel-icon {
		display: inline-block;
		width: auto;
		height: 0.7em;
	}
	.site-footer__tel-wrap .tel-font { font-family: var(--font-tel); }
	.site-footer__tel-wrap .site-footer__tel-hours {
		margin-left: 3em;
	}

	.site-footer__form {
		justify-content: center;
		align-self: center;
		max-width: 700px;
		align-items: center;
		line-height: 1.8em;
	}
	.site-footer__form-inner {
		display: flex;
		justify-content: center;
		column-gap: 1.6em;
	}
	.site-footer__form-text {
		font-size: .8em;
	}
	.site-footer__form-btn a {
		position: relative;
		display: inline-block;
		color: var(--color-dark);
		font-weight: bold;
		background: rgb(var(--color-white));
		padding: 0.8em 2.8em 0.8em 2em;

		transition: 0.3s opacity ease;
	}
	.site-footer__form-btn a::before,
	.site-footer__form-btn a::after {
		content: "";
		position: absolute;
		display: block;
		top: 50%;
		left: calc(100% - 1em);
		transform: translateY(-50%);
		border: solid transparent;
		border-width: 6px ;
		border-right-width: 0px !important;
		
		transition: 0.3s transform ease;
	}
	.site-footer__form-btn a::before {
		border-left-color: var(--color-dark);
	}
	.site-footer__form-btn a::after {
		left: calc(100% - 1em - 1px);
		border-left-color: rgb(var(--color-white));
		border-left-width: 4px !important;
	}

	.site-footer__form-btn a:hover {
		opacity: .8
	}
	.site-footer__form-btn a:hover::before,
	.site-footer__form-btn a:hover::after {
		transform: translateX(2px) translateY(-50%);
	}



@media (max-width: 1360px) {
	.site-footer__contact {
		grid-template-columns: 23em 1fr;
		padding-bottom: 0px;
	}
	.site-footer__contact .site-footer__contact-title {
		grid-row: 1 / 3;
		padding-top : 2em;
		padding-bottom : 2em;
	}
	.site-footer__tel-wrap {
		justify-content: flex-start;
		padding: 2em 2em 1em;
	}
	.site-footer__tel-inner {
		display: flex;
		align-items: baseline;
	}
	.site-footer__form {
		padding: 1em 2em 2em;
		border-top: 1px solid rgb(var(--color-white) / .6);
	}
}

@media (max-width: 1000px) {
	.site-footer__contact {
		display: block;
	}
	.site-footer__contact .site-footer__contact-title {
		text-align: center;
		border-right: 0px;
	}
	.site-footer__contact .site-footer__contact-title strong {
		margin-bottom: 0.1em;
	}
	.site-footer__tel-wrap {
		display: block;
		text-align: center;
		border-right: 0px;
	}
	.site-footer__tel-wrap .site-footer__tel-inner {
		justify-content: center;
	}
	.site-footer__tel-wrap .site-footer__tel-hours {
		display: inline-block;
		margin-left: 1em;
	}
	.site-footer__form {
		margin: 0 auto;
	}
}

@media (max-width: 736px) {
	.site-footer__contact .site-footer__contact-title::after {
		content: "";
		display: block;
		width: 50px;
		height: 3px;
		background: rgb(var(--color-white) / .8);
		margin: 2em auto 0;
	}
	.site-footer__tel-wrap {
		padding-top: 0px;
	}
	.site-footer__tel-wrap .site-footer__tel-inner {
		display: block;
		text-align: center;
	}
	.site-footer__form-inner {
		display: block;
	}
	.site-footer__tel-wrap a {
		justify-content: center;
		margin: 0 auto;
	}
	.site-footer__form-inner {
		text-align: center;
	}
	.site-footer__form-inner .site-footer__form-btn {
		margin-top: 1em;
	}
	
}


	.page-top-btn {
		position: relative;
		margin: -50px 0 -10px;
	}
	.page-top-btn a {
		overflow: hidden;
		position: relative;
		display: block;
		width: 70px;
		height: 70px;
		text-indent: 200%;
		background: var(--color-dark);
		margin-left: auto;
		margin-right: 15px;
		border-radius: 50% 50% 0 0;
		
		transition: 0.3s transform ease;
	}
	.page-top-btn a::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		border: 10px solid transparent;
		border-bottom-color: rgb(var(--color-white));
	}
	.page-top-btn a:hover {
		transform-origin: center bottom;
		transform: translateY(-10px);
	}

	.site-footer__nav-area {
		display: grid;
		width: 100%;
		
		grid-template-columns: auto 1fr auto;
		color: rgb(var(--color-white));
		background: var(--color-dark);
		padding: 30px 30px 60px;
	}

	.site-footer__corp {
		margin-top: 10px;
		font-style: normal;
	}
	.site-footer__corp dt {	margin-bottom: 1em;}
	.site-footer__corp dt img {
		max-width: 350px;
	}
	.site-footer__corp dd {
		color: rgb(var(--color-white) / .8);
		line-height: 1.6em;
		margin-top: 0.3em;
	}

	.site-footer__nav-area nav {
		grid-column: 3;
	}
	.site-footer__nav-area nav ul {
		display: grid;
		grid-auto-flow: column;
		grid-template-columns: 230px 195px 150px;
		grid-template-rows: repeat(4, auto);
		grid-gap: 6px 5px;
	}
	.site-footer__nav-area nav ul li {
		display: flex;
		align-items: stretch;
		justify-content: center;
		text-align: center;
	}
	.site-footer__nav-area nav ul li a {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		min-height: 2em;
		color: rgb(var(--color-white) / .6);
		text-align: center;
		font-size: 0.92em;
		background: rgb(var(--color-white) / 0);
		border: 1px solid rgb(var(--color-white) / .6);
		transition: 0.3s opacity ease, 0.3s background ease;
	}
	/* nav-en / nav-ja のフッターナビ内リセット */
	.site-footer__nav-area .nav-en {
		font-family: inherit;
		font-size: inherit;
		letter-spacing: inherit;
		opacity: 1;
	}
	.site-footer__nav-area .nav-ja { display: none; }

	.site-footer__nav-area nav ul li.site-footer__nav-contact {
		grid-row: 1 / 3;
	}
	.site-footer__nav-area nav ul li.site-footer__nav-contact a {
		color: var(--color-dark);
		background: rgb(var(--color-white) / 1);
	}


	.site-footer__nav-area nav ul li:not(.site-footer__nav-contact) a:hover {
		background: rgb(var(--color-white) / 0.13);
	}
	.site-footer__nav-area nav ul li.site-footer__nav-contact a:hover {
		background: rgb(var(--color-white) / 0.6);
	}


	.site-footer > small {
		display: block;
		text-align: center;
		line-height: 2.0em;
		background: rgb(var(--color-white));
		padding: 0.5em 1.2em;
	}

@media (max-width: 1050px) {
	.site-footer__corp {			text-align: center;	}
	.site-footer__corp dt img {	display: inline-block;}
	.site-footer__corp dd br {	display: none;}

	.site-footer__nav-area {		grid-template-columns: 1fr;	padding: 50px 30px 50px; }
	.site-footer__nav-area nav {		grid-column: 1;	 margin-top: 2em;}
	.site-footer__nav-area nav ul {
		grid-template-columns: 40% 35% 25%;
	}
}


@media (max-width: 737px) {
	.site-footer__nav-area nav ul {
		grid-template-columns: 60% 40%;
		grid-template-rows: repeat(6, auto);
	}
	.site-footer__nav-area nav ul li.site-footer__nav-contact {
		grid-row: 3 / 5;
	}
}
/* ============================================================
   news-modal  ニュース詳細モーダル（news.js が動的生成、全ページ共通）
   ============================================================ */
	/* hidden属性が上書きされるケースに備えて明示的に非表示 */
	.news-item__body {
		display: none !important;
	}
	/* リンクあり項目の差別化（矢印・ホバー下線） */
	.news-modal-trigger::after {
		content: " ›";
		color: var(--color-accent);
		font-size: 1.1em;
	}
	.news-modal-trigger:hover {
		text-decoration: underline;
		text-decoration-color: var(--color-accent);
	}
	.news-modal {
		position: fixed;
		inset: 0;
		z-index: 9500;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 5vw;
		opacity: 0;
		pointer-events: none;
		transition: opacity 0.3s ease;
	}
	.news-modal.is-open {
		opacity: 1;
		pointer-events: all;
	}
	.news-modal__overlay {
		position: absolute;
		inset: 0;
		background: rgba(0, 0, 0, 0.55);
		cursor: pointer;
	}
	.news-modal__window {
		position: relative;
		background: #fff;
		width: min(700px, 100%);
		max-height: 80vh;
		overflow-y: auto;
		padding: 3em 3em 2.5em;
		transform: translateY(12px);
		transition: transform 0.3s ease;
	}
	.news-modal.is-open .news-modal__window {
		transform: translateY(0);
	}
	.news-modal__close {
		position: absolute;
		top: 1em;
		right: 1em;
		width: 2em;
		height: 2em;
		background: none;
		border: none;
		cursor: pointer;
		font-size: 1.4em;
		line-height: 1;
		color: #888;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: color 0.2s;
	}
	.news-modal__close:hover { color: var(--color-dark); }
	.news-modal__date {
		display: block;
		font-size: 0.88em;
		color: var(--color-accent);
		letter-spacing: .04em;
		margin-bottom: 0.6em;
	}
	.news-modal__title {
		font-size: 1.15em;
		font-weight: bold;
		line-height: 1.7;
		margin-bottom: 1.5em;
		padding-bottom: 1em;
		border-bottom: 1px solid var(--color-border);
	}
	.news-modal__body {
		line-height: 2;
		font-size: 0.95em;
	}
	.news-modal__body p + p {
		margin-top: 1em;
	}
/* ============================================================
   sp-bottom-bar  スマホ下部固定バー（common.js が動的生成）
   ============================================================ */
.sp-bottom-bar { display: none; }

@media (max-width: 768px) {
	.sp-bottom-bar {
		display: flex;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 9000;
		height: 56px;
		padding-bottom: env(safe-area-inset-bottom);
	}
	.sp-bottom-bar__tel,
	.sp-bottom-bar__contact {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.5em;
		text-decoration: none;
		color: rgb(var(--color-white));
		font-weight: bold;
		letter-spacing: .06em;
	}
	.sp-bottom-bar__tel {
		width: 30%;
		background: var(--color-dark);
		font-size: 1em;
		flex-shrink: 0;
		flex-direction: column;
		gap: 0.2em;
	}
	.sp-bottom-bar__tel svg {
		width: 1.5em;
		height: 1.5em;
		flex-shrink: 0;
	}
	.sp-bottom-bar__contact {
		flex: 1;
		background: var(--color-dark);
		font-size: 0.92em;
		border-right: 1px solid rgba(255, 255, 255, .25);
	}
	.sp-bottom-bar__contact::after {
		content: none;
	}
	/* バーの高さ分だけ余白を確保 */
	body { padding-bottom: 56px;	background-position: right 28vh;	background-size: 50% auto; }
	/* ナビゲーション表示中は非表示 */
	.nav-overlay.is-open ~ .sp-bottom-bar { display: none; }
}