@charset "utf-8";
/*
Theme Name:ALSOK
Author:BASARA
Version:6.0
*/


/* ============================================================

	clamp関数に関して：特筆がない限り、viewport:375-1280px の設定です。

============================================================ */
*,
*:before,
*:after {
	font-style:normal;
	box-sizing:border-box;
	backface-visibility:hidden;

}
*:before,
*:after {
	pointer-events:none;
}
:root {
	--color-base-font:#000;
	--color-base-bg:#fff;
	--color-main:#1E23AA;
	--color-main-light:#EDF1FF;
	--color-sub:#FFF100;
	--color-link:#000;
	--color-accent:#11986a;
	--color-attention:crimson;
	--color-gray:#ccc;
	--small-contents-width:800px;
	--main-contents-width:min(1200px, 88.5%);
	--large-contents-width:min(1700px, 88.5%);
	--thin-font-weight:300;
	--normal-font-weight:500;
	--semibold-font-weight:600;
	--bold-font-weight:700;
	--black-font-weight:900;

	/* viewport:375-1300px 65-115px; headerの高さ */
	--header-height:clamp(4.063rem, calc(2.796rem + 5.405vw), 7.188rem);
	--header-z-index:100;	/* z-index の基準値 */
	--trans:0.3s ease;		/* transitionの基準値 */

	--notoserif:"Noto Serif JP", serif;	/* NotoserifJPフォント */
	--kanit:"Kanit", sans-serif;		/* kanitフォント */
	--roboto:"Roboto", sans-serif;		/* Robotoフォント */
	--logo-aspect:8/6;				/* ロゴアイコン（対角2色）の比率 */
	--logo-clip:polygon(0 0, 100% 0, 0 100%);				/* ロゴアイコンの左上 */
	--logo-clip-reverse:polygon(100% 0, 100% 100%, 0 100%);	/* ロゴアイコンの右下 */
}
html {
	margin:0;
	padding:0;
	scroll-behavior:smooth;
}
body {
	font-family:"Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Meiryo", sans-serif;
	color:var(--color-base-font);
	font-size:16px;
	font-weight:var(--normal-font-weight);
	line-height:1.6;
	word-break:break-all;
	margin:0;
	padding:0;
}
/* スマホ用メニュー表示時 */
body:has(#header.active) {
	height:100vh;
	overflow:clip;
}
div,
p,
ul,
ul li,
dl,
dt,
dd {
	font-size:1em;
	list-style:none;
	margin:0;
	padding:0;
	box-sizing:border-box;
}
img,
video,
object {
	max-width:100%;
	height:auto;
	border:none;
}
img {
	display:block;
	image-rendering:-webkit-optimize-contrast;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	font-size:1em;
	line-height:1;
	letter-spacing:0.025em;
	padding:0;
	margin:0;
}
a {
	color:var(--color-link);
	text-decoration:none;
	transition:all ease 0.3s;
}
a[target="_blank"] {
	position:relative;
	display:inline-grid;
	grid-template-columns:1fr auto;
	align-items:center;
	gap:0 0.5em;
	width:fit-content;
	padding-right:0.5em;
	text-decoration:underline;
	text-underline-offset:0.1em;

	&:after {
		content:"";
		display:block;
		width:1em;
		height:auto;
		aspect-ratio:1;
		background-color:currentColor;
		mask:url(images/common/icon_link.svg) no-repeat center / contain;
		-webkit-mask:url(images/common/icon_link.svg) no-repeat center / contain;
	}
}

@media (any-hover:hover){
	a:hover { text-decoration:underline; color:var(--color-main);}
	a:has(img):hover { opacity:0.8;}
}
@media (any-hover:none){
	a:active { text-decoration:underline; color:var(--color-main);}
	a:has(img):active { opacity:0.8;}
}

a[href^="tel:"] {
	text-decoration:none;
	pointer-events:none;
	text-emphasis:none !important;
}
a[href^="fax:"] {
	text-decoration:none;
	pointer-events:none;
}
.pc { display:inherit;}
.tb { display:none;}
.mb { display:none;}
.pc_rev { display:none;}
.tb_rev { display:inherit;}
.mb_rev { display:inherit;}

/* AOS.js 微調整 */
.home [data-aos="fade-up"] {
	transform:translate3d(0, 80px, 0);
}

@media only screen and (max-width:820px) {
	.pc { display:none;}
	.tb { display:block;}
	.mb { display:none;}
	.pc_rev { display:inherit;}
	.tb_rev { display:none;}
	.mb_rev { display:inherit;}
}
@media only screen and (max-width:468px) {
	body { font-size:15px; min-width:375px;}
	a[href^="tel:"] { pointer-events:all;}
	.pc { display:none;}
	.tb { display:none;}
	.mb { display:block;}
	.pc_rev { display:inherit;}
	.tb_rev { display:inherit;}
	.mb_rev { display:none;}
}

/* =========================================================================================
Header
=========================================================================================*/
#header {
	width:100%;
	height:var(--header-height);
	background:#fff;
	padding:0;
	margin:0;
	position:fixed;
	top:0;
	z-index:var(--header-z-index);
	transition:0.5s;
}
#header .inner {
	max-width:unset;
	width:100%;
	height:100%;
	display:grid;
	grid-template-columns:auto 1fr;
	align-items:center;
	gap:20px;
	padding-inline:30px;
	position:relative;
	background-color:#fff;
}
#header .logo img {
	width:clamp(8.75rem, calc(7.233rem + 6.472vw), 15rem);/* viewport:375-1920px 140-240px */
}
#header .logo a {
	display:flex;
	align-items:center;
	gap:0.5em;
	font-size:clamp(0.75rem, calc(0.568rem + 0.777vw), 1.5rem);/* viewport:375-1920px 12-24px */

	@media (any-hover:hover){
		&:hover { opacity:0.75; text-decoration:none;}
	}
	@media (any-hover:none){
		&:active { opacity:0.75; text-decoration:none;}
	}
}

/*search-area*/
#header .search-open {
	width:40px;
	aspect-ratio:1 / 1;
	background:var(--color-main) url(images/common/icon_search.svg) no-repeat center;
	background-size:40%;
	border-radius:50%;
	cursor:pointer;
}
/*クリック後、JSでボタンに btnactive クラスが付与された後の見た目*/
#header .search-open.btnactive {
	background:var(--color-main) url(images/common/icon_close.svg) no-repeat center;
	background-size:40%;
}
#header #search-wrap {
	width:100%;
	background:var(--color-main);
	padding:20px;
	pointer-events:none;
	position:absolute;
	top:100px;
	left:0;
	opacity:0;
	z-index:-1;
	transition:all 0.4s;
}
/*ボタンクリック後、JSで#search-wrapに panelactive クラスが付与された後の見た目*/
#header #search-wrap.panelactive {
	pointer-events:inherit; /*クリック可能*/
	opacity:1; /*不透明に変更*/
	z-index:3; /*全面に出現*/
}
#header .search-area form {
	display:flex;
	flex-wrap:nowrap;
	align-items:center;
	justify-content:center;
}
#header .search-area input[type="text"] {
	width:100%;
	max-width:600px;
	background:#fff;
	border:1px solid var(--color-gray);
	padding:0.25em 0.5em;
	margin-right:10px;
	transition:0.5s;
}
#header .search-area input[type="submit"] {
	color:#fff;
	text-indent:-9999px;
	width:40px;
	aspect-ratio:1 / 1;
	background:var(--color-main) url(images/common/icon_search.svg) no-repeat center;
	background-size:50%;
	padding:0;
	margin:0;
}
#header .search-area input[type="submit"]:hover {
	opacity:0.8;
	transition:0.3s;
}

/*globalnavi*/
#header {
	& #g-navi {
		display:flex;
		align-items:center;
		justify-content:end;
		flex-wrap:wrap;
		gap:0 clamp(1.5rem, calc(-1.75rem + 4.063vw), 3.125rem);/* viewport:1300-1920px 24-50px */
	}
	& #g-navi > :not(.mega) { font-size:1.125em;}
	& :where(.link_home, .openbtn) { display:none;}
}

/* has_mega */
#header .has_mega {
	position:relative;
	padding-block:calc((var(--header-height) - 1lh) / 2);
	padding-right:1em;
	cursor:pointer;

	&:before, &:after {
		content:"";
		position:absolute;
		display:block;
		width:0.7222em;/* 13px */
		aspect-ratio:13/3;
		background-color:var(--color-main);
		inset:50% 0 auto auto;
		translate:0 -50%;
		transition:rotate var(--trans);
	}
	&:before { rotate:90deg;}

	/* メガメニュー動作 */
	&.active {
		color:var(--color-main);

		&:before { rotate:180deg;}
		& + .mega {
			opacity:1;
			pointer-events:auto;
			visibility:visible;
		}
	}
	
	@media (any-hover:hover) {
		&:hover { color:var(--color-main);}
	}
	@media (any-hover:none){
		&:active { color:var(--color-main);}
	}
}

/* mega */
#header .mega {
	position:absolute;
	inset:100% auto auto 0;
	width:100%;
	background-color:#fff;
	pointer-events:none;
	opacity:0;
	visibility:hidden;
	transition:var(--trans);
}
#header .mega_wrap {
	display:grid;
	grid-template-columns:auto 1fr 1fr;
	column-gap:65px;
	padding-block:1.8125em 3.3125em;/* 29px 53px */
	padding-inline:max(1rem, calc((100% - var(--main-contents-width)) / 2));
}
#header .mega_name {
	margin-block:0.5em;
	font-size:1.6875em;/* 27px */
	font-weight:bold;
	color:var(--color-main);
}
#header .mega_r {
	display:grid;
	grid-template-columns:subgrid;
	grid-auto-rows:min-content;
	grid-column:span 2;
	font-size:1.0625em;/* 17px */

	& a {
		display:flex;
		justify-content:space-between;
		align-items:center;
		gap:0.5em;
		padding-block:1.2941em;/* 22px */
		border-bottom:solid 1px;

		&:after {
			content:"";
			width:1.3529em;/* 23px */
			height:1.3529em;/* 23px */
			background:
				url(images/common/arrow_white.svg) no-repeat center / auto 50%,
				var(--color-main);
			border:solid 1px var(--color-main);
			border-radius:0.3333em;
			transition:var(--trans);
		}
	}
}
/* link_contact */
#header .link_contact a {
	display:flex;
	align-items:center;
	gap:0.7778em;/* 14px */
	padding-block:0.5556em;/* 10px */
	padding-inline:1.2778em 1.6111em;/* 23px 29px */
	color:var(--color-main);
	border:solid 1px;
	border-radius:0.5556em;/* 10px */
	transition:all var(--trans);

	&:before {
		content:"";
		display:block;
		width:1.1667em;/* 21px */
		aspect-ratio:21/17;
		background-color:currentColor;
		mask:url(images/common/icon_airplane.svg) no-repeat center / contain;
		-webkit-mask:url(images/common/icon_airplane.svg) no-repeat center / contain;
	}
}
@media (any-hover:hover) {
	#header .link_contact a:hover {
		background-color:var(--color-main);
		color:#fff;
		opacity:1;
		text-decoration:none;
	}
}
@media (any-hover:none) {
	#header .link_contact a:active {
		background-color:var(--color-main);
		color:#fff;
		opacity:1;
		text-decoration:none;
	}
}

#header .mb_menu_logo { display:none;}

@media only screen and (max-width:1300px) {
	#header {

		& .inner {
			grid-template-columns:1fr auto;
			padding-inline:15px 0;
			transition:background-color var(--trans);
		}
		& .logo { width:fit-content; transition:opacity var(--trans);}
		& :where(.link_home, .openbtn) { display:block;}
		& .openbtn {
			--gap:5px;

			display:flex;
			flex-direction:column;
			align-items:center;
			justify-content:center;
			gap:var(--gap);
			padding:0.5rem;
			height:100%;
			aspect-ratio:1;
			font-size:0.875rem;
			color:var(--color-main);
			transition:all var(--trans);

			& .btn_wrap {
				--h:2px;
				
				position:relative;
				width:2.75em;
				height:calc(var(--h) * 3 + var(--gap) * 2);
			}
			& span {
				--rotate:30deg;

				position:absolute;
				inset-inline:0 auto;
				width:100%;
				height:2px;
				background-color:currentColor;
				transition:all var(--trans);
			}
			& span:nth-of-type(1) { inset-block:0 auto;}
			& span:nth-of-type(2) { inset-block:50% auto; translate:0 -50%;}
			& span:nth-of-type(3) { inset-block:auto 0;}
			& p { font-family:var(--kanit); text-align:center;}
		}
		& #g-navi-area {
			position:absolute;
			inset:100% auto auto 0;
			width:100%;
			translate:0 -101%;
			transition:translate var(--trans);
			z-index:-1;
		}
		& #g-navi {
			--gap:1rem;

			display:grid;
			grid-template-columns:1fr 1fr;
			grid-auto-rows:min-content;
			grid-auto-flow:dense;
			gap:0 var(--gap);
			padding-inline:var(--gap);
			height:calc(100vh - var(--header-height));
			background-color:var(--color-main);
			color:#fff;
			overflow-y:auto;
			scrollbar-width:thin;
		}
		& :is(.link_home, .has_mega, li:not([class])) { border-bottom:solid 1px currentColor;}
		& :is(.link_home, li:not([class])) a { display:block; color:#fff; padding-block:1em;}
		& :is(.mega, .link_contact, .mb_menu_logo) { grid-column:span 2;}
		& .has_mega {
			padding-block:1em;

			&:before, &:after { background-color:currentColor;}
		}
		& .mega {
			position:static;
			display:grid;
			grid-template-rows:0fr;
			opacity:1;
			visibility:visible;
			pointer-events:auto;
		}
		& .has_mega {

			&.active { color:inherit;}
			@media (any-hover:hover) { &:hover { color:inherit;}}
			@media (any-hover:nome) { &:active { color:inherit;}}
		}
		& .has_mega.active + .mega { grid-template-rows:1fr;}
		& .mega_wrap {
			display:block;
			padding:0;
			overflow:hidden;
		}
		& .mega_l { display:none;}
		& .mega_r {
			grid-template-columns:1fr 1fr;
			gap:0 var(--gap);
			padding-inline:1rem;
			background-color:#fff;
		}
		& .mega_r a {
			padding-block:1em;
			border:none;
			background:repeating-linear-gradient(
				90deg,
				#8A93CC,
				#8A93CC 2px,
				transparent 2px,
				transparent 4px
			) repeat-x left bottom / 100% 1px;
		}
		/* 2カラム表示時の、最下段の要素の破線非表示 */
		& .mega_r a:nth-of-type(even):last-of-type,
		& .mega_r a:nth-of-type(odd):last-of-type,
		& .mega_r a:has( + a:nth-of-type(even):last-of-type) { background:none;}

		& .link_contact { margin-block:2rem;}
		& .link_contact a {
			justify-content:center;
			background-color:#fff;
			margin-inline:auto;
			width:calc((100% - var(--gap)) / 2);
		}
		& .mb_menu_logo {
			display:block;
			width:calc((100% - var(--gap)) / 2);
			height:3rem;
			margin:0 auto 3rem;
			background-color:#fff;
			mask:url(images/top/fv_slide_text.svg) no-repeat center / contain;
			-webkit-mask:url(images/top/fv_slide_text.svg) no-repeat center / contain;
		}
	}

	/* header.active */
	#header.active {

		& .inner { background-color:var(--color-main);}
		& .logo { opacity:0; pointer-events:none;}
		& .openbtn { color:#fff;}
		& .openbtn span:nth-of-type(1) {
			inset-block:50% auto;
			translate:0 -50%;
			rotate:var(--rotate);
		}
		& .openbtn span:nth-of-type(2) { opacity:0;}
		& .openbtn span:nth-of-type(3) {
			inset-block:auto 50%;
			translate:0 50%;
			rotate:calc(var(--rotate) * -1);
		}
		& #g-navi-area { translate:0 0%;}
	}
}
@media only screen and (max-width:820px) {
	#header {

		& :is(#g-navi, .mega_r) { grid-template-columns:1fr;}
		& :is(.mega, .link_contact, .mb_menu_logo) { grid-column:span 1;}
		& .link_contact a { width:min(350px, 100%);}
		& .mb_menu_logo { width:100%;}
	}
}

/* =========================================================================================
Footer
=========================================================================================*/
#footer {
	width:var(--large-contents-width);
	margin-inline:auto;
	padding-top:clamp(1.656rem, calc(-3.953rem + 23.933vw), 8.313rem);/* viewport:375-820px 26.5-133px */
	padding-bottom:clamp(1.344rem, calc(-0.078rem + 6.067vw), 3.031rem);/* viewport:375-820px 21.5-48.5px */

	& .f_navs {
		display:flex;
		justify-content:space-between;
		gap:2rem;

		& .f_logo {
			display:block;
			width:clamp(14.688rem, calc(9.157rem + 23.596vw), 21.25rem);/* viewport:375-820px 235-340px */
		}
		& .f_corpName {
			margin-top:1.5em;
			font-size:clamp(1.25rem, calc(1.039rem + 0.899vw), 1.5rem);/* viewport:375-820px 20-24px */
			font-weight:bold;
		}
		& address { flex-shrink:1;}
		& address p {
			margin-block:0.875em 1.625em;
			font-size:clamp(0.875rem, calc(0.77rem + 0.449vw), 1rem);/* viewport:375-820px 14-16px */
		}
		& address iframe { width:100%;}
		& nav {
			display:grid;
			grid-template-columns:auto auto 1fr;
			gap:0 clamp(2rem, calc(-9.442rem + 13.077vw), 6.25rem);/* viewport:1400-1920px 32-100px */
			flex-shrink:0;
		}
		& li {
			display:flex;
			align-items:baseline;
			gap:5px;
			font-size:clamp(0.875rem, calc(0.77rem + 0.449vw), 1rem);/* viewport:375-820px 14-16px */
		}
		& li:before { content:""; display:block; height:auto; aspect-ratio:1; translate:0 -50%;}
		& .large { font-size:clamp(0.938rem, calc(0.779rem + 0.674vw), 1.125rem);/* viewport:375-820px 15-18px */}
		& .large:before { width:0.5em; background-color:var(--color-main);}
		& li:not(.large) { margin-left:1em; font-weight:400;}
		& li:not(.large):before { width:5px; background-color:currentColor; border-radius:100%;}
		& ul > * + .large { margin-top:1em;}
		& ul > * + li:not(.large) { margin-top:0.625em;}
	}

	& .f_otherLinks {
		display:flex;
		justify-content:space-between;
		gap:2rem;
		margin-top:55.5px;
		padding-top:33.5px;
		border-top:solid 1px #BABABA;

		& nav ul {
			display:flex;
			flex-wrap:wrap;
			gap:10px clamp(1.875rem, calc(1.085rem + 3.371vw), 2.813rem);/* viewport:375-820px 30-45px */
			font-size:14px;
		}
		& li {
			display:flex;
			align-items:center;
			gap:0.2143em;/* 3px */
		}
		& li:before {
			content:"";
			display:block;
			background-color:#8A93CC;
			width:0.7143em;/* 10px */
			height:0.7143em;
			border-radius:100%;
		}
		& .f_pageTop {
			display:flex;
			align-items:center;
			gap:0.5em;
			font-size:18px;
			font-weight:bold;
			flex-shrink:0;
		}
		& .f_pageTop:after {
			content:"";
			display:block;
			width:0.75em;
			height:0.75em;
			background-color:var(--color-main);
			mask:url(images/common/arrow.svg) no-repeat center / contain;
			-webkit-mask:url(images/common/arrow.svg) no-repeat center / contain;
			rotate:-90deg;
		}
	}
	& .copy {
		font-size:0.8125em;
		margin-top:clamp(2.25rem, calc(0.723rem + 6.517vw), 4.063rem);/* viewport:375-820px 36-65px */
	}
}

@media only screen and (max-width:1400px) {
	#footer {
		& .f_navs {

			& nav {
				grid-template:
					"ul1 ul3" auto
					"ul2 ul3" 1fr / 1fr 1fr;
				gap:1rem;
			}
			& ul:nth-of-type(1) { grid-area:ul1;}
			& ul:nth-of-type(2) { grid-area:ul2;}
			& ul:nth-of-type(3) { grid-area:ul3;}
			& li { font-size:0.875rem;}
		}
	}
}
@media only screen and (max-width:820px) {
	#footer {
		display:grid;
		grid-template:
			"pageTop" auto
			"f_navs" auto
			"otherLinks" 1fr / 1fr;

		& .f_navs { grid-area:f_navs; flex-direction:column; margin-top:2rem;}
		& .f_navs address { text-align:center;}
		& .f_navs .f_logo { margin-inline:auto;}
		& .f_navs nav { align-self:center;}
		& .f_otherLinks { display:contents;}
		& .f_otherLinks nav { grid-area:otherLinks; margin-top:1.5rem; padding-top:1rem; border-top:solid 1px var(--color-gray);}
		& .f_otherLinks .f_pageTop { grid-area:pageTop; width:fit-content; margin-inline:auto;}
	}
}
@media only screen and (max-width:468px) {

}

/* =========================================================================================
Page Top
=========================================================================================*/
#page-top {
	display:none; /*最初は非表示*/
	position:fixed;
	z-index:99;
	bottom:1.5%;
	right:1.5%;
}
#page-top a {
	display:block;
	text-decoration:none;
	color:#fff;
	width:50px;
	height:50px;
	border-radius:50%;
	line-height:1;
	font-weight:var(--bold-font-weight);
	background:var(--color-main) url(images/common/page_top.svg) no-repeat center;
	background-size:1.5em;
	text-indent:-9999px;
}
#page-top a:hover {
	opacity:0.8;
}
#page-top.active { display:block;}

@media only screen and (max-width:820px) {
}
@media only screen and (max-width:468px) {
}

/* =========================================================================================
Layout
=========================================================================================*/
#wrapper {
	padding:0;
	margin:0 auto;
	position:relative;
	overflow:hidden;
}
#contents {
	padding-block:var(--header-height) 0;
	margin:0 auto;
	position:relative;
}
#main {
	margin:0;
	padding:0;
}
section {
	position:relative;
	padding-block:100px;
	margin:0;
}
.inner {
	max-width:var(--main-contents-width);
	width:calc(100% - 40px - 40px); /*左右の余白40pxずつ*/
	margin:0 auto;
	position:relative;
}
/* @media only screen and (max-width:980px) {
	#contents {
		padding-block:60px 0;
	}
} */
@media only screen and (max-width:820px) {
	section {
		padding-block:75px;
	}
	.inner {
		width:calc(100% - 30px - 30px);
	}
}
@media only screen and (max-width:468px) {
	section {
		padding-block:50px;
	}
	.inner {
		width:calc(100% - 20px - 20px);
	}
}

/*sidebar*/
#contents:has(#sidebar) /*#sidebarがあるとき*/ {
	width:calc(100% - 40px - 40px);
	max-width:var(--main-contents-width);
	display:grid;
	grid-template-columns:minmax(200px, 10%) 1fr;
	gap:5%;
	margin:0 auto;
}
#contents:has(#sidebar) #main {
	min-width:0; /*はみ出し対策*/
	order:2;
}
#contents:has(#sidebar) #main .inner {
	width:100%;
}
#sidebar {
	padding-block:0 50px;
	margin:0;
	order:1;
}
#sidebar h2 {
	font-size:1.25rem;
	border-bottom:1px solid;
	padding-block:0.5em;
	margin-bottom:0.5em;
}
#sidebar nav {
	margin-bottom:50px;
}
#sidebar .banner {
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
	align-items:start;
	gap:5%;
}
#sidebar .banner a {
	display:block;
}
@media only screen and (max-width:820px) {
	#contents:has(#sidebar) /*#sidebarがあるとき*/ {
		width:100%;
		display:flex;
		flex-direction:column;
		gap:0;
	}
	#contents:has(#sidebar) #main {
		order:1;
	}
	#contents:has(#sidebar) #main .inner,
	#sidebar {
		width:calc(100% - 30px - 30px);
	}
	#sidebar {
		order:2;
		margin-inline:auto;
	}
}
@media only screen and (max-width:468px) {
	#contents:has(#sidebar) #main .inner,
	#sidebar {
		width:calc(100% - 20px - 20px);
	}
}

/* =========================================================================================
Tabs
=========================================================================================*/
.tabs {
	margin:auto;
}
.tabs .tab-list {
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	align-items:stretch;
	gap:5px;
	margin:0;
}
.tabs .tab-list .tab-item {
	font-size:1.25rem;
	font-weight:var(--bold-font-weight);
	background:var(--color-gray);
	border:none !important;
	border-radius:10px 10px 0 0;
	display:flex;
	flex-direction:column;
	align-items:start;
	justify-content:center;
	padding:20px 30px;
	cursor:pointer;
	transition:0.3s;
}
.tabs .tab-list .tab-item.active {
	color:#fff;
	background:var(--color-main);
}
.tabs .tab-content {
	background-color:var(--color-main);
	padding:70px 40px 40px;
	margin-right:calc(50% - 50vw);
	margin-left:calc(50% - 50vw);
	padding-right:calc(50vw - 50%);
	padding-left:calc(50vw - 50%);
}
.tabs .tab-content .box {
	background:#fff;
	padding:30px;
}
.tabs .tab-content .box .btn {
	margin-top:2em;
}
/*制御*/
.tabs .tab-content .tab-panel {
	display:none;
}
.tabs .tab-content .tab-panel.active {
	display:block;
}
@media only screen and (max-width:820px) {
	.tabs .tab-list .tab-item {
		font-size:clamp(1rem, calc(0.789rem + 0.899vw), 1.25rem); /* min:16px, max:20px */
		padding:15px 20px 10px;
	}
}
@media only screen and (max-width:468px) {
	.tabs .tab-content {
		padding:30px 20px 25px;
		margin-inline:-20px -20px;
	}
}

/* =========================================================================================
Btn / WP-block-button
=========================================================================================*/
.btn {
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:20px;
	padding:0;
}
.wp-block-buttons {
	display:flex;
	align-items:stretch;
}
.btn a,
.wp-block-button a {
	display:grid;
	grid-template-columns:1fr auto;
	align-items:center;
	position:relative;
	padding:0.5em 1.5em;
	border:2px solid var(--color-main);
	border-radius:1.5em 1.5em 0 1.5em;
	background-color:transparent;
	color:var(--color-main);
	font-size:clamp(1.063rem, calc(0.904rem + 0.674vw), 1.25rem);/* viewport:375-820px 17-20px */
	font-weight:var(--bold-font-weight);
	text-align:center;
	text-decoration:none;
	transition:all var(--trans);
}
a:is([href$=".pdf"], [href$=".xlsx"], [href$=".doc"]):after {
	content:"";
	position:static;
	translate:unset;
	display:inline-block;
	width:1em;
	height:1lh;
	background-color:currentColor;
	mask:url() no-repeat center / contain;
	-webkit-mask:url() no-repeat center / contain;
	transition:all var(--trans);
}
a[href$=".pdf"]:after { mask-image:url(images/common/icon_pdf.svg); -webkit-mask-image:url(images/common/icon_pdf.svg);}
a[href$=".xlsx"]:after { mask-image:url(images/common/icon_xlsx.svg); -webkit-mask-image:url(images/common/icon_xlsx.svg);}
a[href$=".doc"]:after { mask-image:url(images/common/icon_word.svg); -webkit-mask-image:url(images/common/icon_word.svg);}
.wp-block-button a {
	height:100%;
	/* display:flex;
	align-items:center;
	justify-content:center; */
}
.btn a::before,
.wp-block-button a::before {
	--inset-space:0.2em;

	content:"";
	position:absolute;
	inset:auto var(--inset-space) var(--inset-space) auto;
	display:block;
	width:0.8em;
	aspect-ratio:var(--logo-aspect);
	background-color:currentColor;
	clip-path:var(--logo-clip-reverse);
}
.btn a:hover,
.wp-block-button a:hover {
	color:#fff;
	background-color:var(--color-main);
	text-decoration:none;
	opacity:1;
}
.btn a:hover::after,
.wp-block-button a:hover::after {
	background:currentColor;
}

/*color-white*/
.btn a.white {
	color:var(--color-base-font);
	background-color:#fff;
}
.btn a.white:hover {
	color:#fff;
	background-color:var(--color-base-font);
	border-color:#fff;
}
.btn a.white::after {
	background:var(--color-base-font);
}
.btn a.white:hover:after {
	background:#fff;
}

/*color-contact*/
.btn a.contact span {
	display:flex;
	align-items:center;
	justify-content:center;
	gap:0.5em;
}
.btn a.contact span::before /*アイコン表示*/ {
	content:"";
	width:1.5em;
	aspect-ratio:35 / 24;
	background:url(images/common/icon_mail.svg) no-repeat center;
	background-size:contain;
	display:block;
}
.btn a.contact::after {
	display:none;
}

/*size*/
.btn a.large {
	font-size:1.65em;
	font-weight:var(--bold-font-weight);
	min-width:600px;
}

/* .square */
.btn.square {
	padding:0;

	& a {
		--r:5px; /* radius値 */

		min-width:170px;
		padding-block:0.625em;
		padding-inline:1.5em 2em;
		background-color:var(--color-main);
		color:#fff;
		font-size:18px;
		font-weight:bold;
		border-radius:var(--r) var(--r) 0 var(--r);

		&:before {
			inset:auto var(--r) var(--r) auto;
			width:0.75em;
			aspect-ratio:var(--logo-aspect);
			border-radius:0;
			background-color:currentColor;
			clip-path:var(--logo-clip-reverse);
			translate:0 0;
			mask:none;
		}
	}

	&.reverse a {
		color:var(--color-main);
		background-color:#fff;
	}

	@media (any-hover:hover){
		&:not(.reverse) a:hover { color:var(--color-main); background-color:transparent;}
		&.reverse a:hover { background-color:var(--color-sub);}
	}
	@media (any-hover:none){
		&:not(.reverse) a:active { color:var(--color-main); background-color:transparent;}
		&.reverse a:active { background-color:var(--color-sub);}
	}
}
/* .round */
.btn.round {
	padding:0;

	& a {
		padding-block:0.7778em;/* 14px */
		padding-inline:1.5556em 3.3333em;/* 28px 60px */
		background-color:var(--color-main);
		border:solid 1px currentColor;
		border-radius:100vmax;
		color:#fff;
		font-size:1.125rem;
		font-weight:bold;

		&:before {
			inset:50% 1em auto auto;
			translate:0 -50%;
			width:auto;
			height:1em;
			aspect-ratio:5.25/10.5;
			background-color:currentColor;
			mask:url(images/common/arrow.svg) no-repeat center / contain;
			-webkit-mask:url(images/common/arrow.svg) no-repeat center / contain;
			clip-path:none;
		}
		@media (any-hover:hover) {
			&:hover { color:var(--color-main); background-color:var(--color-sub);}
		}
		@media (any-hover:none){
			&:active { color:var(--color-main); background-color:var(--color-sub);}
		}
	}
}

/*wp-block-button*/
.wp-block-buttons + .wp-block-buttons {
	margin-top:0.5em;
}

@media only screen and (max-width:820px) {
	.btn a.large {
		min-width:100%;
	}
}
@media only screen and (max-width:468px) {
	.btn {
		justify-content:center !important;
	}
	.btn a {
		min-width:80% !important;
	}
}

/* =========================================================================================
Breadcrumbs
=========================================================================================*/
.breadcrumbs {
	--gap:0.5em;
	display:flex;
	flex-wrap:wrap;
	gap:0 var(--gap);
	padding-inline:0.5em;
	background-color:#fff;
}
.breadcrumbs a { text-decoration:underline;}
/* .breadcrumbs > * + *:before { content:"/"; padding-right:var(--gap);} */
/* .breadcrumbs {
	color:var(--color-base-font);
	text-align:left;
	line-height:1.4;
	padding-block:10px;
}
.breadcrumbs a {
	color:var(--color-base-font);
	padding-right:1.5em;
	position:relative;
}
.breadcrumbs a.home {
	padding-left:1.5em;
}
.breadcrumbs a.home::before {
	content:"";
	width:1em;
	aspect-ratio:1 / 1;
	background:url(images/common/icon_home.svg) no-repeat;
	background-size:contain;
	position:absolute;
	top:50%;
	left:0;
	translate:0 -40%;
}
.breadcrumbs a::after {
	content:"";
	width:0.75em;
	aspect-ratio:1 /1;
	background:url(images/common/arrow.svg) no-repeat;
	background-size:contain;
	position:absolute;
	top:50%;
	right:0.2em;
	translate:0 -40%;
} */
@media only screen and (max-width:820px) {
	.breadcrumbs {
		font-size:0.9rem;
	}
}
@media only screen and (max-width:468px) {
	.breadcrumbs {
		font-size:0.8rem;
	}
}

/* =========================================================================================
Post list
=========================================================================================*/
/*common*/
.post-list {
	width:100%;
	margin:0;
	padding:0;
}
.post-list ul {
	width:100%;
	margin:0;
	padding:0;
}
.post-list ul a {
	color:var(--color-base-font);
	display:block;
}
.post-list ul a:hover {
	/* text-decoration:none; */
}
.post-list ul li {
	width:100%;
}
.post-list .no-post {
	text-align:center;
	display:block;
	padding:10vh 1em;
}

/*column*/
.post-list.column ul {
	margin-bottom:20px;
}
.post-list.column ul li {
	border-bottom:1px solid var(--color-gray);
	padding:1.5em 0 1.25em;
}
.post-list.column ul li:last-child {
	/* border-bottom:none; */
}
.post-list.column ul li article {
	--day-w:9.25ch;	/* 日付欄の横幅 */
	--cat-w:80px;	/* カテゴリー欄の横幅 */

	display:grid;
	grid-template-columns:var(--day-w) var(--cat-w) 1fr;
	align-items:start;
	justify-content:left;
	gap:0 1em;
	font-size:clamp(0.938rem, calc(0.779rem + 0.674vw), 1.125rem);/* viewport:375-820px  15-18px */
}
.post-list.column .date {
	color:var(--color-base-font);
	font-family:var(--roboto);
}
.post-list.column .cat {
	font-size:0.75em;
	line-height:1.4;
	height:auto;
}
.post-list.column .cat a {
	text-align:center;
	display:block;
	background:var(--color-sub);
	padding:0.375em 0.5em 0.25em;
}
.post-list.column .title {
	font-size:1rem;
	font-weight:var(--bold-font-weight);
	line-height:1.5;
}
@media only screen and (max-width:820px) {
	.post-list.column ul li article {
		display:flex;
		flex-wrap:wrap;
		gap:0.5em 1em;
	}
	.post-list.column .date {
		width:auto !important;
	}
	.post-list.column .title {
		width:100% !important;
	}
}
@media only screen and (max-width:468px) {
}

/* row */
.post-list.row ul {
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
	gap:30px;
	margin-bottom:50px;
}
.post-list.row li {
	padding:1em;
	border:1px solid;
}
.post-list.row li:only-child {
	max-width:380px;
}
.post-list.row li article {
	display:flex;
	flex-direction:column;
	align-items:start;
	gap:10px;
}
.post-list.row .thumbnail {
	border:1px solid;
	position:relative;
}
.post-list.row .thumbnail img {
	width:100%;
	display:block;
	object-fit:cover;
	aspect-ratio:3 / 2;
}
.post-list.row .thumbnail .new {
	color:#fff;
	font-size:small;
	background:var(--color-main);
	padding:2px 10px 0;
	position:absolute;
	top:10px;
	left:10px;
	z-index:10;
}
.post-list.row .date {
	width:100%;
}
.post-list.row .cat {
	font-size:0.8rem;
	width:fit-content;
	height:auto;
}
.post-list.row .cat a {
	text-align:center;
	display:block;
	background:var(--color-gray);
	padding:0.25em 0.65em 0.25em 0.5em;
}
.post-list.row .title {
	font-size:1rem;
	font-weight:var(--bold-font-weight);
	line-height:1.5;
}

@media only screen and (max-width:820px) {
}
@media only screen and (max-width:468px) {
}

/* =========================================================================================
Archive-Page
=========================================================================================*/
.archive-content section {
	padding-top:clamp(2.656rem, calc(0.418rem + 9.551vw), 5.313rem);/* viewport:375-820px 42.5-85px */
	padding-bottom:clamp(4.063rem, calc(8.862rem + -20.478vw), 7.813rem);/* viewport:375-820px 65-125px */
}
.archive-content .post-list {
	border-top:none;
	border-bottom:none;
	padding:0;
}

/* 投稿一覧 */
.archive-content .post-list.column ul li {
	padding-block:1.5em 2em;
	
	& :is(.title, .intro_article) { grid-column:span 3;}
	& .title {
		position:relative;
		margin-top:0.5em;
		font-size:clamp(1.125rem, calc(0.914rem + 0.899vw), 1.375rem);/* viewport:375-820px 18-22px */
	}
	& .title a {
		position:relative;
		padding-right:3em;

		@media(any-hover:hover){
			&:hover:after { translate:0% -50%;}
		}
		@media(any-hover:none){
			&:active:after { translate:0% -50%;}
		}
	}
	& .title a:after {
		content:"";
		position:absolute;
		display:block;
		width:1em;
		height:1em;
		background-color:var(--color-main);
		mask:url(images/common/arrow.svg) no-repeat center / contain;
		-webkit-mask:url(images/common/arrow.svg) no-repeat center / contain;
		inset:50% 0 auto auto;
		translate:-100% -50%;
		transition:all var(--trans);
	}

	& .intro_article {
		margin-top:1em;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		max-width:min(calc(100% - 5em), 60em);
		font-weight:var(--normal-font-weight);
	}
}
@media only screen and (max-width:820px){
	.archive-content .post-list.column ul li {

		& :is(.title, .intro_article) { margin-top:0;}
	}
}

/*pagination*/
.pagination {
	margin-block:50px;
}
.pagination .page-numbers {
	display:flex;
	justify-content:center;
	align-items:center;
	gap:10px;
}
.pagination .page-numbers li {
	margin:0;
}
.pagination .page-numbers li::before {
	display:none;
}
/* .pagination .page-numbers li:first-child {
	flex-grow:2;
} */
/* .pagination .page-numbers li:first-child span {
	float:right;
}
.pagination .page-numbers li:first-child a {
	float:none;
} */
/* .pagination .page-numbers li:last-child {
	flex-grow:2;
} */
/* .pagination .page-numbers li:last-child a {
	float:right;
} */
.pagination .page-numbers li a,
.pagination .page-numbers li span,
.pagination .page-numbers li .current {
	display:grid;
	place-items:center;
	width:40px;
	color:var(--color-main);
	font-weight:bold;
	line-height:1;
	aspect-ratio:1 / 1;
	background:color-mix(in sRGB, var(--color-main-light) 90%, var(--color-main) 10%);
	border-radius:5px;
}
.pagination .page-numbers li .current {
	color:#fff;
	background-color:var(--color-main);
}
.pagination .page-numbers li .prev,
.pagination .page-numbers li .next {
	background-color:#fff;
	border:solid 2px var(--color-main);
}
.pagination .page-numbers li .prev:before,
.pagination .page-numbers li .next:before {
	content:"";
	display:block;
	width:0.75em;
	aspect-ratio:1;
	background-color:currentColor;
	mask:url(images/common/arrow.svg) no-repeat center / contain;
	-webkit-mask:url(images/common/arrow.svg) no-repeat center / contain;
}
.pagination .page-numbers li .prev:before { rotate:180deg;}
.pagination .page-numbers li a:hover {
	text-decoration:none;
}
@media (any-hover:hover){
	.pagination .page-numbers li a:hover {
		background-color:var(--color-main);
		color:#fff;
	}
}
@media (any-hover:none){
	.pagination .page-numbers li a:active {
		background-color:var(--color-main);
		color:#fff;
	}
}

@media only screen and (max-width:820px) {
}
@media only screen and (max-width:468px) {
}

/* =========================================================================================
Single-Page
=========================================================================================*/
body.single .entry-header {
	position:relative;
}
body.single .entry-header .inner {
	align-items:center;
	padding-top:clamp(3.75rem, calc(0.59rem + 13.483vw), 7.5rem);/* viewport:375-820px 60-120px */
}
body.single .entry-header .date {
	display:inline-block;
	margin-bottom:0.5em;
	font-size:clamp(0.875rem, calc(0.664rem + 0.899vw), 1.125rem);/* viewport:375-820px 14-18px */
	text-align:left;
}
body.single .entry-header .icon {
	display:flex;
	align-items:start;
	justify-content:left;
	flex-wrap:wrap;
	gap:5px;
	padding:1em 0;
}
body.single .entry-header .icon a,
body.single .entry-header .icon span {
	font-size:0.8rem;
	text-align:center;
	height:auto;
	background:var(--color-gray);
	display:inline-block;
	padding:0.25em 1em 0.2em;
}
body.single .entry-header .icon a:hover {
	text-decoration:none;
}
body.single .entry-header .title {
	font-size:clamp(1.625rem, calc(1.151rem + 2.022vw), 2.188rem);/* viewport:375-820px 26-35px */
	color:var(--color-main);
	line-height:1.8;
}
body.single .entry-content section:nth-last-of-type(1) {
	padding-bottom:100px;
}
@media only screen and (max-width:820px) {
}
@media only screen and (max-width:468px) {
}

/*single-navi*/
body.single .single-navi {
	display:grid;
	grid-template:"prev list_link next" auto / auto 1fr auto;

	padding-top:clamp(1.875rem, calc(0.295rem + 6.742vw), 3.75rem);/* viewport:375-820px 30-60px */
	padding-bottom:clamp(6.25rem, calc(0.983rem + 22.472vw), 12.5rem);/* viewport:375-820px 100-200px */
	border-top:solid 1px var(--color-gray);
	font-size:clamp(1rem, calc(0.789rem + 0.899vw), 1.25rem);/* viewport:375-820px 16-20px */
	font-weight:bold;

	&:not(:has(.prev-navi)):before,
	&:not(:has(.next-navi)):after { content:""; display:block; width:6.75em;}
	
	& .prev-navi { grid-area:prev;}
	& .next-navi { grid-area:next;}
	& .post_list_link {
		grid-area:list_link;
		justify-self:center;
		padding:0.1em 2em;
		border:solid 2px var(--color-main);
		border-radius:5px;
		background-color:var(--color-main);
		color:#fff;
		text-align:center;
	}
	& :is(.prev-navi, .next-navi) a {
		display:flex;
		align-items:center;
		gap:0.75em;
		color:var(--color-main);
	}
	& :is(.prev-navi, .next-navi) span {
		position:relative;
		display:block;
		width:2em;
		aspect-ratio:1;
		border:solid 2px var(--color-main);
		border-radius:5px;
		background-color:#fff;
		transition:all var(--trans);
	}
	& :is(.prev-navi, .next-navi) span:before {
		content:"";
		position:absolute;
		display:block;
		width:0.5em;
		aspect-ratio:1;
		background-color:var(--color-main);
		mask:url(images/common/arrow.svg) no-repeat center / contain;
		-webkit-mask:url(images/common/arrow.svg) no-repeat center / contain;
		inset:50% auto auto 50%;
		translate:-50% -50%;
		transition:inherit;
	}
	& .prev-navi span:before {
		rotate:180deg;
	}
	
	@media (any-hover:hover) {
		& .post_list_link:hover {
			color:var(--color-main);
			background-color:#fff;
			text-decoration:none;
		}
		& :is(.prev-navi, .next-navi) a:hover span {
			background-color:var(--color-main);
		}
		& :is(.prev-navi, .next-navi) a:hover span:before {
			background-color:#fff;
		}
	}
	@media (any-hover:none) {
		& .post_list_link:active {
			color:var(--color-main);
			background-color:#fff;
		}
		& :is(.prev-navi, .next-navi) a:active span {
			background-color:var(--color-main);
		}
		& :is(.prev-navi, .next-navi) a:active span:before {
			background-color:#fff;
		}
	}
}

@media only screen and (max-width:820px) {
	body.single .single-navi .post_list_link {
		padding-inline:1.5em;
	}
}
@media only screen and (max-width:468px) {
	body.single .single-navi {
		grid-template:
			"prev next" auto
			"list_link list_link" 1fr / 1fr 1fr;
		gap:1em 2em;

		& .prev-navi { justify-self:end;}
		& .next-navi { justify-self:start;}
	}
}

/* =========================================================================================
  Editer
=========================================================================================*/
/*見出し全体*/
* + .mid-l,
* + .mid-m,
* + .mid-s {
	margin-top:1.5em;
}
/*見出し大*/
.mid-l {
	position:relative;
	display:flex;
	flex-direction:column;
	flex-wrap:wrap;
	align-items:center;
	justify-content:left;
	gap:0.15em 0.5em;
	margin-bottom:1em;
	font-size:clamp(1.188rem, calc(0.766rem + 1.798vw), 1.688rem);/* viewport:375-820px 19-27px */
	font-weight:var(--bold-font-weight);
	line-height:1.5;

	& .jp {
		display:flex;
		align-items:center;
		gap:0.1em;
	}
	& .jp:before {
		content:"";
		width:1em;
		height:auto;
		aspect-ratio:var(--logo-aspect);
		background-color:var(--color-main);
		clip-path:var(--logo-clip);
	}
	& .en {
		font-family:var(--kanit);
		font-size:clamp(3.75rem, calc(1.485rem + 9.663vw), 6.438rem);/* viewport:375-820px 60-103px */
		font-weight:700;
		font-style:italic;
		line-height:1;
	}
}

@media only screen and (max-width:820px) {
	.mid-l {
		font-size:clamp(1.625rem, calc(0.888rem + 3.146vw), 2.5rem); /* min:26px, max:40px */
	}
	.mid-l .jp {
		word-break:auto-phrase;
	}
	/* .mid-l .en {
		font-size:1rem;
	} */
}
@media only screen and (max-width:468px) {
	.mid-l {
		text-align:center;
		flex-direction:column;
	}
}
/*見出し中*/
.mid-m {
	font-size:clamp(1.75rem, calc(1.645rem + 0.449vw), 1.875rem);/* viewport:375-820px 28-30px */
	font-weight:var(--bold-font-weight);
	line-height:1.6;
	margin-bottom:0.5em;

	& .en {
		font-size:0.5em;
		font-family:var(--kanit);
		font-weight:var(--normal-font-weight);
		color:var(--color-main);
	}
}
@media only screen and (max-width:820px) {
}
@media only screen and (max-width:468px) {
}
/*見出し小*/
.mid-s {
	font-size:1.25rem;
	font-weight:var(--bold-font-weight);
	display:grid;
	grid-template-columns:auto 1fr;
	align-items:start;
	gap:0.25em;
	margin-bottom:0.5em;
}
.mid-s::before {
	content:"";
	width:0.75em;
	aspect-ratio:1 / 1;
	display:block;
	background-color:var(--color-base-font);
	margin-top:0.15em;
}
@media only screen and (max-width:820px) {
}
@media only screen and (max-width:468px) {
}

/*heading*/
* + .wp-block-heading {
	margin-top:1.5em;
}
.wp-block-heading {
	font-weight:var(--bold-font-weight);
	line-height:1.4;
	margin-bottom:0.75em;
}
h1.wp-block-heading {
	font-size:2em;
}
h2.wp-block-heading {
	font-size:1.75em;
}
h3.wp-block-heading {
	padding:0.25em 0.75em;
	background-color:var(--color-main-light);
	border-left:solid 0.25em var(--color-main);
	font-size:1.2222em;
}
h4.wp-block-heading {
	font-size:1.1111em;
	font-weight:var(--normal-font-weight);
	color:var(--color-main);
}
h5.wp-block-heading {
	font-size:1em;
}
h6.wp-block-heading {
	font-size:0.85em;
}

/*Hr*/
hr,
.wp-block-separator {
	width:100%;
	max-width:500px;
	height:1px;
	border:none;
	background-color:var(--color-base-font);
	margin:10vh auto;
}
.wp-block-separator.is-style-dots:before {
	font-size:3em;
	letter-spacing:1em;
	padding-left:1em;
}
@media only screen and (max-width:820px) {
	hr,
	.wp-block-separator {
		width:50%;
	}
}

/*Table*/
.wp-block-table table,
.entry-content table {
	width:100%;
}
.wp-element-caption,
.entry-content .caption,
.wp-block-flexible-table-block-table figcaption {
	color:var(--color-base-font);
	opacity:0.7;
	padding:0.5em 0;
}
.wp-block-table thead th {
	border-bottom:none;
}
.wp-block-table th,
.wp-block-table td,
.entry-content th,
.entry-content td {
	text-align:left;
	vertical-align:top;
	border:none;
	position:relative;
}
.wp-block-table th,
.entry-content th {
	padding-block:0.5em;
	border-bottom:1px solid var(--color-gray);
}
.wp-block-table td,
.entry-content td {
	padding-block:0.75em;
	border-bottom:1px solid var(--color-gray);
}
.wp-block-table th,
.wp-block-table td strong,
.entry-content th {
	color:var(--color-base-font);
}
.wp-block-table.is-style-stripes .wp-element-caption {
	border-top:2px solid;
}
@media only screen and (max-width:820px) {
	.wp-block-table table {
		min-width:650px;
		overflow-x:auto;
	}
}
/*Flexible-Table*/
.wp-block-flexible-table-block-table figcaption {
	color:var(--color-base-font);
	opacity:0.7;
	padding:0.5em 0;
}
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table > table tr th,
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table > table tr td {
	padding-block:1.9em;
	padding-inline:0 1em;
	border-top:none;
	border-left:none;
	border-right:none;
}
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table > table tr th {
	background-color:transparent;
	color:var(--color-main);
	vertical-align:baseline;
}

/*List*/
ul.wp-block-list,
ol.wp-block-list,
ul.list,
ol.list {
	margin:0.5em 0 0.5em 1.5em;
}
ul.wp-block-list li,
ol.wp-block-list li,
ul.list li,
ol.list li {
	position:relative;
}
ul.wp-block-list li + li,
ol.wp-block-list li + li,
ul.list li + li,
ol.list li + li {
	margin-top:0.25em;
}
ul.wp-block-list li::before,
ul.list li::before {
	position:absolute;
	content:"";
	background:var(--color-main);
	width:5px;
	aspect-ratio:1 / 1;
	border-radius:50%;
	top:0.8em;
	left:-0.9em;
}
ol:is(.wp-block-list, .list) {
	list-style-type:decimal-leading-zero;
}
ol:is(.wp-block-list, .list) ol:is(.wp-block-list, .list) {
	list-style-type:none;
	counter-reset:inner-ol;
}
ol:is(.wp-block-list, .list) ol:is(.wp-block-list, .list) li:before {
	counter-increment:inner-ol;
	content:"（" counter(inner-ol) "）";
	position:absolute;
	inset:0 100% auto auto;
}


/*List - note*/
ul.note {
	list-style:none;
}
ul.note.center {
	width:fit-content;
	margin:auto;
}
ul.note li {
	padding-left:0.25em;
}
ul.note li:before {
	content:"※";
	margin-right:0.5em;
	background:none;
	top:0.2em;
	left:-1em;
}

/*blockquote*/
blockquote {
	position:relative;
	padding:3em 2em;
	background:#f5f5f5;
}
blockquote cite {
	display:block;
	font-size:0.8rem;
	text-align:right;
	color:#808080;
	padding-right:20px;
}

/*wp-block-media-text*/
@media only screen and (max-width:600px) {
	.wp-block-media-text .wp-block-media-text__content {
		margin:0;
		padding:1em 0;
	}
}

/*image*/
.wp-block-image {
	margin-bottom:1em;
}

/* =========================================================================================
FORM
=========================================================================================*/
.grecaptcha-badge {
	/*visibility:hidden;*/
} /*reCAPTCHAバッジ（ロゴマーク）を消す ※設定がうまくいったことを確認してからこのCSSを有効化すること*/

.wpcf7 {
	padding:clamp(1.25rem, calc(0.197rem + 4.494vw), 2.5rem);/* viewport:375-820px 20-40px */
	background-color:var(--color-main-light);
}
/* 住所自動入力時の「ハイフンなしで入力！」を非表示 */
#autozip {
	display:none!important;
}
.entry-content form {
	margin:0 auto;
	padding-top:clamp(1.25rem, calc(0.197rem + 4.494vw), 2.5rem);/* viewport:375-820px 20-40px */
	padding-inline:clamp(1.25rem, calc(-0.857rem + 8.989vw), 3.75rem);/* viewport:375-820px 20-60px */
	padding-bottom:clamp(1.563rem, calc(0.246rem + 5.618vw), 3.125rem);/* viewport:375-820px 25-50px */
	background-color:#fff;
	box-sizing:border-box;
	position:relative;
}
.entry-content form ::placeholder {
	color:color-mix(in sRGB, var(--color-main), var(--color-main-light));
	font-weight:bold;
}
.entry-content form .wpcf7-not-valid-tip { text-wrap:nowrap; color:var(--color-attention);}
.entry-content form input[type="text"],
.entry-content form input[type="tel"],
.entry-content form input[type="email"],
.entry-content form input[type="number"],
.entry-content form textarea,
.entry-content form select {
	width:100%;
	background:#fff;
	border:1px solid #000;
	padding:0.75em 1em;
	border-radius:10px;
	transition:0.3s;
	font-weight:var(--normal-font-weight);
}

/* スピンボタン非表示 */
.entry-content form .no_spin input[type="number"] {
	-moz-appearance:textfield!important;

	&::-webkit-inner-spin-button,
	&::-webkit-outer-spin-button {
		appearance:none!important;
		-webkit-appearance:none!important;
	}
}
.entry-content form .wpcf7-form-control-wrap ~ .wpcf7-form-control-wrap {
	display:block;
	margin-top:20px;
}

/* Cloudeflare Trunstile */
.entry-content form .wpcf7-turnstile.cf-turnstile {
	width:fit-content;
	margin:clamp(2rem, calc(1.157rem + 3.596vw), 3rem) auto 0;/* viewport:375-820px 32-48px */
}
@media only screen and (max-width:468px) {
	.entry-content form .wpcf7-turnstile.cf-turnstile {
		margin-left:50%;
		translate:-50% 0;
	}
}

/* focus */
.entry-content form input:focus,
.entry-content form textarea:focus {
	border-color:var(--color-main);
	background-color:var(--color-main-light);
}
.entry-content form input.wpcf7-not-valid,
.entry-content form textarea.wpcf7-not-valid {
	border-color:var(--color-attention);
	background-color:color-mix(in sRGB, var(--color-attention) 10%, #fff 90%);
}
.entry-content form .wpcf7-acceptance .wpcf7-list-item {
	margin:0;
}
.entry-content form .wpcf7-radio {
	/*ラジオボタンの位置調整*/
	margin-top:1em;
	display:block;
}
.entry-content form .wpcf7-radio .wpcf7-list-item.first {
	/*ラジオボタンの一番最初のmargin調整*/
	margin:0;
}
.entry-content form select {
	width:fit-content;
	min-width:300px;
	padding-right:4em;
	background:#fff url(images/common/icon_dropdown.svg) no-repeat;
	background-position:right 1em center;
	background-size:1em;
}
.entry-content form .post-add input {
	max-width:150px;
}
.entry-content form .select-pref select {
	min-width:100px;
}
.entry-content form p:has(> input[type="submit"]) {
	position:relative;
	display:flex;
	flex-direction:column;
	align-items:center;
	width:fit-content;
	margin:2.5em auto 0;
	color:var(--color-main);

	&:after {
		content:"";
		position:absolute;
		inset:auto 6px 6px auto;
		display:block;
		background-color:currentColor;
		width:1em;
		aspect-ratio:var(--logo-aspect);
		clip-path:var(--logo-clip-reverse);
	}
	& .wpcf7-spinner { display:none;}
}
.entry-content form input[type="submit"] {
	padding:0.75em 1.5em;
	min-width:200px;
	color:currentColor;
	font-weight:var(--bold-font-weight);
	line-height:1.4;
	letter-spacing:0.25em;
	text-indent:0.25em;
	border:solid 2px currentColor;
	border-radius:100vmax 100vmax 0 100vmax;
	background:transparent;
	transition:0.3s;

	& ~ br { display:none;}
}
@media (any-hover:hover){
	.entry-content form p:has(> input[type="submit"]:hover) {
		color:#fff;
	}
	.entry-content form input[type="submit"]:hover {
		background-color:var(--color-main);
	}
}
@media (any-hover:none){
	.entry-content form p:has(> input[type="submit"]:active) {
		color:#fff;
	}
	.entry-content form input[type="submit"]:active {
		background-color:var(--color-main);
	}
}
/* .entry-content form input[type="submit"]:hover,
.entry-content form input[type="button"]:hover {
	opacity:0.8;
} */

.entry-content form .btn-area {
	margin-top:2.5em;
}
.entry-content form .btn-area p {
	text-align:center;
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	justify-content:center;
	gap:30px;
	position:relative;
	width:100%;
}
.entry-content form .btn-area p br {
	display:none;
}
.entry-content form .btn-area .wpcf7-spinner {
	position:absolute;
	right:-80px;
	top:30%;
}
@media only screen and (max-width:820px) {
	.entry-content form .btn-area {
		display:flex;
		flex-wrap:wrap;
		align-items:center;
		justify-content:center;
		width:100%;
		max-width:800px;
	}
	.entry-content form .btn-area p {
		position:relative;
	}
	.entry-content form .btn-area .wpcf7-spinner {
		position:absolute;
		right:-80px;
		top:30%;
	}
}
@media only screen and (max-width:468px) {
	.entry-content form input[type="submit"],
	.entry-content form input[type="button"] {
		width:100%;
		min-width:100%;
	}
}

/*問い合わせ画面*/
.entry-content .contact-bg {
	padding-block:50px 0;
	margin:0;
}
.entry-content .contact-bg .privacy {
	text-align:center;
	margin-bottom:2em;
}
.entry-content .contact-bg .privacy .wpcf7-list-item {
	margin:0;
}
.entry-content .contact-bg .privacy a {
	text-decoration:underline;
}
.entry-content .contact-bg .center {
	text-align:center;
	margin-top:3em;
}
.entry-content form dl {
	width:100%;
	display:grid;
	grid-template-columns:260px 1fr;
	align-items:center;
	margin:0 auto;
}
.entry-content form :where(dt, dd) {
	padding-block:30px;
	border-top:solid 1px var(--color-gray);
}
.entry-content form :where(dt, dd):first-of-type {
	padding-top:0;
	border-top:none;
}
.entry-content form :where(dt, dd):last-of-type {
	padding-bottom:0;
}
.entry-content form dt {
	position:relative;
	font-weight:var(--normal-font-weight);
	text-align:left;
	line-height:1.6;
}
.entry-content form dt label {
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	justify-content:space-between;
	padding-top:0.875em;
}
.entry-content form dt span {
	display:block;
	position:absolute;
	inset:50% 0 auto auto;
	translate:0 -50%;
	padding-inline:0.75em;
	color:var(--color-main);
	font-size:0.7em;
	font-weight:bold;
	border:solid 1px currentColor;
	background-color:#fff;
}
.entry-content form dt span.required {
	color:#fff;
	background-color:var(--color-main);
}
.entry-content form dd {
	padding-left:40px;
}
.entry-content form dd p {
	display:block;
	color:var(--color-gray);
	font-size:0.85em;
	font-weight:bold;
}
.entry-content form small {
	display:block;
	line-height:1.7;
}

/* table */
.entry-content form table {
	border-collapse:collapse;

	& tr { border-bottom:solid 1px var(--color-gray);}
	& :where(th, td) {
		padding:clamp(0.938rem, calc(0.147rem + 3.371vw), 1.875rem) 0;/* viewport:375-820px 15-30px */
		border:none;
	}
	& tr:first-of-type :where(th, td) { padding-top:0;}
	& th { vertical-align:middle;}
	& th p { display:flex; flex-wrap:wrap; align-items:center;}
	& th span {
		display:block;
		width:fit-content;
		margin-inline:auto 0;
		padding-inline:0.75em;
		color:var(--color-main);
		font-size:0.7em;
		font-weight:bold;
		border:solid 1px currentColor;
		background-color:#fff;
	}
	& th span.required {
		color:#fff;
		background-color:var(--color-main);
	}
	& td { padding-left:40px;}
	& td p {
		font-size:0.85em;
		color:color-mix(in sRGB, var(--color-gray), var(--color-base-font));
		font-weight:bold;
	}
	& td p:has(#zip) { color:var(--color-main);}
	& td .wpcf7-form-control-wrap:has(#zip) { display:inline-block; width:14ch;	margin-left:0.5em;}
}
.entry-content form .birthday {
	& .birthday_wrap {
		--gap:1em;
		display:flex;
		flex-wrap:wrap;
		align-items:center;
		gap:var(--gap);
	}
	& :where(.year, .month, .day) p { display:flex; align-items:center; column-gap:calc(var(--gap) * 0.5);}
	& .year input[type="number"] { width:10ch;}
	& .month input[type="number"] { width:8ch;}
	& .day input[type="number"] { width:8ch;}
	& .wpcf7-not-valid-tip { display:none;}
	& .custom-valid-tip { display:none;}
	&:has(*.wpcf7-not-valid-tip) .custom-valid-tip { display:block; color:var(--color-attention); font-weight:400;}
}
.entry-content form .agree_box {
	padding-top:clamp(1.25rem, calc(-0.593rem + 7.865vw), 3.438rem);/* viewport:375-820px 20-55px */

	& .agree_box_wrap {
		width:min(800px, 100%);
		margin-inline:auto;
		padding:45px 100px;
		background-color:var(--color-main-light);

		& > p { margin-top:1.5555em;}
		& > p:has(.wpcf7-acceptance) {
			width:fit-content;
			margin-top:2.4444em;
			margin-inline:auto;
			padding:0.25em 1em;
			background-color:#fff;
		}
	}
	& .cap { font-size:1.1111em; font-weight:bold;}
	& a { text-decoration:underline;}
}


@media only screen and (max-width:820px) {
	.entry-content form .birthday {
		& .birthday_wrap { --gap:0.75em;}
	}
	.entry-content form table {
		& :is(th, td) { display:block; width:100%;}
		& td { padding-top:0; padding-inline:0;}
	}
	.entry-content form .agree_box .agree_box_wrap {
		padding-block:clamp(1.25rem, calc(-0.067rem + 5.618vw), 2.813rem);/* viewport:375-820px 20-45px */
		padding-inline:clamp(1.25rem, calc(-0.33rem + 6.742vw), 3.125rem);/* viewport:375-820px 20-50px */
	}
	.entry-content .contact-bg {
		padding:20px 0;
	}
	.entry-content form dl {
		display:flex;
		flex-wrap:wrap;
		gap:20px;
	}
	.entry-content form dt {
		text-align:left;
		width:100%;
	}
	.entry-content form dt label {
		justify-content:left;
	}
	.entry-content form dt span {
		font-size:0.8rem;
		padding:0.15em 0.2em 0.2em;
		margin-left:0.75em;
	}
	.entry-content form dd {
		width:100%;
		margin-bottom:1em;
	}
}
@media only screen and (max-width:468px) {
	.entry-content .contact-bg {
		padding:0;
	}
}

/*入力確認画面*/
.entry-content .confirm-bg {
	width:100%;
	max-width:680px;
	padding:0;
	margin:0 auto;
}
.entry-content .confirm-bg .center {
	text-align:center;
	margin-top:3em;
}
.entry-content form .confirm-bg dl {
	width:100%;
	display:grid;
	grid-template-columns:200px 1fr;
	gap:0;
	padding-bottom:40px;
}
.entry-content form .confirm-bg dt,
.entry-content form .confirm-bg dd {
	font-weight:var(--normal-font-weight);
	text-align:left;
	line-height:1.6;
	border-bottom:1px solid var(--color-gray);
	padding:1em;
	margin:0;
}
.entry-content form .confirm-bg dt {
	font-weight:var(--bold-font-weight);
}

@media only screen and (max-width:820px) {
	.entry-content form .confirm-bg dl {
		display:flex;
		flex-wrap:wrap;
	}
	.entry-content form .confirm-bg dt {
		border-bottom:none;
		padding-bottom:0;
	}
}
@media only screen and (max-width:468px) {
}

/*送信完了画面*/
body.contact-completion .entry-content .inner {
	max-width:var(--small-contents-width);
}
@media only screen and (max-width:820px) {
}
@media only screen and (max-width:468px) {
}

/* =========================================================================================
Parts (TEL)
=========================================================================================*/
.parts-tel {
	background:#fafafa;
	padding:2.5em 1.5em;
	margin:50px 0;
}
.parts-tel .inner {
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:1.5em;
}
.parts-tel .tel-number {
	padding-left:4.5em;
	background:url(images/common/icon_tel.svg) no-repeat left;
	background-size:60px;
	min-height:60px;
}
.parts-tel .tel-number {
	font-size:0.9rem;
}
.parts-tel .tel-number strong {
	color:#000;
	font-size:2em;
	padding-left:0.2em;
	display:block;
	line-height:1.2;
}
@media only screen and (max-width:820px) {
}
@media only screen and (max-width:468px) {
}

/* =========================================================================================
Parts (parts/parts-contact.php)
=========================================================================================*/
.parts-contact {
	background:var(--color-main);
	padding-block:180px 165px;
	margin:0;
	color:#fff;

	& .mid-l .jp:before { background-color:var(--color-sub);}
	& a {
		color:inherit;

		@media (any-hover:hover) {
			&:hover { color:var(--color-sub);}
		}
		@media (any-hover:none) {
			&:active { color:var(--color-sub);}
		}
	}
	& .sub_text { text-align:center; font-size:1.125em; font-weight:bold;}
	& .contact_wrap {
		display:grid;
		grid-template-columns:repeat(2, 1fr);
		align-items:center;
		margin-top:clamp(2.5rem, calc(0.393rem + 8.989vw), 5rem);/* viewport:375-820px 40-80px */

		& .parts_contact_tel { margin:0; padding:0; background-color:transparent;}
		& .parts_contact_tel strong { color:inherit;}
	}
	& ul {
		display:grid;
		grid-template-rows:repeat(3, 1fr);
		border-left:solid 1px;
		height:100%;
	}
	& ul li + li { border-top:solid 1px;}
	& ul a {
		display:block;
		position:relative;
		padding:1.5455em 1.6818em;/* 34px 37px */
		font-size:clamp(0.938rem, calc(0.569rem + 1.573vw), 1.375rem);/* viewport:375-820px  15-22px */
		font-weight:400;
		transition:all var(--trans);

		&:before,
		&:after {
			content:"";
			display:block;
			position:absolute;
			translate:0 -50%;
			width:3em;
			aspect-ratio:1;
			border-radius:0.2273em;
			inset:50% 0 auto auto;
			transition:inherit;
		}
		&:before { background-color:rgb(255 255 255 / 0.2);}
		&:after {
			background-color:#fff;
			mask:url(images/common/arrow_white.svg) no-repeat center / 0.5em auto;
			-webkit-mask:url(images/common/arrow_white.svg) no-repeat center / 0.5em auto;
		}

		@media (any-hover:hover) {
			&:hover { color:var(--color-sub);}
			&:hover:before { background:var(--color-sub);}
			&:hover:after { background-color:var(--color-main);}
		}
		@media (any-hover:none) {
			&:active { color:var(--color-sub);}
			&:active:before { background:var(--color-sub);}
			&:active:after { background-color:var(--color-main);}
		}
	}
}
body.page .parts-contact {
	padding-block:clamp(5rem, calc(0.523rem + 19.101vw), 10.313rem);/* viewport:375-820px 80-165px */
}
body.page .parts-contact:after {
	content:"";
	position:absolute;
	display:block;
	width:clamp(8rem, calc(1.258rem + 28.764vw), 16rem);/* viewport:375-820px 128-256px */
	aspect-ratio:256/109;
	background:image-set(
		url(images/common/nalsok@2x.webp) 2x type("image/webp"), 
		url(images/common/nalsok.webp) 1x type("image/webp"), 
		url(images/common/nalsok@2x.png) 2x, 
		url(images/common/nalsok.png) 1x
	) no-repeat center / contain;
	inset:auto calc((100% - var(--large-contents-width)) / 2) calc(100% - 1.5rem) auto;
}

@media only screen and (max-width:1000px) {
	.parts-contact {
		padding-block:81.5px 54px;

		& .contact_wrap { display:block;}
		& ul { margin-top:30px; border-left:none;}
		& ul li { border-top:solid 1px;}
		& ul a { padding-inline-start:0.5em;}
	}
}
@media only screen and (max-width:820px) {
}
@media only screen and (max-width:468px) {

}


/* =========================================================================================
Parts (template/parts-contact-tel.php)
=========================================================================================*/
.parts_contact_tel {
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:0.75em;
	margin-block:1rem;
	padding-block:clamp(1.813rem, calc(0.285rem + 6.517vw), 3.625rem);/* viewport:375-820px 29-58px */
	background-color:var(--color-main-light);

	& strong {
		color:var(--color-main);
		font-size:clamp(1.25rem, calc(0.829rem + 1.798vw), 1.75rem);/* viewport:375-820px  20-28px */
		font-weight:900;
	}
	& a[href^="tel"] {
		display:flex;
		gap:0.2em;
		font-family:var(--roboto);
		font-size:clamp(2.5rem, calc(1.71rem + 3.371vw), 3.438rem);/* viewport:375-820px 40-55px */
		font-weight:900;
		line-height:1.3;
	}
	& a[href^="tel"]:before {
		content:"";
		display:block;
		width:0.6em;
		height:1lh;
		background-color:currentColor;
		mask:url(images/common/icon_tel.svg) no-repeat center / contain;
		-webkit-mask:url(images/common/icon_tel.svg) no-repeat center / contain;
	}
	& p:nth-of-type(1) {
		font-size:clamp(0.875rem, calc(0.77rem + 0.449vw), 1rem);/* viewport:375-820px 14-16px */
		font-weight:bold;
	}
	& p:nth-of-type(2) {
		margin-top:clamp(0.875rem, calc(-0.284rem + 4.944vw), 2.25rem);/* viewport:375-820px 14-36px */
		font-size:clamp(0.75rem, calc(0.539rem + 0.899vw), 1rem);/* viewport:375-820px 12-16px */
	}
}


/* =========================================================================================
Parts (template/parts-contact-links.php)
=========================================================================================*/
.parts_contact_links {
	display:grid;
	grid-template-columns:repeat(2, 1fr);
	gap:0 2.75rem;
	margin-block:1em;

	& a {
		position:relative;
		padding-block:1.25em;
		padding-inline:0 3em;
		font-size:clamp(1.031rem, calc(0.742rem + 1.236vw), 1.375rem);/* viewport:375-820px 16.5-22px */
		border-block:solid 1px;
	}
	& a:before,
	& a:after {
		content:"";
		display:block;
		position:absolute;
		inset:50% 0 auto auto;
		translate:0 -50%;
		width:3em;
		aspect-ratio:1;
		border-radius:0.2273em;
		transition:inherit;
	}
	& a:before {
		background-color:var(--color-main);
	}
	& a:after {
		background-color:#fff;
		mask:url(images/common/arrow_white.svg) no-repeat center / 0.5em auto;
		-webkit-mask:url(images/common/arrow_white.svg) no-repeat center / 0.5em auto;
	}
	@media (any-hover:hover) {
		& a:hover:after { background-color:var(--color-sub);}
	}
	@media (any-hober:none) {
		& a:active:after { background-color:var(--color-sub);}
	}
}
@media (max-width:820px){
	.parts_contact_links {
		grid-template-columns:1fr;

		& a + a { border-top:none;}
	}
}