/*////////////////////////////////////////////////////////////////////////////*/

/*! base.css */

/*////////////////////////////////////////////////////////////////////////////*/


/*------------------------------------------------------------------------------

	変数

------------------------------------------------------------------------------*/

:root {

	/*--------------------------------------------------
		書式設定
	--------------------------------------------------*/
	/*
		font-size: 480px			- 720px - 1023px		 - 1440px - 1900px
		--------------------------------------------------------------------------------
		h1		 24px(1.5rem)	 -	   - 48px(3rem)	 -		-
		h2		 20px(1.25rem)	-	   - 36px(2.25rem)  -		-
		h3		 18px(1.125rem)   -	   - 30px(1.875rem) -		-
		h4		 16px(1rem)	   -	   - 24px(1.5rem)   -		-
		本文		15px(.9375rem)   -	   - 20px(1.25rem)  -		-
		s1		 12px(.75rem)	 -	   - 16px(1rem)	 -		-
		s2		 10px(.625rem)	-	   - 14px(1.875rem) -		-
	*/

	/* 基本文字サイズ：https://min-max-calculator.9elements.com/ */
	font-size: 16px;
	/**/
	--font-size: clamp(0.9375rem, 0.662rem + 0.92vw, 1.25rem);/* 480px:15px to 1023px:20px */
	--font-size-s1: clamp(0.75rem, 0.529rem + 0.74vw, 1rem);/* 480px:12px to 1023px:16px */
	--font-size-s2: clamp(0.625rem, 0.404rem + 0.74vw, 0.875rem);/* 480px:10px to 1023px:14px */
	/**/
	--font-size-h1: clamp(1.5rem, 0.174rem + 4.42vw, 3rem);/* 480px:24px to 1023px:48px */
	--font-size-h1: clamp(1.75rem, 0.645rem + 3.68vw, 3rem);/* 480px:28px to 1023px:48px */
	--font-size-h2: clamp(1.25rem, 0.366rem + 2.95vw, 2.25rem);/* 480px:20px to 1023px:36px */
	--font-size-h3: clamp(1.125rem, 0.462rem + 2.21vw, 1.875rem);/* 480px:18px to 1023px:30px */
	--font-size-h4: clamp(1rem, 0.558rem + 1.47vw, 1.5rem);/* 480px:16px to 1023px:24px */

	/* フォント */
	/* 2022年に最適なfont-familyの書き方：https://ics.media/entry/200317/ */
	/* 簡体字-中国語WEBサイトに最適なfont-familyとは？：https://spoke.cloud/ja/chinese-simplified-font-family/ */
	--font-sans: 'Local Noto Sans JP','Noto Sans JP','Helvetica Neue',Arial,'Hiragino Kaku Gothic ProN','Hiragino Sans','BIZ UDPGothic',Meiryo,sans-serif;
	--font-serif: 'Noto Serif JP','Yu Mincho',YuMincho,'Hiragino Mincho ProN',serif;
	--font-serif-h: YakuHanMP,'Noto Serif JP','Yu Mincho',YuMincho,'Hiragino Mincho ProN',serif;
	--font-mono: 'Source Han Code JP','Source Code Pro',sfmono-regular,menlo,consolas,'Bitstream Vera Sans Mono','Courier New',courier,'BIZ UDGothic',メイリオ,meiryo,monospace;
	--font-en-sans: 'Noto Sans Display','Helvetica Neue',Arial,sans-serif;
	--font-en-serif: 'Noto Serif Display','Times New Roman',Times,serif;
	--font-zh-sans: Arial,sans-serif;

	/* ウェイト */
	--font-weight: normal;
	--font-weight-m: 700;
	--font-weight-b: bolder;

	/* 行送り */
	--line-height-h: 1.5;
	--line-height-p: 2;
	--line-height-table: 1.5;

	/* 字間 */
	--letter-spacing-h: 0;
	--letter-spacing-p: 0;

	/* 文字詰め */
	--font-feature-settings-h: 'palt';
	--font-feature-settings-p: '';/* 現状ノーマルが無難 */

	/*--------------------------------------------------
		色設定
	--------------------------------------------------*/

	/* 文字色 */
	--color-text-h-rgb: 42 48 52;/* 見出し文字 */
	--color-text-p-rgb: 92 96 108;/* 本文文字 */
	--color-text-link-rgb: var(--color-izumi-blue-rgb);/* リンク */
	--color-text-visited-rgb: 224 128 0;/* 訪問済みリンク */
	--color-text-selection-rgb: 17 17 17;/* 選択時文字 */
	--color-text-code-rgb: 240 240 240;/* 引用・コード文字 */

	/* 背景色 */
	--color-bg-body-rgb: 255 255 255;/* body背景 */
	--color-bg-strong-rgb: 255 249 153;/* 強調文字背景 */
	--color-bg-selection-rgb: 255 216 0;/* 選択時背景 */
	--color-bg-code-rgb: 240 240 240;/* 引用・コード背景 */

	/* キーワード色 */
	--color-primary-rgb: 217 188 112;/* #1DA1F2 */
	--color-secondary-rgb: 20 23 26;/* #14171A */

	/* 外部系 */
	--color-x-rgb: 0 0 0;
	--color-line-rgb: 6 199 85;

	/* 案件 */
	/* コントラスト比：https://dequeuniversity.com/rules/axe/4.8/color-contrast */
	--color-alert-rgb: 238 0 0;
	--color-izumi-blue: rgb(var(--color-izumi-blue-rgb));
	--color-izumi-blue-rgb: 56 117 219;
	--color-izumi-darkblue-rgb: 36 68 118;
	--color-izumi-yellow: rgb(var(--color-izumi-yellow-rgb));
	--color-izumi-yellow-rgb: 255 230 0;

	/*--------------------------------------------------
		スペース
	--------------------------------------------------*/

	--space_0125: .125rem;
	--space_025: .25rem;
	--space_05: .5rem;
	--space_1:  1rem;
	--space_1h: 1.5rem;
	--space_2:  2rem;
	--space_3:  3rem;
	--space_4:  4rem;
	--space_6:  6rem;
	--space_9:  9rem;

	--space_1h_1: clamp(1rem, 0.831rem + 0.56vw, 1.5rem);/* 480px to 1900px */
	--space_2_1:  clamp(1rem, 0.662rem + 1.13vw, 2rem);
	--space_2_1h: clamp(1.5rem, 1.331rem + 0.56vw, 2rem);
	--space_3_1:  clamp(1rem, 0.324rem + 2.25vw, 3rem);
	--space_3_1h: clamp(1.5rem, 0.993rem + 1.69vw, 3rem);
	--space_3_2:  clamp(2rem, 1.662rem + 1.13vw, 3rem);
	--space_4_1:  clamp(1rem, -0.014rem + 3.38vw, 4rem);
	--space_4_1h: clamp(1.5rem, 0.655rem + 2.82vw, 4rem);
	--space_4_2:  clamp(2rem, 1.324rem + 2.25vw, 4rem);
	--space_4_3:  clamp(3rem, 2.662rem + 1.13vw, 4rem);
	--space_6_1:  clamp(1rem, -0.69rem + 5.63vw, 6rem);
	--space_6_1h: clamp(1.5rem, -0.021rem + 5.07vw, 6rem);
	--space_6_2:  clamp(2rem, 0.648rem + 4.51vw, 6rem);
	--space_6_3:  clamp(3rem, 1.986rem + 3.38vw, 6rem);
	--space_6_4:  clamp(4rem, 3.324rem + 2.25vw, 6rem);
	--space_9_1:  clamp(1rem, -1.704rem + 9.01vw, 9rem);
	--space_9_1h: clamp(1.5rem, -1.035rem + 8.45vw, 9rem);
	--space_9_2:  clamp(2rem, -0.366rem + 7.89vw, 9rem);
	--space_9_3:  clamp(3rem, 0.972rem + 6.76vw, 9rem);
	--space_9_4:  clamp(4rem, 2.31rem + 5.63vw, 9rem);
	--space_9_6:  clamp(6rem, 4.986rem + 3.38vw, 9rem);

	/* 共用マージン */
	/* 文字サイズ依存 */
	--margin-line: calc(var(--line-height, var(--line-height-p)) * 1em);/* 1行の高さ */
	--margin-line-1: var(--margin-line);/* 1行の高さ */
	--margin-line-2: calc(var(--line-height, var(--line-height-p)) * 2 * 1em);/* 2行の高さ */
	--margin-line-h: calc(var(--line-height, var(--line-height-p)) / 2 * 1em);/* 1/2行の高さ */
	--margin-line-q: calc(var(--line-height, var(--line-height-p)) / 4 * 1em);/* 1/4行の高さ */
	/* 文字サイズ固定 */
	--margin-line-rem: calc(var(--line-height, var(--line-height-p)) * var(--font-size));/* 1行の高さ */
	--margin-line-rem-1: var(--margin-line-rem);/* 1行の高さ */
	--margin-line-rem-2: calc(var(--line-height, var(--line-height-p)) * 2 * var(--font-size));/* 2行の高さ */
	--margin-line-rem-h: calc(var(--line-height, var(--line-height-p)) / 2 * var(--font-size));/* 1/2行の高さ */
	--margin-line-rem-q: calc(var(--line-height, var(--line-height-p)) / 4 * var(--font-size));/* 1/4行の高さ */

	/* セクションブロック */
	--section-padding-y: var(--space_9_4);
	--section-padding-x: var(--space_9_1h);
	--section-content-gap: var(--space_6_4);

	/*--------------------------------------------------
		その他
	--------------------------------------------------*/

	/* SVG */
	--svg-i: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20d%3D%22M16%2C0C7.163%2C0%2C0%2C7.163%2C0%2C16c0%2C8.837%2C7.163%2C15.999%2C16%2C16%2C8.837%2C0%2C15.999-7.163%2C16-16C31.999%2C7.163%2C24.837%2C0%2C16%2C0ZM17.5%2C24.5c0%2C.828-.672%2C1.5-1.5%2C1.5s-1.5-.672-1.5-1.5v-10c0-.828.672-1.5%2C1.5-1.5s1.5.672%2C1.5%2C1.5v10ZM16%2C10c-1.105%2C0-2-.895-2-2s.895-2%2C2-2%2C2%2C.895%2C2%2C2-.895%2C2-2%2C2Z%22%2F%3E%3C%2Fsvg%3E");
	--svg-external: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20d%3D%22M29.707%2C2.293c-.186-.186-.444-.293-.707-.293h-8.75c-.552%2C0-1%2C.448-1%2C1s.448%2C1%2C1%2C1h0s6.336%2C0%2C6.336%2C0l-12.293%2C12.293c-.391.391-.391%2C1.024%2C0%2C1.414.391.391%2C1.024.391%2C1.414%2C0l12.293-12.293v6.336c0%2C.552.448%2C1%2C1%2C1s1-.448%2C1-1V3c0-.263-.107-.521-.293-.707Z%22%2F%3E%3Cpath%20d%3D%22M14.143%2C4H6c-2.207.004-3.996%2C1.793-4%2C4v18c.004%2C2.207%2C1.793%2C3.996%2C4%2C4h18c2.207-.004%2C3.996-1.793%2C4-4v-8.151c0-.552-.448-1-1-1s-1%2C.448-1%2C1v8.151c0%2C.549-.223%2C1.045-.588%2C1.412-.367.366-.862.588-1.412.588H6c-.549%2C0-1.045-.223-1.412-.588-.366-.367-.588-.862-.588-1.412V8c0-.549.223-1.045.588-1.412.367-.366.862-.588%2C1.412-.588h8.143c.552%2C0%2C1-.448%2C1-1s-.448-1-1-1h0Z%22%2F%3E%3C%2Fsvg%3E");
	--svg-magnifier: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20d%3D%22M31.414%2C28.586l-8.635-8.635c1.398-2.056%2C2.221-4.548%2C2.22-7.229%2C0-3.5-1.394-6.685-3.651-8.985C19.095%2C1.434%2C15.956%2C0%2C12.5%2C0%2C9.044%2C0%2C5.905%2C1.434%2C3.651%2C3.737%2C1.394%2C6.038%2C0%2C9.222%2C0%2C12.722c0%2C3.5%2C1.394%2C6.685%2C3.651%2C8.985%2C2.254%2C2.302%2C5.393%2C3.738%2C8.849%2C3.737%2C2.83%2C0%2C5.438-.973%2C7.531-2.585l8.555%2C8.555c.781.781%2C2.047.781%2C2.828%2C0%2C.781-.781.781-2.047%2C0-2.828ZM5.793%2C19.607c-1.724-1.761-2.793-4.187-2.793-6.885%2C0-2.698%2C1.069-5.124%2C2.793-6.885%2C1.727-1.759%2C4.088-2.836%2C6.707-2.837%2C2.619%2C0%2C4.98%2C1.078%2C6.707%2C2.837%2C1.724%2C1.761%2C2.793%2C4.187%2C2.793%2C6.885%2C0%2C2.698-1.069%2C5.124-2.793%2C6.885-1.727%2C1.759-4.088%2C2.836-6.707%2C2.837-2.619%2C0-4.98-1.078-6.707-2.837Z%22%2F%3E%3C%2Fsvg%3E");
	--svg-arrow: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20d%3D%22M27.458%2C14.701l-9.092-9.68c-.756-.805-2.022-.845-2.827-.089s-.845%2C2.022-.089%2C2.827l5.928%2C6.311H6c-1.105%2C0-2%2C.895-2%2C2s.895%2C2%2C2%2C2h15.378l-5.795%2C6.17c-.756.805-.717%2C2.071.089%2C2.827.805.756%2C2.071.717%2C2.827-.089l8.96-9.539c.723-.77.723-1.969%2C0-2.738Z%22%2F%3E%3C%2Fsvg%3E");
	--svg-plus_circled_solid: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20d%3D%22M16%2C0C7.163%2C0%2C0%2C7.163%2C0%2C16c0%2C8.837%2C7.163%2C15.999%2C16%2C16%2C8.837%2C0%2C15.999-7.163%2C16-16C31.999%2C7.163%2C24.837%2C0%2C16%2C0ZM23.5%2C17.5h-6v5.906c0%2C.828-.672%2C1.5-1.5%2C1.5s-1.5-.672-1.5-1.5v-5.906h-6c-.828%2C0-1.5-.672-1.5-1.5s.672-1.5%2C1.5-1.5h6v-5.906c0-.828.672-1.5%2C1.5-1.5s1.5.672%2C1.5%2C1.5v5.906h6c.828%2C0%2C1.5.672%2C1.5%2C1.5s-.672%2C1.5-1.5%2C1.5Z%22%2F%3E%3C%2Fsvg%3E");
	--svg-check_circled_solid: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20d%3D%22M16%2C0C7.178%2C0%2C0%2C7.178%2C0%2C16s7.178%2C16%2C16%2C16%2C16-7.178%2C16-16S24.822%2C0%2C16%2C0ZM25.061%2C11.728l-10.667%2C10.666c-.293.293-.677.439-1.061.439s-.768-.146-1.061-.439l-5.333-5.333c-.586-.586-.586-1.535%2C0-2.121.585-.586%2C1.535-.586%2C2.121%2C0l4.273%2C4.272%2C9.606-9.605c.586-.586%2C1.535-.586%2C2.121%2C0s.586%2C1.535%2C0%2C2.121Z%22%2F%3E%3C%2Fsvg%3E");
}

/* WPブロックエディタに読み込ませるために必要 */
.wp-block {/* for editor */}

@media (max-width: 360px) {

	:root {
		--font-size: 4vw;/* 375px÷15px＝25字 → 100vw÷25字＝4vw → 320px÷25字＝12.8px */
	}

/**/}


/*------------------------------------------------------------------------------

	<body>

------------------------------------------------------------------------------*/
/*
	WordPress ブロックエディタ考慮版
	.wp-block-post-title   ブロックエディタタイトル
	.wp-block-post-content ブロックエディタ本文
*/

body:not(.wp-admin),
.wp-block-post-title,
.wp-block-post-content {
	--wp-adminbar-height: 0px;
	/**/
	scroll-behavior: smooth;
	/**/
	margin: 0;
	padding: 0;
	background: rgb(var(--color-bg-body-rgb) / var(--color-bg-body-a, 1));
	line-height: var(--line-height-p);
	font-family: var(--font-sans);
	font-size: var(--font-size);
	font-weight: var(--font-weight);
	color: rgb(var(--color-text-p-rgb) / var(--color-text-p-a, 1));
	/**/
	letter-spacing: var(--letter-spacing-p);
	font-feature-settings: var(--font-feature-settings-p);
}

/* フォントレンダリング設定: 1x解像度ではsubpixel、2x以上の解像度ではgrayscale */
/* http://creator.dwango.co.jp/14128.html */
body {
	-webkit-font-smoothing: subpixel-antialiased;
	-moz-osx-font-smoothing: unset;

	/* OpenType光学サイズ機能 */
	font-optical-sizing: auto;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	body {
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
}


/*	WordPressログイン状態（Adminバー表示時）
------------------------------------------------------------------------------*/

body.customize-support {
	--wp-adminbar-height: 32px;
}

@media (max-width: 782px) {/* WordPressのブレイクポイント */

	body.customize-support {
		--wp-adminbar-height: 46px;
	}

/**/}


/*////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////*/


/*------------------------------------------------------------------------------

	ブロック要素

------------------------------------------------------------------------------*/


/*	ボックスモデル
------------------------------------------------------------------------------*/

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


/*	見出し
------------------------------------------------------------------------------*/

h1,h2,h3,h4,h5,h6 {
	margin: 0 auto;
	line-height: var(--line-height-h);
	font-weight: bold;
	font-size: var(--font-size);/* 一旦リセット */
	color: rgb(var(--color-text-h-rgb) / var(--color-text-h-a, 1));
	/**/
	letter-spacing: var(--letter-spacing-h);
	font-feature-settings: var(--font-feature-settings-h);
	/**/
	/* https://developer.chrome.com/blog/css-i18n-features?hl=ja */
	/* lang="ja"のみ。※現状対応ブラウザが少ない。折り返ししない状態になるので解除した方が無難と判断した。 */
	/*
	word-break: auto-phrase;
	*/
}


/*	段落
------------------------------------------------------------------------------*/

P {
	margin: 0 auto;
}


/*	リスト
------------------------------------------------------------------------------*/

ul,
ol,
dl {
	--list-item-gap: .25em;
	--list-padding-left: 2em;
	/**/
	margin: 0 auto;
	padding: 0;
}

ul,
ol {
	padding-left: var(--list-padding-left);
}

li,
dd {
	margin: 0;
}

li > *:first-child,
dd > *:first-child {/* :last-child は意図的に指定していない */
	margin-top: 0 !important;
}

dt {
	font-weight: bold;
}


/*	図
------------------------------------------------------------------------------*/

figure {
	margin: 0 auto;
	text-align: center;
}

figure > a {
	display: block;
}

figure > img,
figure > *:not(.img) > img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

figure > figcaption {
	display: block;
	margin: .25em 0 0;
	padding: .5em 0;
	text-align: center;
	line-height: 1.5;
	font-size: 87.5%;
}


/*	引用
------------------------------------------------------------------------------*/

blockquote {
	position: relative;
	margin: 0 auto;
	padding: 1em;
	background: rgb(var(--color-bg-code-rgb) / var(--color-bg-code-a, 1));
	color: rgb(var(--color-text-p-rgb) / var(--color-text-p-a, 1));
}

blockquote::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 3px;
	height: 100%;
	background: rgb(var(--color-text-p-rgb) / var(--color-text-p-a, 1));
}

blockquote > *:first-child {
	margin-top: 0 !important;
}

blockquote > *:last-child {
	margin-bottom: 0 !important;
}

blockquote strong {
	background: none !important;
}


/*	テーブル
------------------------------------------------------------------------------*/

table {
	--table-border: 1px solid rgb(var(--color-text-p-rgb) / .2);
	--line-height: var(--line-height-table);
	/**/
	width: auto;
	margin: 0 auto;
	border: none;
	border-spacing: 0;
	border-collapse: separate;
	border-left: var(--table-border);
	border-top: var(--table-border);
	line-height: var(--line-height);
	font-size: var(--font-size);
}

tfoot {
	border-top: 2px solid rgb(var(--color-text-p-rgb) / var(--color-text-p-a, 1));
}

th,
td {
	vertical-align: top;
	padding: calc(1em - (var(--line-height) - 1) * 1em / 2) 1em;
	border: none;
	border-right: var(--table-border);
	border-bottom: var(--table-border);
}

th > *:first-child,
td > *:first-child {
	margin-top: 0;
}

th > *:last-child,
td > *:last-child {
	margin-bottom: 0;
}

th {
	background: rgb(var(--color-text-p-rgb) / .07);
	font-weight: bold;
}


/*	運営者
------------------------------------------------------------------------------*/

address {
	font-style: normal;
}


/*	整形済みテキスト・コード
------------------------------------------------------------------------------*/

pre {
	overflow: auto;
	padding: .75em 1em;
	border: 1px solid rgb(var(--color-text-p-rgb) / .3);
	line-height: 1.5;
	font-family: var(--font-mono);
	font-size: 87.5%;
}


/*------------------------------------------------------------------------------

	インライン要素

------------------------------------------------------------------------------*/


/*	アンカー
------------------------------------------------------------------------------*/

a {
	-webkit-tap-highlight-color: rgb(0 0 0 / 0);/* 非推奨実装 */
	text-decoration: none;
	color: rgb(var(--color-text-link-rgb) / var(--color-text-link-a, 1));
}


/*	強調
------------------------------------------------------------------------------*/

strong {
	font-weight: bold;
}

em {
	font-style: normal;
	font-weight: 700;
}


/*	画像
------------------------------------------------------------------------------*/

img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
	font-style: italic;
	background-repeat: no-repeat;
	background-size: cover;
	shape-margin: 1em;/* 回り込みマージン */
}

.img {
	overflow: hidden;
	/**/
	display: block;
	position: relative;
	z-index: 2;
	/**/
	aspect-ratio: var(--aspect-ratio, 4 / 3);
	width: 100%;
	/**/
	margin: 0 auto;
	border-radius: var(--radius, 0px);
	/**/
	transition: opacity .2s ease-out,
	            transform .2s ease-out;
}

.img > img {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	/**/
	transition: opacity .2s ease-out,
	            transform .2s ease-out;
}

/**/

.img.aspect_16-9 { aspect-ratio: 16 / 9; }
.img.aspect_4-3 { aspect-ratio: 4 / 3; }
.img.aspect_2-1 { aspect-ratio: 2 / 1; }
.img.aspect_1-1 { aspect-ratio: 1 / 1; }
.img.aspect_9-16 { aspect-ratio: 9 / 16; }
.img.aspect_3-4 { aspect-ratio: 3 / 4; }
.img.aspect_1-2 { aspect-ratio: 1 / 2; }

@media (max-width: 1440px) {
	.img.aspect_16-9_1440px { aspect-ratio: 16 / 9; }
	.img.aspect_4-3_1440px { aspect-ratio: 4 / 3; }
	.img.aspect_2-1_1440px { aspect-ratio: 2 / 1; }
	.img.aspect_1-1_1440px { aspect-ratio: 1 / 1; }
	.img.aspect_9-16_1440px { aspect-ratio: 9 / 16; }
	.img.aspect_3-4_1440px { aspect-ratio: 3 / 4; }
	.img.aspect_1-2_1440px { aspect-ratio: 1 / 2; }
}

@media (max-width: 1280px) {
	.img.aspect_16-9_1280px { aspect-ratio: 16 / 9; }
	.img.aspect_4-3_1280px { aspect-ratio: 4 / 3; }
	.img.aspect_2-1_1280px { aspect-ratio: 2 / 1; }
	.img.aspect_1-1_1280px { aspect-ratio: 1 / 1; }
	.img.aspect_9-16_1280px { aspect-ratio: 9 / 16; }
	.img.aspect_3-4_1280px { aspect-ratio: 3 / 4; }
	.img.aspect_1-2_1280px { aspect-ratio: 1 / 2; }
}

@media (max-width: 1024px) {
	.img.aspect_16-9_1024px { aspect-ratio: 16 / 9; }
	.img.aspect_4-3_1024px { aspect-ratio: 4 / 3; }
	.img.aspect_2-1_1024px { aspect-ratio: 2 / 1; }
	.img.aspect_1-1_1024px { aspect-ratio: 1 / 1; }
	.img.aspect_9-16_1024px { aspect-ratio: 9 / 16; }
	.img.aspect_3-4_1024px { aspect-ratio: 3 / 4; }
	.img.aspect_1-2_1024px { aspect-ratio: 1 / 2; }
}

@media (max-width: 1023px) {
	.img.aspect_16-9_1023px { aspect-ratio: 16 / 9; }
	.img.aspect_4-3_1023px { aspect-ratio: 4 / 3; }
	.img.aspect_2-1_1023px { aspect-ratio: 2 / 1; }
	.img.aspect_1-1_1023px { aspect-ratio: 1 / 1; }
	.img.aspect_9-16_1023px { aspect-ratio: 9 / 16; }
	.img.aspect_3-4_1023px { aspect-ratio: 3 / 4; }
	.img.aspect_1-2_1023px { aspect-ratio: 1 / 2; }
}

@media (max-width: 720px) {
	.img.aspect_16-9_720px { aspect-ratio: 16 / 9; }
	.img.aspect_4-3_720px { aspect-ratio: 4 / 3; }
	.img.aspect_2-1_720px { aspect-ratio: 2 / 1; }
	.img.aspect_1-1_720px { aspect-ratio: 1 / 1; }
	.img.aspect_9-16_720px { aspect-ratio: 9 / 16; }
	.img.aspect_3-4_720px { aspect-ratio: 3 / 4; }
	.img.aspect_1-2_720px { aspect-ratio: 1 / 2; }
}


/*	SVG
------------------------------------------------------------------------------*/

svg {
	overflow-x: visible;
	overflow-y: visible;
}


/*////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////*/


/*------------------------------------------------------------------------------

	ユーティリティ

------------------------------------------------------------------------------*/


/*	折り返し
------------------------------------------------------------------------------*/

.l {
	display: inline-block;
}

.l.s {
	width: .333em;
}


/*	幅あふれ処理
------------------------------------------------------------------------------*/

.nowrap {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


/*	行あふれ処理
------------------------------------------------------------------------------*/

.line-clamp,
.line-clamp-1,
.line-clamp-2,
.line-clamp-3,
.line-clamp-4 {
	--line-clamp: 1;
	/**/
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--line-clamp);
}

.line-clamp-1 {--line-clamp: 1;}
.line-clamp-2 {--line-clamp: 2;}
.line-clamp-3 {--line-clamp: 3;}
.line-clamp-4 {--line-clamp: 4;}


/*	テキスト下線
------------------------------------------------------------------------------*/

.text-underline {
	text-decoration: underline;
	text-underline-offset: .2em;
	text-decoration-thickness: 1px;
}


/*	グレースケールフィルタ
------------------------------------------------------------------------------*/

.grayscale {
	filter: saturate(0);
}