@charset "utf-8";
/*
Theme Name: Harmony Theme
Author: harmony
Description: original theme
Version： 3.0.0
*/

/* =========================================================
  Global / Page transition
========================================================= */
html{
	opacity: 1;
	scroll-behavior: smooth;
	font-size: 16px;
}

html.is-leaving{
	opacity: 0;
	transition: opacity 220ms ease-out;
}
html.is-entering{
	opacity: 0;
}
html.is-entering.is-entered{
	opacity: 1;
	transition: opacity 320ms ease-in;
}

/* =========================================================
  Utility
========================================================= */
.css-br::after{
	content: "A";
	white-space: pre;
}
.vertical{
	writing-mode: vertical-rl;
	letter-spacing: 0.5em;
}

/* =========================================================
  Reset
========================================================= */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins,
kbd, q, samp, small, strong, sub, sup, var, b, i,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video{
	font-size: 100%;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
	border: 0;
	outline: 0;
	background: transparent;
}

body{ line-height: 1; }

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section{
	display: block;
}

nav ul{ list-style: none; }

blockquote, q{ quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after{
	content: "";
	content: none;
}

a{
	font-size: 100%;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
	background: transparent;
}

ins{
	text-decoration: none;
	color: #000;
	background-color: #ff9;
}
mark{
	font-weight: bold;
	font-style: italic;
	color: #000;
	background-color: #ff9;
}
del{ text-decoration: line-through; }

abbr[title], dfn[title]{
	cursor: help;
	border-bottom: 1px dotted;
}

table{
	border-spacing: 0;
	border-collapse: collapse;
}

hr{
	display: block;
	height: 1px;
	margin: 1em 0;
	padding: 0;
	border: 0;
	border-top: 1px solid #ccc;
}

/* =========================================================
  Base typography / Elements
========================================================= */
body{
	font-family: "fot-tsukuardgothic-std", sans-serif;
	font-weight: 400;
	font-style: normal;
	line-height: 1.4;
	margin: 0;
	padding: 0;
	color: #333;
}

h1, h2, h3, h4, h5, h6{
	font-family: "fot-tsukuardgothic-std", sans-serif;
	font-weight: 400;
	font-style: normal;
}

/* 見出し装飾（グローバルのh2） */
h2{
	position: relative;
	box-shadow: 6px 6px #333;
	outline: 5px solid #FBF2EB;
	border: 1px solid #333;
	color: #333;
	padding: 0 20px;
}

img{
	max-width: 100%;
	height: auto;
}

/* =========================================================
  Layout containers
========================================================= */
.header-inner,
.footer-inner,
.container{
	max-width: 1080px;
	margin-right: auto;
	margin-left: auto;
	padding-right: 1.5rem;
	padding-left: 1.5rem;
}

.container{
	padding-top: 2rem;
	padding-bottom: 4rem;
}

/* 2カラム */
@media (min-width: 821px){
	.two-columns{
		display: flex;
		flex-direction: row;
		gap: 2.5rem;
	}
	.two-columns .contents{ flex: 1 1 auto; }
	.two-columns .sidebar{ flex: 0 0 15.625rem; }
}
@media (max-width: 820px){
	.two-columns .contents{ margin-bottom: 4rem; }
}

/* =========================================================
  Header / Site title (ロゴ＋文字)
  ※「元テーマの高さ固定を無効化」「absoluteでヘッダー内配置」
========================================================= */
#header{ position: relative; }

/* 既存の“タイトル画像用”の高さ固定を無効化 */
#header .site-title a{ height: auto !important; }

/* ロゴ＋文字の並び */
#header .site-title__link{
	display: inline-flex !important;
	align-items: center;
	gap: 12px;
}

/* ロゴサイズ（競合に勝つ） */
#header .site-title__logo img{
	width: 33px !important;
	height: 33px !important;
	max-width: none !important;
	display: block;
}

/* 文字ブロックは伸ばさない */
#header .site-title__texts{
	flex: 0 0 auto !important;
	display: flex;
	flex-direction: column;
	line-height: 1.1;
}

/* ヘッダー内にabsoluteで置く（スクロールで消える） */
#header .site-title{
	position: absolute !important;
	left: 4rem !important;
	top: 3rem !important;
	z-index: 20 !important;
	margin: 0 !important;
}

#header .site-title__sub{
	font-size: 12px;
	letter-spacing: .08em;
	color: #555;
	font-weight: 500;
	line-height: 1.2;
}
#header .site-title__main{
	font-size: 18px;
	font-weight: 500;
	letter-spacing: .04em;
	line-height: 1.15;
	color: #333;
}

/* =========================================================
  Header (テーマ標準)
========================================================= */
.header{ border-bottom: 1px solid #ddd; }

.header-inner{
	position: relative;
	padding-top: 3rem;
	padding-bottom: 3rem;
}

.site-title{
	line-height: 1;
	display: inline-block;
}

.site-title a{
	display: block;
	text-decoration: none;
}

/* タイトルを画像にする場合 */
.site-title a img{
	display: block;
	width: auto;
	height: 3rem;
}

/* タイトルを文字列にする場合 */
.site-title a{
	font-weight: bold;
	height: 1.75rem;
	color: #000;
}

.header-nav li a{
	display: block;
	text-decoration: none;
}

/* =========================================================
  Responsive (Header周り)
========================================================= */
@media (max-width: 480px){
	html{ font-size: 15px; }
	.container{ padding-top: 1.4rem; }

	#header .site-title{
		left: 2rem !important;
		top: 3rem !important;
	}
	#navbutton.navbutton{
		top: 2rem !important;
		right: 2rem !important;
	}
}

@media (max-width: 500px){
	#header .site-title{
		left: 1rem !important;
		top: 3rem !important;
	}
	#navbutton.navbutton{
		position: fixed;
		top: 2rem !important;
		right: 1rem !important;
	}
}

/* =========================================================
  List style (u1) : カスタム箇条書き
========================================================= */
.u1{
	list-style: none;
	padding: 30px;
	margin: 0 0 2em;
}

.u1 > li{
	position: relative;
	padding-left: 1.6em;
	margin: .55em 0;
	line-height: 1.8;
}

/* 文字の中央にくる青丸 */
.u1 > li::before{
	content: "";
	position: absolute;
	left: 0;
	top: 0.9em;
	transform: translateY(-50%);
	width: 8px;
	height: 8px;
	border-radius: 2px;
	background: #00C1D6;
}

/* 入れ子も同系統 */
.u1 ul{
	list-style: none;
	padding-left: 0;
	margin: .6em 0 .8em;
}

.u1 ul > li{
	position: relative;
	padding-left: 1.5em;
	margin: .45em 0;
	line-height: 1.8;
}

/* 2段目は丸抜き */
.u1 ul > li::before{
	content: "";
	position: absolute;
	left: 0;
	top: 0.9em;
	transform: translateY(-50%);
	width: 7px;
	height: 7px;
	border-radius: 999px;
	background: transparent;
	border: 2px solid #00C1D6;
}

/* =========================================================
  Top hero (背景画像＋テキスト)
========================================================= */
.background-container{
	position: relative;
	width: 100%;
	height: 1089px;
	margin-top: 100px;
}

/* 背景画像 */
.background-container::before{
	content: "";
	display: block;
	background-image: url('../images/background/top_main.webp');
	background-size: cover;
	background-position: 55% center;
	width: 90%;
	height: 100%;
	margin-left: auto;
	border-top-left-radius: 80px; 
}

.overlay-text{
	color: #000;
	font-size: 24px;
	padding: 20px;
	background-color: rgba(0,0,0,0);
}

.position-4{
	position: absolute;
	top: 58%;
	left: 14%;
	transform: translateY(-160%);
}

.expand{
	margin-right: calc(50% - 50vw);
	margin-left: calc(50% - 50vw);
	padding-right: calc(50vw - 50%);
	padding-left: calc(50vw - 50%);
}

/* =========================================================
  Footer (旧)
========================================================= */
.footer{ background-color: #F6F2EF; }

.footer-nav-wrap{ background-color: #f5f5f5; }

.footer-nav ul{
	font-size: 0;
	text-align: center;
}
.footer-nav ul li{
	font-size: .875rem;
	display: inline-block;
	margin-right: 1rem;
	padding: .25rem 0;
}
.footer-nav ul li:last-child{ margin-right: 0; }

.footer-nav ul li a{
	text-decoration: none;
	color: #333;
}

.copyright{
	padding: 1rem;
	text-align: left;
}
.copyright p{
	font-size: .875rem;
	color: #333;
}

/* =========================================================
  Post / Archive / Pagination（テーマ標準）
========================================================= */
.article-head .article-info{ margin-bottom: .5rem; }
.article-head .article-info .article-cat{
	display: inline-block;
	vertical-align: middle;
}
.article-head .article-info .article-cat a{
	font-size: .875rem;
	line-height: 1;
	display: inline-block;
	margin-right: .5rem;
	padding: .375rem .5rem;
	text-decoration: none;
	color: #fff;
	background-color: #03162f;
}
.article-head .article-info .article-date{
	font-size: 1rem;
	display: inline-block;
	vertical-align: middle;
	color: #888;
}
.article-head .article-info .article-date i{
	font-size: 1.25rem;
	position: relative;
	top: .25rem;
}
.article-head h1{
	font-size: 2.125rem;
	margin: 0 0 2rem;
	letter-spacing: 1px;
}
.article-head .article-img{ margin-bottom: 2rem; }
.article-head .article-img img{ display: block; }

.article-foot .article-tag{
	margin-bottom: 1rem;
	text-align: right;
}
.article-foot .article-tag ul{ list-style: none; }
.article-foot .article-tag ul li{
	font-size: .9rem;
	display: inline-block;
	margin-right: .5rem;
	vertical-align: middle;
}
.article-foot .article-tag ul li:last-child{ margin-right: 0; }
.article-foot .article-tag ul li a{
	line-height: 1;
	display: block;
	padding: .25rem .5rem;
	text-decoration: none;
	color: #000;
	border: 1px solid #000;
}
.article-foot .article-tag ul li a:hover{ opacity: .6; }

.article-foot .article-author{
	font-weight: 500;
	line-height: 1;
	text-align: right;
	vertical-align: middle;
}
.article-foot .article-author i{
	font-size: 1.25rem;
	position: relative;
	top: .25rem;
}

@media (max-width: 480px){
	.article-head h1{ font-size: 1.75rem; }
}

/* =========================================================
  Editor content（投稿本文）
========================================================= */
.editor-content p code,
.editor-content p img,
.editor-content p iframe,
.editor-content p object,
.editor-content figure img,
.editor-content figure iframe,
.editor-content figure video,
.editor-content figure audio,
.editor-content pre code{
	margin-bottom: 0;
}

.editor-content th,
.editor-content td{
	border-color: #ddd;
}

.editor-content p,
.editor-content ul,
.editor-content ol,
.editor-content table,
.editor-content dl,
.editor-content blockquote,
.editor-content pre,
.editor-content code,
.editor-content img,
.editor-content picture img,
.editor-content figure,
.editor-content iframe,
.editor-content object,
.editor-content hr,
.editor-content video,
.editor-content audio{
	margin-bottom: 2.5em;
	letter-spacing: 1px;
}

.editor-content b,
.editor-content strong{ font-weight: bold; }
.editor-content a{ text-decoration: underline; }

.editor-content ul:not([class]){
	padding-left: 1.25em;
	list-style: disc;
}
.editor-content ol:not([class]){
	padding-left: 1.875em;
	list-style: decimal;
}

.editor-content table{ width: 100%; }
.editor-content table thead{ border: none; }

.editor-content table th,
.editor-content table td{
	box-sizing: border-box;
	padding: .625em;
	text-align: left;
	vertical-align: middle;
	border: 1px solid #ddd;
}

.editor-content img,
.editor-content iframe,
.editor-content object,
.editor-content video,
.editor-content audio{ line-height: 1; }

.editor-content figure{ max-width: 100%; }

.editor-content iframe,
.editor-content object{ width: 100%; }

.editor-content blockquote{
	line-height: 1.5;
	position: relative;
	padding: 3.125em 1.875em .625em;
	color: #555;
	background-color: #f1f4f4;
}
.editor-content blockquote::before{
	font-family: "Material Symbols Outlined";
	font-size: 1.875em;
	font-weight: 900;
	position: absolute;
	top: .3125em;
	left: .9375em;
	content: "\e244";
	color: #ccc;
}
.editor-content blockquote p,
.editor-content blockquote cite{ margin-bottom: 1em; }
.editor-content blockquote p cite{ margin-bottom: 0; }
.editor-content blockquote cite{
	font-size: .6125em;
	display: block;
	text-align: right;
}

.editor-content h2,
.editor-content h3,
.editor-content h4,
.editor-content h5{
	line-height: 1.4;
	margin: 3rem 0 2rem;
	letter-spacing: 1px;
}
.editor-content h2{
	font-size: 1.875rem;
	padding: .75rem 0;
	border-bottom: solid 5px #03162f;
}
.editor-content h3{
	font-size: 1.5rem;
	padding: 0 1rem;
	border-left: solid .375rem #415671;
	background: transparent;
}
.editor-content h4{ font-size: 1.25rem; }
.editor-content h5{ font-size: 1.125rem; }

@media (max-width: 480px){
	.editor-content p,
	.editor-content ul,
	.editor-content ol,
	.editor-content table,
	.editor-content dl,
	.editor-content blockquote,
	.editor-content pre,
	.editor-content code,
	.editor-content img,
	.editor-content picture img,
	.editor-content figure,
	.editor-content iframe,
	.editor-content object,
	.editor-content hr,
	.editor-content video,
	.editor-content audio{
		margin-bottom: 1.5em;
	}

	.editor-content th,
	.editor-content td{ padding: .625em; }

	.editor-content blockquote{ padding: 2.5em 1.875em 1.875em; }

	.editor-content blockquote::before,
	.editor-content blockquote::after{ font-size: 1.25em; }

	.editor-content blockquote p,
	.editor-content blockquote cite{ margin-bottom: .625em; }

	.editor-content h2,
	.editor-content h3,
	.editor-content h4,
	.editor-content h5{ margin: 2rem 0; }

	.editor-content h2{ font-size: 1.5rem; }
	.editor-content h3{ font-size: 1.375rem; }
	.editor-content h4{ font-size: 1.25rem; }
	.editor-content h5{ font-size: 1rem; }
	.editor-content h6{ font-size: .9375rem; }
}

@media (max-width: 332px){
	.editor-content h2{ font-size: 1.25rem; }
	.editor-content h3{ font-size: 1.125rem; }
	.editor-content h4{ font-size: 1rem; }
	.editor-content h5{ font-size: .9375rem; }
	.editor-content h6{ font-size: .875rem; }
}

/* =========================================================
  Sidebar
========================================================= */
.sidebar-wrapper{ margin-bottom: 2rem; }

.sidebar .sidebar-title,
.sidebar .wp-block-heading{
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.4;
	margin: 0 0 1rem;
	padding: .375rem;
	letter-spacing: 1px;
	border: 0;
	border-bottom: .1875rem solid #1d2d43;
}

.sidebar a{
	text-decoration: none;
	color: #333;
}
.sidebar ul{ list-style: none; }
.sidebar li{ border-bottom: 1px solid #ddd; }
.sidebar li a{
	display: block;
	padding: .5rem;
}
.sidebar select{
	display: block;
	width: 100%;
	padding: .5rem;
	border: 1px solid #ddd;
}

/* =========================================================
  Page title（共通）
========================================================= */
.page-title-wrap{ background-color: #1d2d43; }

.page-title-wrap .page-title{
	position: relative;
	max-width: 1080px;
	height: 22rem;
	margin: 0 auto 2rem;
	padding: 0 1.5rem;
}

.page-title-wrap .page-title .text-warp{
	position: absolute;
	top: 50%;
	left: 1.5rem;
	width: calc(100% - 3rem);
	transform: translateY(-50%);
	text-align: center;
}

.page-title-wrap .page-title .text-warp h1{
	font-size: 3rem;
	font-weight: 400;
	letter-spacing: 1px;
	color: #fff;
}

@media (max-width: 820px){
	.page-title-wrap .page-title{
		height: 20rem;
		margin-bottom: 1rem;
	}
	.page-title-wrap .page-title .text-warp h1{ font-size: 2.75rem; }
}
@media (max-width: 480px){
	.page-title-wrap .page-title{
		height: 12rem;
		margin-bottom: 0;
	}
	.page-title-wrap .page-title .text-warp h1{ font-size: 2rem; }
}

/* =========================================================
  Article archive list
========================================================= */
.article-list{
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(2, 1fr);
}

.article-list .article-item{
	position: relative;
	z-index: 1;
	border: 1px solid #ddd;
}
.article-list .article-item a{
	display: block;
	text-decoration: none;
	color: #333;
}
.article-list .article-item img{
	display: block;
	width: 100%;
	aspect-ratio: 3/2;
	object-fit: cover;
}
.article-list .article-item .text-wrap{ padding: 1rem; }

.article-list .article-item .article-cat{
	font-size: .875rem;
	line-height: 1;
	display: inline-block;
	margin-right: .5rem;
	padding: .25rem .5rem;
	vertical-align: middle;
	text-decoration: none;
	color: #fff;
	background-color: #03162f;
}

.article-list .article-item .article-date{
	font-size: .875rem;
	display: inline-block;
	vertical-align: middle;
	color: #888;
}

.article-list .article-item .article-date i{
	font-size: 1rem;
	position: relative;
	top: .1875rem;
	margin-right: .125rem;
}

.article-list .article-item .text-wrap h2{
	font-size: 1rem;
	font-weight: 500;
	margin-top: .5rem;
}

@media (max-width: 480px){
	.article-list{
		display: block;
		grid-template-columns: none;
	}
	.article-list .article-item{ margin-bottom: 2rem; }
}

/* =========================================================
  Pagination
========================================================= */
.pagination{
	margin: 4rem 0;
	text-align: center;
}

.pagination ul{ font-size: 0; }

.pagination ul li{
	font-size: 1rem;
	display: inline-block;
	margin-right: .75rem;
}
.pagination ul li:last-child{
	margin-right: 0;
	border: 0;
}

.pagination ul li a,
.pagination ul li .current{
	font-weight: 600;
	line-height: 1;
	display: block;
	padding: .75rem .875rem;
	border: 1px solid #ddd;
}

.pagination ul li a{
	text-decoration: none;
	color: #555;
}
.pagination ul li .current{
	color: #fff;
	background-color: #1d2d43;
}

.pagination ul li .prev,
.pagination ul li .next{
	padding: .75rem .5rem;
	border: 0;
}

.pagination ul li i{
	font-size: 1rem;
	color: #1d2d43;
}

@media (max-width: 480px){
	.pagination{ margin: 3rem 0; }
	.pagination ul li a{ padding: .5rem; }
}

/* =========================================================
  Home FV
========================================================= */
.home-fv-wrap{ margin-bottom: 2rem; }
.home-fv-wrap img{
	display: block;
	width: 80%;
	height: auto;
	object-fit: cover;
}

@media (min-width: 1921px){
	.home-fv-wrap img{ height: auto; }
}
@media (min-width: 821px){
	.home-article-list{ grid-template-columns: repeat(3, 1fr); }
}

/* =========================================================
  Hamburger button
========================================================= */
#navbutton.navbutton{
	position: fixed;
	top: 2rem !important;
	right: 4rem;
	z-index: 10020;
	width: 56px;
	height: 56px;
	padding: 12px;
	border: 0;
	background: transparent;
	cursor: pointer;
	display: inline-flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: center;
	gap: 8px;
	color: #000;
}

#navbutton .navbutton__line{
	display: block;
	width: 34px;
	height: 2px;
	background: currentColor;
	border-radius: 2px;
	transform-origin: center;
	transition: transform .28s ease, opacity .18s ease;
}

/* ラベルは非表示運用 */
#navbutton .navbutton__label{ display: none; }

/* OPEN時：×にする */
.is-nav-open #navbutton .navbutton__line:nth-child(2){ opacity: 0; }
.is-nav-open #navbutton .navbutton__line:nth-child(1){ transform: translateY(10px) rotate(45deg); }
.is-nav-open #navbutton .navbutton__line:nth-child(3){ transform: translateY(-10px) rotate(-45deg); }

/* =========================================================
  Header overlay menu（開閉レイヤー）
========================================================= */
/*
  軽量化のため、円の広がりは clip-path ではなく transform: scale で描く（GPUで処理されるため滑らか）。
  ぼかし（backdrop-filter）は円が広がり切った瞬間に一度だけかけ、閉じるときは即座に外す。
*/
.header-nav-wrap{
	position: fixed;
	inset: 0;
	z-index: 10010; /* navbutton(10020)より下 */
	overflow: hidden;

	backdrop-filter: none;
	-webkit-backdrop-filter: none;

	opacity: 0;
	visibility: hidden;
	pointer-events: none;

	transition:
		opacity .25s ease,
		visibility .25s ease,
		backdrop-filter 0s,
		-webkit-backdrop-filter 0s;
}

/* 広がる円（右上 28px の位置が中心） */
.header-nav-wrap::before{
	content: "";
	position: absolute;
	top: 28px;
	right: 28px;
	width: 40vmax;
	height: 40vmax;
	margin: -20vmax -20vmax 0 0;
	border-radius: 50%;
	background: rgba(255,255,255,0.78);
	transform: scale(0);
	transition: transform .55s ease;
	will-change: transform;
	pointer-events: none;
}

.header-nav-wrap__inner{
	position: relative;
	z-index: 1;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 24px 24px; /* 上はボタン避け */
}

/* 開いた時：円を広げる（直径 320vmax ＝ 元の circle(160vmax) と同じ大きさ） */
.is-nav-open .header-nav-wrap{
	opacity: 1;
	visibility: visible;
	pointer-events: auto;

	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	transition:
		opacity .25s ease,
		visibility .25s ease,
		backdrop-filter 0s linear .55s,
		-webkit-backdrop-filter 0s linear .55s;
}
.is-nav-open .header-nav-wrap::before{
	transform: scale(8);
}

/* メニュー本体 */
.header-nav ul{
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: center;
}
.header-nav li{ margin: 14px 0; }

.header-nav a{
	font-size: 1.2rem;
	letter-spacing: .06em;
	color: #111;
	text-decoration: none;
	display: inline-block;
	padding: 10px 14px;
}

/* liは円が広がった“あと”に出す */
.header-nav-wrap .header-nav li{
	opacity: 0;
	transform: translateY(18px);
}
.is-nav-open .header-nav-wrap .header-nav li{
	animation: menuPop .45s ease forwards;
	animation-delay: .45s;
}
.is-nav-open .header-nav-wrap .header-nav li:nth-child(1){ animation-delay: .48s; }
.is-nav-open .header-nav-wrap .header-nav li:nth-child(2){ animation-delay: .54s; }
.is-nav-open .header-nav-wrap .header-nav li:nth-child(3){ animation-delay: .60s; }
.is-nav-open .header-nav-wrap .header-nav li:nth-child(4){ animation-delay: .66s; }
.is-nav-open .header-nav-wrap .header-nav li:nth-child(5){ animation-delay: .72s; }
.is-nav-open .header-nav-wrap .header-nav li:nth-child(6){ animation-delay: .78s; }

@keyframes menuPop{
	0%   { opacity: 0; transform: translateY(18px); }
	70%  { opacity: 1; transform: translateY(-2px); }
	100% { opacity: 1; transform: translateY(0); }
}

/* =========================================================
  Page top（右下固定・回転）
========================================================= */
.pagetop-wrap{
	position: fixed;
	right: calc(45px + env(safe-area-inset-right));
	bottom: calc(10% + env(safe-area-inset-bottom));
	z-index: 10030;

	transform: rotate(90deg);
	transform-origin: right bottom;

	display: inline-flex;
	align-items: center;
	gap: 12px;

	color: #111;

	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .25s ease, visibility .25s ease;
}

.pagetop-wrap.is-show{
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.pagetop{
	text-decoration: none;
	color: inherit;
	padding: 10px 12px;
}

.pagetop__line{
	display: block;
	width: 64px;
	height: 1px;
	background: currentColor;
	opacity: .7;
	pointer-events: none;
}

.pagetop__text{
	font-size: 12px;
	letter-spacing: .12em;
	white-space: nowrap;
}

/* =========================================================
  Day flow（1日の流れ）
========================================================= */
.dayflow{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0;
	flex-wrap: nowrap;
	position: relative;

	width: min(100%, 980px);
	margin: 0 auto;
	padding: 0 16px;
	box-sizing: border-box;
}

@media (max-width: 640px){
	.dayflow{
		width: 100%;
		justify-content: center;
		flex-wrap: nowrap;
	}
}

.flow-item{
	display: flex;
	align-items: center;
	position: relative;
	flex: 0 0 auto;
	--dot-size: 16px;
}

.flow-item::after{
	content: "";
	height: 3px;
	width: 140px;
	background: #53c0d5;
	opacity: .7;
	margin-left: 0;

	transform-origin: left center;
	transform: scaleX(0);
	transition: transform .45s ease;
}

@media (max-width: 640px){
	.flow-item::after{
		width: clamp(24px, 8vw, 72px);
	}
}

.flow-item.is-short::after{ width: 70px; }
@media (max-width: 640px){
	.flow-item.is-short::after{ width: clamp(16px, 4vw, 40px); }
}

.flow-item.is-end::after{ display: none; }

.dot{
	width: var(--dot-size);
	height: var(--dot-size);
	border-radius: 999px;
	border: 2px solid #776656;
	background: transparent;
	flex: 0 0 auto;

	opacity: 0;
	transform: translateX(-10px);
	transition: opacity .35s ease, transform .35s ease;
}
.dot--filled{ background: #776656; }

.label{
	position: absolute;
	font-size: 20px;
	letter-spacing: .06em;
	white-space: nowrap;
	line-height: 1.2;

	left: calc(var(--dot-size) / 2);
	transform: translate(-50%, -10px);

	opacity: 0;
	transition: opacity .35s ease, transform .35s ease;
}

.label--top{ bottom: 30px; }
.label--bottom{ top: 30px; }

@media (max-width: 640px){
	.label{ font-size: 14px; }
	.label--top{ bottom: 28px; }
	.label--bottom{ top: 28px; }
}

.flow-item.is-show .dot{
	opacity: 1;
	transform: translateX(0);
}
.flow-item.is-show .label{
	opacity: 1;
	transform: translate(-50%, 0);
	text-align: center;
}
.flow-item.is-show::after{ transform: scaleX(1); }

@media (prefers-reduced-motion: reduce){
	.dot, .label, .flow-item::after{ transition: none; transform: none; }
}

/* =========================================================
  Checklist（支援体制）
========================================================= */
.checklist{
	list-style: none;
	padding: 0;
	margin: 0 auto;
	max-width: 700px;
	width: 100%;
}

.checklist li{
	position: relative;
	padding-left: 42px;
	margin: 14px 0;
	font-size: 18px;
	line-height: 1.6;

	opacity: 0;
	list-style: none;
	transform: translateY(10px);
	transition: opacity .35s ease, transform .35s ease;
}

.checklist li::before{
	content: "";
	position: absolute;
	left: 0;
	top: .25em;
	width: 22px;
	height: 22px;
	border: 3px solid #53c0d5;
	border-radius: 4px;
	background: transparent;
	box-sizing: border-box;
}

.checklist li::after{
	content: "✓";
	position: absolute;
	left: 4px;
	top: .10em;
	font-size: 22px;
	line-height: 1;
	color: #756556;
	opacity: 0;
	transform: scale(.6);
	transition: opacity .2s ease, transform .2s ease;
}

.checklist li.is-show{
	opacity: 1;
	transform: translateY(0);
}
.checklist li.is-check::after{
	opacity: 1;
	transform: scale(1);
}

@media (max-width: 640px){
	.checklist{
		padding: 0 16px;
		max-width: 100%;
	}
	.checklist li{ font-size: 17px; }
}

/* =========================================================
  Flow button（hoverで塗り）
========================================================= */
.button{
	display: flex;
	justify-content: center;
}

.bgleft{
	position: relative;
	display: inline-block;
	padding: 0 22px;
	text-decoration: none !important;

	border: 1px solid #333;
	color: #fff !important;
	border-radius: 3px;
	background: #333;

	overflow: hidden;
	transition: color .25s ease, border-color .25s ease;
}

.bgleft span{
	position: relative;
	z-index: 3;
}

.bgleft::before{
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	transform: scaleX(0);
	transform-origin: right center;
	background: #53c0d5;
	transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1);
}

.bgleft:hover{
	color: #fff;
	border-color: #53c0d5;
}
.bgleft:hover::before{
	transform-origin: left center;
	transform: scaleX(1);
}

/* =========================================================
  Title animation block（縦書きタイトル）
========================================================= */
.title_area{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin: 50px 0 30px;
}
.title_wrap{
	position: relative;
	display: inline-block;
}

.title_bg{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	border-top: none;
	border-left: none;
	background-color: #fff;
	z-index: 1;
	opacity: 0;
	animation: tltANim2 0.8s 0.7s ease-in-out forwards;
}

.title_front{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 20px 10px;
	border: 1px solid #000;
	background-color: #fff;
	writing-mode: vertical-rl;
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	z-index: 2;
	opacity: 0;
	animation: tltANim1 0.5s 0.2s ease-in-out forwards;
}

.vertical_text{ font-size: 1.2em; }

@keyframes tltANim1{
	0%   { opacity: 0; transform: translate(7px, 7px); }
	100% { opacity: 1; transform: translate(0, 0); }
}
@keyframes tltANim2{
	0%   { opacity: 0; transform: translate(0, 0); }
	100% { opacity: 1; transform: translate(5px, 1px); }
}

/* =========================================================
  Main page title（プライバシーポリシー等）
========================================================= */
.mainpage-title-wrap{ background-color: #fff; }

.mainpage-title-wrap .mainpage-title{
	position: relative;
	max-width: 1080px;
	height: 0rem;
	margin: 0 auto 6rem;
	padding: 0 1.5rem;
}

.mainpage-title-wrap .mainpage-title .text-warp{
	position: absolute;
	top: 50%;
	left: 1.5rem;
	width: calc(100% - 3rem);
	transform: translateY(-150%);
	text-align: left;
}

.mainpage-title-wrap .mainpage-title .text-warp h1{
	font-size: 2rem;
	font-weight: bold;
	color: #000;
}

@media (max-width: 820px){
	.mainpage-title-wrap .mainpage-title{
		height: 20rem;
		margin-bottom: 1rem;
	}
	.mainpage-title-wrap .mainpage-title .text-warp h1{
		font-size: 2.75rem;
	}
}
@media (max-width: 480px){
	.mainpage-title-wrap .mainpage-title{
		height: 12rem;
		margin-bottom: 0;
	}
	.mainpage-title-wrap .mainpage-title .text-warp h1{
		font-size: 2rem;
	}
}

/* =========================================================
  Main editor content（.maineditor-content）
========================================================= */
.maineditor-content p code,
.maineditor-content p img,
.maineditor-content p iframe,
.maineditor-content p object,
.maineditor-content figure img,
.maineditor-content figure iframe,
.maineditor-content figure video,
.maineditor-content figure audio,
.maineditor-content pre code{
	margin-bottom: 0;
}

.maineditor-content p{
	padding-left: 1.0rem;
	padding-top: 0;
}

.maineditor-content p,
.maineditor-content ul,
.maineditor-content ol,
.maineditor-content table,
.maineditor-content dl,
.maineditor-content blockquote,
.maineditor-content pre,
.maineditor-content code,
.maineditor-content img,
.maineditor-content picture img,
.maineditor-content figure,
.maineditor-content iframe,
.maineditor-content object,
.maineditor-content hr,
.maineditor-content video,
.maineditor-content audio{
	margin-bottom: 2.5em;
	letter-spacing: 0;
}

.maineditor-content b,
.maineditor-content strong{ font-weight: bold; }
.maineditor-content a{ text-decoration: underline; }

.maineditor-content ul:not([class]){
	padding-left: 1.25em;
	list-style: disc;
}
.maineditor-content ol:not([class]){
	padding-left: 1.875em;
	list-style: decimal;
}

.maineditor-content table{
	width: 100%;
	background-color: #fff;
}

.maineditor-content table th,
.maineditor-content table tr,
.maineditor-content table td{
	box-sizing: border-box;
	padding: .625em;
	text-align: left;
	vertical-align: middle;
}

.maineditor-content figure{ max-width: 100%; }
.maineditor-content iframe,
.maineditor-content object{ width: 100%; }

.maineditor-content blockquote{
	line-height: 1.5;
	position: relative;
	padding: 3.125em 1.875em .625em;
	color: #555;
	background-color: #f1f4f4;
}
.maineditor-content blockquote::before{
	font-family: "Material Symbols Outlined";
	font-size: 1.875em;
	font-weight: 900;
	position: absolute;
	top: .3125em;
	left: .9375em;
	content: "\e244";
	color: #ccc;
}
.maineditor-content blockquote p,
.maineditor-content blockquote cite{ margin-bottom: 1em; }
.maineditor-content blockquote p cite{ margin-bottom: 0; }
.maineditor-content blockquote cite{
	font-size: .6125em;
	display: block;
	text-align: right;
}

.maineditor-content h2,
.maineditor-content h3,
.maineditor-content h4,
.maineditor-content h5{
	line-height: 1.4;
	margin: 3rem 0 2rem;
	letter-spacing: 1px;
}

/* main側h2は“飾り無し・黒太字”寄り */
.maineditor-content h2{
	font-size: 1.2rem;
	color: #000;
	font-weight: bold;
	margin: 0;
	padding: 0 0 20px 0;
}

.maineditor-content h3{
	font-size: 1.5rem;
	padding: 0 1rem;
	border-left: solid .375rem #415671;
	background: transparent;
}
.maineditor-content h4{ font-size: 1.25rem; }
.maineditor-content h5{ font-size: 1.125rem; }

@media (max-width: 480px){
	.maineditor-content p,
	.maineditor-content ul,
	.maineditor-content ol,
	.maineditor-content table,
	.maineditor-content dl,
	.maineditor-content blockquote,
	.maineditor-content pre,
	.maineditor-content code,
	.maineditor-content img,
	.maineditor-content picture img,
	.maineditor-content figure,
	.maineditor-content iframe,
	.maineditor-content object,
	.maineditor-content hr,
	.maineditor-content video,
	.maineditor-content audio{
		margin-bottom: 1.5em;
	}

	.maineditor-content th,
	.maineditor-content td{ padding: .625em; }

	.maineditor-content blockquote{ padding: 2.5em 1.875em 1.875em; }

	.maineditor-content blockquote::before,
	.maineditor-content blockquote::after{ font-size: 1.25em; }

	.maineditor-content blockquote p,
	.maineditor-content blockquote cite{ margin-bottom: .625em; }

	.maineditor-content h2,
	.maineditor-content h3,
	.maineditor-content h4,
	.maineditor-content h5{ margin: 2rem 0; }

	.maineditor-content h2{ font-size: 1.5rem; }
	.maineditor-content h3{ font-size: 1.375rem; }
	.maineditor-content h4{ font-size: 1.25rem; }
	.maineditor-content h5{ font-size: 1rem; }
	.maineditor-content h6{ font-size: .9375rem; }
}

@media (max-width: 332px){
	.maineditor-content h2{ font-size: 1.25rem; }
	.maineditor-content h3{ font-size: 1.125rem; }
	.maineditor-content h4{ font-size: 1rem; }
	.maineditor-content h5{ font-size: .9375rem; }
	.maineditor-content h6{ font-size: .875rem; }
}

/* 全体で触ってるリスト余白 */
.wp-block-list{ padding: 0.1rem 0 2rem 3.0rem; }

/* =========================================================
  Footer（新）
========================================================= */
.site-footer{ margin-top: 0; }

/* 上の写真 */
.footer-hero img{
	display: block;
	width: 100%;
	height: auto;
}

/* 白背景エリア */
.footer-main{ background: #fff; }

.footer-main__inner{
	max-width: 1100px;
	margin: 0 auto;
	padding: 44px 20px;
	display: flex;
	gap: 40px;
	justify-content: space-between;
}

.footer-info{
	flex: 1 1 60%;
	line-height: 1.9;
	font-size: 14px;
	color: #222;
}

.footer-org{
	margin: 0 0 18px;
	font-weight: 600;
}

.footer-addr,
.footer-tel,
.footer-contact{ margin: 0 0 16px; }

.footer-info a{
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* 右側 */
.footer-nav{
	flex: 0 0 240px;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 18px;
}

.footer-nav .footer-menu{
	width: 100%;
	text-align: right;
}
.footer-nav .footer-menu li{ width: 100%; }
.footer-nav .footer-menu a{ display: inline-block; }

.footer-menu li{ margin: 0 0 14px; }
.footer-menu li:last-child{ margin-bottom: 0; }

.footer-menu a{
	color: #222;
	text-decoration: none;
	font-size: 13px;
	letter-spacing: 0.02em;
}
.footer-menu a:hover{
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* サブメニュー（横並び） */
.footer-submenu,
.footer-mainmenu{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 18px;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.footer-submenu a,
.footer-mainmenu a{
	font-size: 12px;
	color: #333;
	text-decoration: none;
}
.footer-submenu a:hover,
.footer-mainmenu a:hover{
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* 下の薄ベージュ */
.footer-bottom{ background: #f3ede3; }

.footer-bottom__inner{
	max-width: 1100px;
	margin: 0 auto;
	padding: 14px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
}

.footer-copy{
	font-size: 12px;
	color: #333;
}

@media (max-width: 768px){
	.footer-main__inner{
		flex-direction: column;
		gap: 24px;
	}
	.footer-nav{ align-items: flex-start; }
	.footer-bottom__inner{
		flex-direction: column;
		align-items: flex-start;
	}
}

/* =========================================================
  Sub editor（.subeditor-content） ※固定ページ側で上書き運用
========================================================= */
.subeditor-content p{ padding: 10px 0 15px; }
.subeditor-content th,
.subeditor-content td{
	border-color: #fff;
	border-bottom: 1px solid;
}

/* =========================================================
  Fixed page + subeditor-content（本文の装飾一式）
========================================================= */
.fixed-page .subeditor-content{
	color: #333;
	line-height: 1.8;
}

.fixed-page .subeditor-content p{
	padding: 10px 0 15px;
	margin: 0;
}

.fixed-page .subeditor-content ul,
.fixed-page .subeditor-content ol{
	margin: 0 0 1.8em;
	padding-left: 1.6em;
}

.fixed-page .subeditor-content li{ margin: .4em 0; }

.fixed-page .subeditor-content .wp-block-list{ padding: 0 0 0 1.6em; }

.fixed-page .subeditor-content a{
	text-decoration: underline;
	text-underline-offset: 3px;
	color: inherit;
}

/* =========================================================
  固定ページ h2 タイトル 右下にスライド（2重の横長タイトル：スクロール表示）
========================================================= */
.fixed-page .subeditor-content h2 {
  position: relative;
  border: 1px solid #333;
  padding: 0.7em 15px;
  margin-bottom: 30px;
  font-size: 100%;
  font-weight: normal;
  color: #333;
  background: #fff;
  outline: 5px solid #fff;
  box-shadow: none;
  opacity: 0;
  transform: translate(15px, 15px); /* 少し深めに */
  transition: opacity 1.0s cubic-bezier(.22,.61,.36,1),transform 1.0s cubic-bezier(.22,.61,.36,1);
}

/* 影 */
.fixed-page .subeditor-content h2::after {
  content: "";
  position: absolute;
  inset: 0;
  border-right: 1px solid #333;
  border-bottom: 1px solid #333;
  z-index: 1;
  opacity: 0;
  transition: opacity 1.0s ease,
              transform 1.0s cubic-bezier(.24,0,.38,1);
}

/* 表示 */
.fixed-page .subeditor-content h2.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* 影を3mm(約12px)右下へ遅れて移動 */
.fixed-page .subeditor-content h2.is-visible::after {
  opacity: 1;
  transform: translate(7px, 7px);
  transition-delay: 0.6s; /* ← 見出し後に動く */
}
	
	

.fixed-page .subeditor-content h3{
	font-size: 1.10rem;
	font-weight: 700;
	padding-left: .9em;
	border-left: 3px solid #333;
	color: #333;
}

.fixed-page .subeditor-content h4{
	font-size: 1.05rem;
	font-weight: 700;
	padding-left: .2em;
	border-left: 2px solid #ddd;
}
.fixed-page .subeditor-content h5{
	font-size: 1rem;
	font-weight: 700;
}
.fixed-page .subeditor-content h6{
	font-size: .95rem;
	font-weight: 700;
	color: #555;
}

/* Images */
.fixed-page .subeditor-content figure{ margin: 0 0 2em; }
.fixed-page .subeditor-content .wp-block-image img{
	display: block;
	width: 100%;
	height: auto;
}
.fixed-page .subeditor-content figcaption{
	margin-top: .6em;
	font-size: .85rem;
	color: #666;
	text-align: center;
}
.fixed-page .subeditor-content .wp-block-image,
.fixed-page .subeditor-content .wp-block-media-text__media{
	border: 1px solid #eee;
	background: #fff;
}

/* Gallery */
.fixed-page .subeditor-content .wp-block-gallery{
	margin: 0 0 2em;
	gap: 12px;
}
.fixed-page .subeditor-content .wp-block-gallery .blocks-gallery-item img{
	display: block;
	width: 100%;
	height: auto;
}

/* Buttons */
.fixed-page .subeditor-content .wp-block-buttons{
	margin: 1.8em 0 2.2em;
}

.fixed-page .subeditor-content .wp-block-button__link{
	border: 1px solid #111;
	background: #111;
	color: #fff;
	padding: .8em 1.4em;
	border-radius: 0;
	font-size: .95rem;
	text-decoration: none;
}

.fixed-page .subeditor-content .wp-block-button__link:hover{ opacity: .85; }

.fixed-page .subeditor-content .is-style-outline .wp-block-button__link{
	background: transparent;
	color: #111;
}
.fixed-page .subeditor-content .is-style-outline .wp-block-button__link:hover{
	background: #111;
	color: #fff;
}

/* Quote / Pullquote */
.fixed-page .subeditor-content .wp-block-quote{
	margin: 2em 0;
	padding: 1.4em 1.2em;
	border-left: 3px solid #111;
	background: #fafafa;
}
.fixed-page .subeditor-content .wp-block-quote p{ padding: 0; }
.fixed-page .subeditor-content .wp-block-quote cite{
	display: block;
	margin-top: .8em;
	font-size: .85rem;
	color: #666;
	text-align: right;
}

.fixed-page .subeditor-content .wp-block-pullquote{
	margin: 2em 0;
	padding: 1.6em 1.2em;
	border: 1px solid #111;
	background: #fff;
}
.fixed-page .subeditor-content .wp-block-pullquote blockquote{ margin: 0; }
.fixed-page .subeditor-content .wp-block-pullquote p{
	padding: 0;
	font-size: 1.05rem;
}

/* Separator */
.fixed-page .subeditor-content .wp-block-separator{
	margin: 2.2em auto;
	border: 0;
	border-top: 1px solid #ddd;
	max-width: 320px;
}

/* Table */
.fixed-page .subeditor-content .wp-block-table{
	margin: 0 0 2.2em;
	overflow-x: auto;
}
.fixed-page .subeditor-content table{
	width: 100%;
	background: #fff;
	border-collapse: collapse;
}
.fixed-page .subeditor-content th,
.fixed-page .subeditor-content td{
	border-bottom: 1px solid #eee;
	padding: .8em .9em;
	text-align: left;
	vertical-align: top;
}
.fixed-page .subeditor-content thead th{
	border-bottom: 1px solid #111;
	font-weight: 700;
}

/* Columns / Media-text / Group / Cover / File / Embed */
.fixed-page .subeditor-content .wp-block-columns{
	margin: 2em 0;
	gap: 24px;
}
@media (max-width: 781px){
	.fixed-page .subeditor-content .wp-block-columns{ gap: 16px; }
}

.fixed-page .subeditor-content .wp-block-media-text{
	margin: 2em 0;
	gap: 24px;
}
.fixed-page .subeditor-content .wp-block-media-text__content{ padding: 0; }

.fixed-page .subeditor-content .wp-block-group{ margin: 2em 0; }
.fixed-page .subeditor-content .wp-block-group.is-style-default{
	padding: 1.4em 1.2em;
	border: 1px solid #eee;
	background: #fff;
}

.fixed-page .subeditor-content .wp-block-cover{
	margin: 2em 0;
	border: 1px solid #eee;
}
.fixed-page .subeditor-content .wp-block-cover__inner-container{
	padding: 2em 1.2em;
}
.fixed-page .subeditor-content .wp-block-cover p{ padding: 0; }

.fixed-page .subeditor-content .wp-block-file{
	margin: 1.8em 0;
	padding: 1.2em;
	border: 1px solid #eee;
	background: #fff;
}
.fixed-page .subeditor-content .wp-block-file__button{
	border-radius: 0;
	border: 1px solid #111;
	background: #111;
	color: #fff;
	padding: .55em .9em;
}

.fixed-page .subeditor-content .wp-block-embed{ margin: 2em 0; }
.fixed-page .subeditor-content iframe{ max-width: 100%; }

.fixed-page .subeditor-content > *:last-child{ margin-bottom: 0; }

/* =========================================================
  Subpage list style（丸＋入れ子丸抜き）
========================================================= */
.fixed-page .subeditor-content ul{
	margin: 0 0 2em;
	padding-left: 0;
	list-style: none;
}
.fixed-page .subeditor-content ul > li{
	position: relative;
	margin: .55em 0;
	padding-left: 1.6em;
	line-height: 1.8;
}
.fixed-page .subeditor-content ul > li::before{
	content: "";
	position: absolute;
	left: 0;
	top: 0.9em;
	transform: translateY(-50%);
	width: 8px;
	height: 8px;
	border-radius: 2px;
	background: #00C1D6;
}

.fixed-page .subeditor-content ul ul{
	margin-top: .6em;
	margin-bottom: .8em;
	padding-left: 0;
}
.fixed-page .subeditor-content ul ul > li{ padding-left: 1.5em; }
.fixed-page .subeditor-content ul ul > li::before{
	width: 7px;
	height: 7px;
	background: transparent;
	border: 2px solid #00C1D6;
	top: 0.9em;
	transform: translateY(-50%);
}

/* =========================================================
  Flow arrow（縦点線＋▼）
========================================================= */
.flow-arrow--line{
	position: relative;
	height: 34px;
	width: 100%;
	max-width: 220px;
	margin: 26px auto;
}

.flow-arrow--line::before{
	content: "";
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	width: 4px;
	height: 100%;
	background: radial-gradient(circle, #00C1D6 10%, transparent 56%)
		center top / 4px 10px repeat-y;
	opacity: .75;
}

.flow-arrow--line::after{
	content: "";
	position: absolute;
	left: 50%;
	bottom: -2px;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-top: 10px solid #00C1D6;
	opacity: .9;
}

/* =========================================================
  Access layout
========================================================= */
.access-section{
	margin: 0 auto;
	padding: 1.5rem 0 3.5rem;
}

.access-grid{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 28px;
	align-items: start;
}
@media (max-width: 820px){
	.access-grid{
		grid-template-columns: 1fr;
		gap: 18px;
	}
}

.access-card{
	border: 1px solid #eee;
	background: #fff;
	padding: 22px 18px 18px;
}

.access-card__head{
	border-bottom: 1px solid #eee;
	padding-bottom: 14px;
	margin-bottom: 14px;
}

.access-card__label{
	margin: 0 0 6px;
	font-size: 12px;
	letter-spacing: .12em;
	color: #aaa;
}

.access-card__title{
	margin: 0 0 8px;
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: .04em;
	line-height: 1.3;

	/* h2装飾の事故防止 */
	box-shadow: none;
	outline: none;
	border: 0;
	background: transparent;
	padding: 0;
}

.access-card__addr,
.access-card__tel{
	margin: 0;
	color: #555;
	font-size: .95rem;
	line-height: 1.7;
}

.access-card__info{
	margin: 0 0 14px;
	padding: 12px 14px;
	background: #fafafa;
	border: 1px solid #eee;
	line-height: 1.8;
}

.access-card__infoTitle{
	font-weight: 700;
	color: #333;
}

.access-card__map{
	margin: 0;
	border: 1px solid #eee;
	background: #fff;
	overflow: hidden;
}

.access-card__map iframe{
	display: block;
	width: 100%;
	height: 320px;
}
@media (max-width: 480px){
	.access-card__map iframe{ height: 280px; }
}

.access-card__actions{
	margin-top: 14px;
	display: flex;
	justify-content: center;
}

.access-btn{
	display: inline-block;
	padding: 10px 14px;
	border: 1px solid #111;
	background: #111;
	color: #fff;
	text-decoration: none;
	font-size: .9rem;
}
.access-btn:hover{ opacity: .85; }

/* =========================================================
  Modal（汎用：h-modal）
========================================================= */
.h-modal{
	position: fixed;
	inset: 0;
	z-index: 9999;

	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .18s ease, visibility .18s ease;
}

.h-modal__overlay{
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,.6);
	opacity: 0;
	transition: opacity .18s ease;
}

.h-modal__panel{
	position: relative;
	max-width: 900px;
	margin: 6vh auto;
	background: #fff;
	border-radius: 16px;
	padding: 24px;
	max-height: 88vh;
	overflow: auto;

	transform: translateY(12px);
	opacity: 0;
	transition: transform .22s ease, opacity .22s ease;
}

.h-modal.is-open{
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}
.h-modal.is-open .h-modal__overlay{ opacity: 1; }
.h-modal.is-open .h-modal__panel{
	transform: translateY(0);
	opacity: 1;
}

.h-modal--locked{ overflow: hidden; }

.h-modal__close{
	position: absolute;
	top: 12px;
	right: 12px;
	background: transparent;
	border: 0;
	cursor: pointer;
	font-size: 24px;
	line-height: 1;
}

.h-modal-link{
	background: transparent;
	border: 0;
	padding: 0;
	cursor: pointer;
	font: inherit;
	text-decoration: underline;
	text-underline-offset: 4px;
	text-decoration-thickness: 1px;
}
.h-modal-link:hover{ opacity: .75; }

/* =========================================================
  Price table（名刺価格表）
========================================================= */
.h-price__title{
	margin: 0 0 12px;
	font-size: 1.25rem;
	line-height: 1.3;
}
.h-price__note{
	margin: 0 0 16px;
	font-size: .95rem;
	opacity: .85;
}

.h-price__tableWrap{
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid rgba(0,0,0,.12);
	border-radius: 12px;
}

.h-price__table{
	width: 100%;
	border-collapse: collapse;
	min-width: 720px;
	background: #fff;
}

.h-price__table th,
.h-price__table td{
	padding: 12px 14px;
	border-bottom: 1px solid rgba(0,0,0,.08);
	text-align: center;
	white-space: nowrap;
}

.h-price__table thead th{
	position: sticky;
	top: 0;
	background: #fff;
	border-bottom: 1px solid rgba(0,0,0,.12);
}

.h-price__table tbody th{ text-align: left; }

.h-price__section th{
	text-align: left !important;
	font-weight: 700;
	background: rgba(0,0,0,.03);
}

.h-price__list{
	margin: 16px 0 0;
	padding: 0;
	border-top: 1px solid rgba(0,0,0,.12);
}

.h-price__row{
	display: grid;
	grid-template-columns: 220px 1fr;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px solid rgba(0,0,0,.08);
}

.h-price__row dt{ font-weight: 600; }
.h-price__row dd{ margin: 0; }

.h-price__muted{
	display: inline-block;
	margin-left: .4em;
	opacity: .75;
}

@media (max-width: 520px){
	.h-price__row{
		grid-template-columns: 1fr;
		gap: 6px;
	}
}

.h-price__subTitle{
	margin: 22px 0 10px;
	font-size: 1.05rem;
	line-height: 1.3;
}

.h-price__table--simple{ min-width: 0; }
.h-price__table--simple th{
	text-align: left;
	width: 38%;
	white-space: normal;
}
.h-price__table--simple td{
	text-align: left;
	white-space: normal;
}

/* =========================================================
  404
========================================================= */
.error-404{
	text-align: center;
	padding: 80px 20px;
	color: #333;
}

.error-404__image{
	max-width: 900px;
	width: 100%;
	height: auto;
	margin: 0 auto 100px;
	display: block;
}

.error-404__title{
	font-size: 1.1rem;
	margin-bottom: 8px;
	letter-spacing: 0.05em;
}

.error-404__text{
	font-size: 0.9rem;
	color: #666;
	margin-bottom: 32px;
}

.error-404__link{
	display: inline-block;
	font-size: 0.85rem;
	text-decoration: none;
	color: #333;
	border-bottom: 1px solid #333;
	padding-bottom: 2px;
	transition: opacity 0.2s;
	margin-bottom: 100px;
}
.error-404__link:hover{ opacity: 0.6; }

/* =========================================================
  Top section title（2重の横長タイトル：スクロール表示）
========================================================= */
.fade-slide-wrapper{
	position: relative;
	display: inline-block;
	padding-right: 5px;
	padding-bottom: 0;
	width: 100%;
}

.fade-slide-shadow{
	position: absolute;
	top: 5px;
	left: 0;
	width: 100%;
	height: 100%;
	border-right: 1px solid #333;
	border-bottom: 1px solid #333;
	z-index: 1;
	opacity: 0;
	pointer-events: none;
}

.fade-slide-main{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 0 15px;
	border: 1px solid #333;
	color: #333;
	writing-mode: horizontal-tb;
	z-index: 2;
	opacity: 0;
}

.fade-slide-shadow.in-view{
	animation: fadeSlideShadowAnim 0.9s 0.7s ease-in-out forwards;
}
.fade-slide-main.in-view{
	animation: fadeSlideMainAnim 0.6s 0.2s ease-in-out forwards;
}

@keyframes fadeSlideShadowAnim{
	0%   { opacity: 0; transform: translate(0,0); }
	100% { opacity: 1; transform: translate(0,0); }
}
@keyframes fadeSlideMainAnim{
	0%   { opacity: 0; transform: translateY(20px); }
	100% { opacity: 1; transform: translateY(0); }
}

/* =========================================================
  Works section（カード＋モーダル）
  ※同じ .work-modal が二重定義されてたので最終形に寄せて統合
========================================================= */
.work-section{
	width: 100%;
	padding-bottom: 12rem;
	display: block;
}

.work-heading{
	margin: 0 auto;
	width: 56px;
	padding: 100px 15px;
}
.work-heading__sub{
	color: #aaa;
	margin: 0;
}
.work-heading__title{
	font-size: 1.5em;
	margin: 0;
}

/* cards grid（box-系） */
.box-parent{
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.box-child{
	width: 40%;
	height: auto;
	display: flex;
	flex-direction: column;
	border-radius: 20px;
	padding-bottom: 50px;
	cursor: pointer;
	
}

@media screen and (max-width: 1360px){
	.box-parent{ width: 90%; max-width: initial; }
}
@media screen and (max-width: 1280px){
	.box-child{ width: 49%; }
}
@media screen and (max-width: 680px){
	.box-child{ width: 100%; }
	.box-child:nth-of-type(n+2){ margin-top: 30px; }
}

.box-img{
	width: 100%;
	position: relative;
	overflow: hidden;
}
.box-img::after{
	content: "";
	display: block;
	width: 100%;
	padding-top: 100%;
}
.box-img img{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
  	transform: scale(1);
}

.box-child:hover .box-img img {
  transform: scale(1.08);
}

.box-caption{
	text-align: center;
	padding: 30px;
}
.box-caption__jp{
	font-size: 1.2em;
	margin: 0;
}
.box-caption__en{ color: #aaa; }


/* modal（work-modal） */
.work-modal{
	position: fixed;
	inset: 0;
	z-index: 99999;

	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .22s ease, visibility .22s ease;
}
.work-modal.is-open{
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.work-modal__overlay{
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,.45);
	opacity: 0;
	transition: opacity .22s ease;
}
.work-modal.is-open .work-modal__overlay{ opacity: 1; }

.work-modal__panel{
	position: relative;
	max-width: 720px;
	width: calc(100% - 32px);
	margin: 10vh auto;
	background: #fff;
	border-radius: 14px;
	padding: 22px 18px;
	box-sizing: border-box;

	transform: translateY(12px);
	opacity: 0;
	transition: transform .22s ease, opacity .22s ease;
}
.work-modal.is-open .work-modal__panel{
	transform: translateY(0);
	opacity: 1;
}


.image {
  overflow: hidden;
}

.image img {
  transition: transform 0.4s ease;
  transform: scale(1);
}

.image:hover img {
  transform: scale(1.08);
}

/* 右上× */
.work-modal__closeIcon{
	position: absolute;
	top: 8px;
	right: 8px;
	width: 64px;
	height: 64px;
	border: 0;
	background: transparent;
	cursor: pointer;

	display: flex;
	align-items: center;
	justify-content: center;

	font-size: 26px;
	line-height: 1;
	padding: 0;

	-webkit-tap-highlight-color: transparent;
	z-index: 5;
	color: #111;
}
.work-modal__closeIcon::before{
	content: "";
	position: absolute;
	inset: 10px;
	border-radius: 999px;
	border: 1px solid #eee;
	background: #fff;
	pointer-events: none;
}
.work-modal__closeIcon > span{
	position: relative;
	z-index: 1;
	pointer-events: none;
}
.work-modal__closeIcon:hover{ opacity: .85; }
.work-modal__closeIcon:active{ transform: scale(.97); }

.work-modal__body{
	padding: 6px 6px 2px;
	text-align: center;
}

#workModal .work-modal__title{
	font-size: 1.8rem;
	font-weight: 700;
	letter-spacing: .02em;
	margin: 0 0 14px;
	padding: 0;
	border: 0;
	background: transparent;
	line-height: 1.2;
	text-align: center;
	box-shadow: none;
	outline: none;
}

.work-modal__section{ margin: 18px 0; }
.work-modal__heading{
	font-size: 1.05rem;
	margin: 0 0 10px;
	font-weight: 600;
}

/* list */
.work-modal__list{
	display: block;
	max-width: 520px;
	margin: 0 auto;
	text-align: left;
	padding-left: 1.2em;
	line-height: 1.7;
}
.work-modal__list li{ margin: 6px 0; }

.work-modal__badge{
	border: none;
	padding: 0;
	border-radius: 0;
	margin: 0 0 10px;
}

.work-modal__days{
	margin: 18px auto 0;
	padding: 10px 14px;
	border-radius: 10px;
	background: #fff3a0;
	display: inline-flex;
	gap: 10px;
	align-items: center;
	justify-content: center;
}
.work-modal__daysLabel{
	font-size: .95rem;
	font-weight: 600;
}
.work-modal__daysValue{ font-size: 1rem; }

.work-modal__cta{
	margin-top: 18px;
	display: flex;
	justify-content: center;
}

.work-modal__ctaBtn{
	display: inline-block;
	min-width: 220px;
	padding: 10px 14px;
	border-radius: 999px;
	border: 1px solid #111;
	background: #111;
	color: #fff;
	text-decoration: none;
	font-size: .9rem;
	text-align: center;
}
.work-modal__ctaBtn:hover{ opacity: .85; }

#workModalCta[hidden]{ display: none !important; }
















/* ===== 旧WordPress追加CSS ===== */
.footer-social-row{
  margin-top: 30px;
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: nowrap;
}
.footer-social-unit{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
}

.footer-social-title{
  font-size: 13px;
  color: #444;
}

.footer-social-bar{
  color: #aaa;
  font-size: 12px;
}

.footer-social-divider{
  width: 1px;
  height: 18px;
  background: #eee;
}

.footer-social-link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: #fff;
  text-decoration: none;
}

.footer-social-link:hover{
  opacity: .8;
}

.footer-social-icon{
  width: 16px;
  height: 16px;
  display: block;
}

/* ===== 静的化で追加 ===== */
.insta-link{ text-align:center; margin: 40px 0; }
.insta-link a{ display:inline-flex; align-items:center; gap:10px; padding:14px 24px; border:1px solid #333; border-radius:999px; color:#333; text-decoration:none; }
.insta-link a:hover{ opacity:.8; }
.insta-link img{ width:24px; height:24px; }
/* 下層ページの小見出し（h2より控えめに） */
.maineditor-content .article-main h3.wp-block-heading{ font-size: 0.95em; font-weight: 600; margin: 1.8em 0 0.4em; padding-left: 0.6em; border-left: 3px solid #00C1D6; }
/* 404ページ */
.notfound{ text-align:center; padding: 20px 0 60px; }
.notfound img{ max-width: 100%; height: auto; }
.notfound__btn{ display:inline-block; margin-top: 10px; padding: 12px 32px; border: 1px solid #333; border-radius: 999px; color:#333; text-decoration:none; }
.notfound__btn:hover{ opacity:.8; }

/* ===== レスポンシブ調整（静的化で追加） ===== */
/* 一日の流れ：スマホでは縦のタイムラインにする */
@media (max-width: 640px){
	.dayflow{ flex-direction: column; align-items: flex-start; width: max-content; margin: 0 auto; padding: 0 110px 0 0; }
	.flow-item{ flex-direction: column; align-items: flex-start; }
	.flow-item::after,
	.flow-item.is-short::after{ width: 3px; height: 46px; margin-left: calc(var(--dot-size) / 2 - 1.5px); transform-origin: top center; transform: scaleY(0); }
	.flow-item.is-show::after{ transform: scaleY(1); }
	.label, .label--top, .label--bottom{ left: calc(var(--dot-size) + 14px); top: -4px; bottom: auto; font-size: 15px; text-align: left; transform: translate(0, -6px); }
	.flow-item.is-show .label{ transform: translate(0, 0); text-align: left; }
}
/* 一日の流れ：タブレットでは線を短くして画面内に収める */
@media (min-width: 641px) and (max-width: 900px){
	.flow-item::after{ width: 90px; }
	.flow-item.is-short::after{ width: 45px; }
}
/* 価格表：スマホでは横スクロールできることを表示 */
@media (max-width: 760px){
	.h-price__tableWrap::before{ content: "← 横にスクロールできます →"; display: block; position: sticky; left: 0; padding: 6px 10px; font-size: 12px; color: #888; background: #fafafa; }
}
/* Instagramボタン：スマホでは文字を小さく */
@media (max-width: 640px){
	.insta-link a{ font-size: 13px; padding: 12px 18px; border-radius: 16px; text-align: left; }
}
/* 特定商取引法の表：スマホでは項目名を上、内容を下に並べる（左の列が狭くなりすぎるため） */
@media (max-width: 640px){
	.fixed-page .subeditor-content .wp-block-table.is-style-regular tr{ display: block; padding: .9em .2em; border-bottom: 1px solid #eee; }
	.fixed-page .subeditor-content .wp-block-table.is-style-regular th,
	.fixed-page .subeditor-content .wp-block-table.is-style-regular td{ display: block; padding: 0; border-bottom: 0; }
	.fixed-page .subeditor-content .wp-block-table.is-style-regular th{ margin-bottom: .3em; font-weight: 700; }
}