/* ==========================================================================
   PT Deco — SWELL 準拠の記事装飾スタイル
   ---------------------------------------------------------------------------
   このファイルは 3 つの部分でできています。

     1. アイコンフォント（SWELL の icomoon をそのまま同梱）
     2. 変数定義（SWELL の変数名をそのまま使用。:root ではなく装飾要素に定義）
     3. SWELL 本体から抽出した装飾 CSS（無改変）+ 見出しデザイン（移植）

   SWELL は GPL v3 です（style.css の License ヘッダ / licence ファイル）。
   本ファイルは同ライセンスの下で SWELL のスタイルを利用しています。

   設計ルール
   - body / :root / 素のタグセレクタは使いません。変数も装飾要素に定義します。
   - @layer は使いません。
   - 色を変えるときは、装飾ブロックの「追加CSSクラス」に
     pt-c-blue / pt-c-green / pt-c-orange / pt-c-purple / pt-c-gray。
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. アイコンフォント（SWELL 同梱の icomoon）
   チェックリスト・良い/悪いリスト・H4 のチェックアイコンで使います。
   -------------------------------------------------------------------------- */

@font-face {
	font-family: icomoon;
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(icomoon.woff2) format("woff2");
}

/* --------------------------------------------------------------------------
   2. 変数
   SWELL は :root に置いていますが、コーポレートページへ漏らさないため
   装飾要素そのものに定義しています。CSS変数は子孫に継承されるので、
   内部の要素まで問題なく行き渡ります。
   -------------------------------------------------------------------------- */

.swell-block-accordion,
.swell-block-faq,
.swell-block-step,
.swell-block-dl,
.swell-block-linkList,
.swell-block-columns,
.swell-block-button,
.c-balloon,
.cap_box,
.swl-marker,
.pt-linkcard,
[class*="pt-h2-"],
[class*="pt-h3-"],
[class*="pt-h4-"],
[class*="pt-table"],
[class*="is-style-check_list"],
[class*="is-style-good_list"],
[class*="is-style-bad_list"],
[class*="is-style-note_list"],
[class*="is-style-num_circle"],
[class*="is-style-triangle_list"] {
	/* 基本色 — SWELL のカスタマイザー既定値に相当。
	   --color_main だけをサイトのブランド色に差し替えています。 */
	--color_main: #e84191;
	--color_htag: var(--color_main);
	--color_text: #333;
	--color_border: hsla(0, 0%, 78%, .5);
	--color_gray: hsla(0, 0%, 78%, .15);
	--color_content_bg: #fff;

	/* 見出しデザイン用の透過色。color-mix 非対応ブラウザ向けに
	   先に固定値を書き、対応ブラウザではこの下で上書きします。 */
	--color_htag--03: rgba(232, 65, 145, .03);
	--color_htag--05: rgba(232, 65, 145, .05);
	--color_htag--15: rgba(232, 65, 145, .15);
	--color_htag--50: rgba(232, 65, 145, .5);

	/* リスト（SWELL 既定値） */
	--color_list_check: var(--color_main);
	--color_list_num: var(--color_main);
	--color_list_good: #86dd7b;
	--color_list_bad: #f36060;
	--color_list_triangle: #f4e03a;

	/* FAQ（SWELL 既定値） */
	--color_faq_q: #d55656;
	--color_faq_a: #6599b7;
	--swl-faq_icon_radius: 0;

	/* キャプションボックス */
	--capbox-color: var(--color_main);
	--capbox-color--bg: unset;

	/* ステップ */
	--swl-step_arrow_color: #dedede;

	/* その他（SWELL の :root と同値） */
	--swl-box_shadow: 0 2px 4px rgba(0, 0, 0, .05), 0 4px 4px -4px rgba(0, 0, 0, .1);
	--swl-color_shadow: rgba(0, 0, 0, .12);
	--swl-radius--2: 2px;
	--swl-dt-width: 30%;
	--swl-box_padding: 1.5em;
	--swl-list-padding--left: 1.5em;
	--swl-list-padding--has_bg: 1em 1em 1em 1.75em;

	/* アイコン色 */
	--color_icon_check: var(--color_main);
	--color_icon_point: #e5c229;
	--color_icon_caution: #f5a623;
	--color_icon_memo: #78909c;
	--color_icon_batsu: #f36060;
	--color_icon_hatena: #6599b7;
}

@supports (color: color-mix(in srgb, red 50%, transparent)) {
	.swell-block-accordion,
	.swell-block-faq,
	.swell-block-step,
	.swell-block-dl,
	.swell-block-linkList,
	.swell-block-columns,
	.swell-block-button,
	.c-balloon,
	.cap_box,
	.swl-marker,
	.pt-linkcard,
	[class*="pt-h2-"],
	[class*="pt-h3-"],
	[class*="pt-h4-"],
	[class*="pt-table"],
	[class*="is-style-check_list"],
	[class*="is-style-good_list"],
	[class*="is-style-bad_list"],
	[class*="is-style-note_list"],
	[class*="is-style-num_circle"],
	[class*="is-style-triangle_list"] {
		--color_htag--03: color-mix(in srgb, var(--color_htag) 3%, transparent);
		--color_htag--05: color-mix(in srgb, var(--color_htag) 5%, transparent);
		--color_htag--15: color-mix(in srgb, var(--color_htag) 15%, transparent);
		--color_htag--50: color-mix(in srgb, var(--color_htag) 50%, transparent);
	}
}

/* --------------------------------------------------------------------------
   3. 見出しデザイン
   SWELL の classes/Style/Post.php が生成する CSS をそのまま移植したものです。
   SWELL ではカスタマイザーで1種類を選んで全 H2 に適用しますが、
   ここでは見出しごとに選べるようクラスにしています。
   -------------------------------------------------------------------------- */

/* 3-0. 共通（SWELL の .post_content h2 / h3 / h4 に相当） ------------------ */

[class*="pt-h2-"],
[class*="pt-h3-"],
[class*="pt-h4-"] {
	position: relative;
	font-weight: 700;
	line-height: 1.4;
	box-sizing: border-box;
}

[class*="pt-h2-"] {
	z-index: 1;
	margin: 4em 0 2em;
	font-size: 1.4em;
}

[class*="pt-h3-"] {
	margin: 3em 0 2em;
	font-size: 1.3em;
}

[class*="pt-h4-"] {
	margin: 3em 0 1.5em;
	font-size: 1.2em;
}

[class*="pt-h2-"]::before,
[class*="pt-h4-"]::before {
	position: absolute;
	display: block;
	pointer-events: none;
}

[class*="pt-h3-"]::before {
	position: absolute;
	display: block;
	bottom: 0;
	left: 0;
	z-index: 0;
}

/* 3-1. H2 デザイン 10 種 -------------------------------------------------- */

.pt-h2-b_left,
.is-style-pt-h2-b_left {
	padding: .5em 0 .5em 16px;
	border-left: solid 6px var(--color_htag);
}

.pt-h2-b_left2,
.is-style-pt-h2-b_left2 {
	padding: .5em 0 .5em 24px;
}

.pt-h2-b_left2::before,
.is-style-pt-h2-b_left2::before {
	content: "";
	top: 0;
	left: 0;
	width: 8px;
	height: 100%;
	background: repeating-linear-gradient(var(--color_htag) 0%, var(--color_htag) 50%, var(--color_htag--15) 50%, var(--color_htag--15) 100%);
}

.pt-h2-band,
.is-style-pt-h2-band {
	padding: .75em 1em;
	background: var(--color_htag);
	color: #fff;
}

.pt-h2-band::before,
.is-style-pt-h2-band::before {
	content: "";
	top: -4px;
	left: 0;
	width: 100%;
	height: calc(100% + 4px);
	box-sizing: content-box;
	border-top: solid 2px var(--color_htag);
	border-bottom: solid 2px var(--color_htag);
}

.pt-h2-block,
.is-style-pt-h2-block {
	padding: .75em 1em;
	background: var(--color_htag);
	color: #fff;
	border-radius: var(--swl-radius--2, 0px);
}

.pt-h2-tag_normal,
.is-style-pt-h2-tag_normal {
	padding: .75em 1em;
	border-left: solid 8px var(--color_htag);
	background: var(--color_htag--03);
}

.pt-h2-tag,
.is-style-pt-h2-tag {
	padding: .75em 1em;
	border-left: solid 8px var(--color_htag);
	background: linear-gradient(135deg, transparent 25%, var(--color_htag--05) 25%, var(--color_htag--05) 50%, transparent 50%, transparent 75%, var(--color_htag--05) 75%, var(--color_htag--05));
	background-size: 4px 4px;
}

.pt-h2-balloon,
.is-style-pt-h2-balloon {
	padding: .75em 1em;
	background: var(--color_htag);
	color: #fff;
	border-radius: 2px;
}

.pt-h2-balloon::before,
.is-style-pt-h2-balloon::before {
	content: "";
	bottom: calc(2px - 1.5em);
	left: 1.5em;
	width: 0;
	height: 0;
	visibility: visible;
	border: .75em solid transparent;
	border-top-color: var(--color_htag);
}

.pt-h2-stitch,
.is-style-pt-h2-stitch {
	padding: 1em;
	background: var(--color_htag);
	color: #fff;
	border-radius: 2px;
}

.pt-h2-stitch::before,
.is-style-pt-h2-stitch::before {
	content: "";
	top: 4px;
	left: 4px;
	right: auto;
	bottom: auto;
	width: calc(100% - 8px);
	height: calc(100% - 8px);
	border: dashed 1px #fff;
}

.pt-h2-stitch_thin,
.is-style-pt-h2-stitch_thin {
	padding: 1em;
	background: var(--color_htag--05);
	border-radius: 2px;
}

.pt-h2-stitch_thin::before,
.is-style-pt-h2-stitch_thin::before {
	content: "";
	top: 4px;
	left: 4px;
	right: auto;
	bottom: auto;
	width: calc(100% - 8px);
	height: calc(100% - 8px);
	border: dashed 1px var(--color_htag--50);
}

.pt-h2-b_topbottom,
.is-style-pt-h2-b_topbottom {
	padding: 1em .75em;
	border-top: solid 2px var(--color_htag);
	border-bottom: solid 2px var(--color_htag);
}

/* 3-2. H3 デザイン 6 種 --------------------------------------------------- */

.pt-h3-main_line,
.is-style-pt-h3-main_line {
	padding: 0 .5em .5em;
}

.pt-h3-main_line::before,
.is-style-pt-h3-main_line::before {
	content: "";
	width: 100%;
	height: 2px;
	background-color: var(--color_htag);
}

.pt-h3-main_gray,
.is-style-pt-h3-main_gray {
	padding: 0 .5em .5em;
}

.pt-h3-main_gray::before,
.is-style-pt-h3-main_gray::before {
	content: "";
	width: 100%;
	height: 2px;
	background: repeating-linear-gradient(90deg, var(--color_htag) 0%, var(--color_htag) 29.3%, rgba(150, 150, 150, .2) 29.3%, rgba(150, 150, 150, .2) 100%);
}

.pt-h3-main_thin,
.is-style-pt-h3-main_thin {
	padding: 0 .5em .5em;
}

.pt-h3-main_thin::before,
.is-style-pt-h3-main_thin::before {
	content: "";
	width: 100%;
	height: 2px;
	background: repeating-linear-gradient(90deg, var(--color_htag) 0%, var(--color_htag) 29.3%, var(--color_htag--15) 29.3%, var(--color_htag--15) 100%);
}

.pt-h3-gradation,
.is-style-pt-h3-gradation {
	padding: 0 .5em .5em;
}

.pt-h3-gradation::before,
.is-style-pt-h3-gradation::before {
	content: "";
	width: 100%;
	height: 2px;
	background: repeating-linear-gradient(90deg, var(--color_htag) 0%, var(--color_htag) 20%, var(--color_htag--15) 90%, var(--color_htag--15) 100%);
}

.pt-h3-stripe,
.is-style-pt-h3-stripe {
	padding: 0 .5em .5em;
}

.pt-h3-stripe::before,
.is-style-pt-h3-stripe::before {
	content: "";
	width: 100%;
	height: 4px;
	background: linear-gradient(135deg, transparent 25%, var(--color_htag) 25%, var(--color_htag) 50%, transparent 50%, transparent 75%, var(--color_htag) 75%, var(--color_htag));
	background-size: 4px 4px;
	opacity: .5;
}

.pt-h3-l_border,
.is-style-pt-h3-l_border {
	padding: .25em 0 .25em 16px;
	border-left: solid 4px var(--color_htag);
}

.pt-h3-l_block,
.is-style-pt-h3-l_block {
	padding: .25em 1em;
}

.pt-h3-l_block::before,
.is-style-pt-h3-l_block::before {
	content: "";
	top: 0;
	bottom: auto;
	width: 4px;
	height: 100%;
	background: repeating-linear-gradient(var(--color_htag) 0%, var(--color_htag) 50%, var(--color_htag--15) 50%, var(--color_htag--15) 100%);
}

/* 3-3. H4 デザイン 2 種 --------------------------------------------------- */

.pt-h4-left_line,
.is-style-pt-h4-left_line {
	padding: 0 0 0 16px;
	border-left: solid 2px var(--color_htag);
}

.pt-h4-check::before,
.is-style-pt-h4-check::before {
	position: static;
	content: "\e923";
	display: inline-block;
	margin-right: .5em;
	font-family: icomoon;
	color: var(--color_htag);
}

/* --------------------------------------------------------------------------
   4. 色バリエーション
   装飾ブロックの「追加CSSクラス」に足すと、その要素と中身の色が変わります。
   親のグループに付ければ、その中の装飾すべてに効きます。
   -------------------------------------------------------------------------- */

.pt-c-blue {
	--color_main: #3d7bd9;
	--color_htag--03: rgba(61, 123, 217, .03);
	--color_htag--05: rgba(61, 123, 217, .05);
	--color_htag--15: rgba(61, 123, 217, .15);
	--color_htag--50: rgba(61, 123, 217, .5);
}

.pt-c-green {
	--color_main: #3f9d6d;
	--color_htag--03: rgba(63, 157, 109, .03);
	--color_htag--05: rgba(63, 157, 109, .05);
	--color_htag--15: rgba(63, 157, 109, .15);
	--color_htag--50: rgba(63, 157, 109, .5);
}

.pt-c-orange {
	--color_main: #de8a2c;
	--color_htag--03: rgba(222, 138, 44, .03);
	--color_htag--05: rgba(222, 138, 44, .05);
	--color_htag--15: rgba(222, 138, 44, .15);
	--color_htag--50: rgba(222, 138, 44, .5);
}

.pt-c-purple {
	--color_main: #8b5fbf;
	--color_htag--03: rgba(139, 95, 191, .03);
	--color_htag--05: rgba(139, 95, 191, .05);
	--color_htag--15: rgba(139, 95, 191, .15);
	--color_htag--50: rgba(139, 95, 191, .5);
}

.pt-c-gray {
	--color_main: #7c7368;
	--color_htag--03: rgba(124, 115, 104, .03);
	--color_htag--05: rgba(124, 115, 104, .05);
	--color_htag--15: rgba(124, 115, 104, .15);
	--color_htag--50: rgba(124, 115, 104, .5);
}

@supports (color: color-mix(in srgb, red 50%, transparent)) {
	.pt-c-blue,
	.pt-c-green,
	.pt-c-orange,
	.pt-c-purple,
	.pt-c-gray {
		--color_htag--03: color-mix(in srgb, var(--color_htag) 3%, transparent);
		--color_htag--05: color-mix(in srgb, var(--color_htag) 5%, transparent);
		--color_htag--15: color-mix(in srgb, var(--color_htag) 15%, transparent);
		--color_htag--50: color-mix(in srgb, var(--color_htag) 50%, transparent);
	}
}

/* --------------------------------------------------------------------------
   5. マーカー
   SWELL の .swl-marker に、色の指定を足したものです。
   -------------------------------------------------------------------------- */

.pt-marker,
.pt-marker-red {
	display: inline;
	padding: 2px;
	background-color: transparent;
	background-repeat: no-repeat;
	color: inherit;
	font-weight: inherit;
}

.pt-marker {
	background-image: linear-gradient(transparent 60%, #ffe9a3 60%);
}

.pt-marker-red {
	background-image: linear-gradient(transparent 60%, #ffcfe0 60%);
}

/* --------------------------------------------------------------------------
   6. ここから下は SWELL 本体（build/css/main.css・blocks.css）から
      該当箇所を抽出したものです。宣言は無改変です。
   -------------------------------------------------------------------------- */
.wp-block-image.is-style-shadow img,
.wp-block-video.is-style-shadow video {
	box-shadow:0 2px 8px rgba(0,0,0,.1),0 4px 8px -4px rgba(0,0,0,.2);
}

.cap_box_content>*,
.faq_a>*,
.swell-block-accordion__body>*,
.swell-block-dl__dd>*,
.swell-block-step__body>* {
	margin-bottom:1em;
}

.is-style-border_sg {
	border:1px solid hsla(0,0%,78%,.5);padding:var(--swl-box_padding);
}

.is-style-border_dg {
	border:1px dashed hsla(0,0%,78%,.5);padding:var(--swl-box_padding);
}

.is-style-border_sm {
	border:1px solid var(--color_main);padding:var(--swl-box_padding);
}

.is-style-border_dm {
	border:1px dashed var(--color_main);padding:var(--swl-box_padding);
}

.is-style-big_kakko_box {
	padding:var(--swl-box_padding);position:relative;
}

.is-style-big_kakko_box:before {
	border-bottom:1px solid;border-left:1px solid;border-top:1px solid;bottom:0;left:0;
}

.is-style-big_kakko_box:after {
	border-bottom:1px solid;border-right:1px solid;border-top:1px solid;bottom:0;right:0;
}

.is-style-big_kakko_box:after,
.is-style-big_kakko_box:before {
	border-color:var(--color_main);content:"";display:inline-block;height:100%;position:absolute;width:.75em;
}

.is-style-border_left {
	border-left:2px solid;padding-left:10px;
}

[class*=is-style-big_icon_] {
	border-color:var(--the-color,currentColor);padding:2em 1.5em 1.5em;position:relative;
}

[class*=is-style-big_icon_]:not(:first-child) {
	margin-top:2.5em;
}

[class*=is-style-big_icon_]:before {
	align-items:center;background-color:var(--the-color,currentColor);border:2px solid;border-color:var(--color_content_bg);border-radius:50%;color:#fff;content:"";display:inline-flex;font-family:icomoon;font-size:1.25em;height:2em;justify-content:center;left:.5em;line-height:1;padding:0 0 0 .05em;position:absolute;top:-1px;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:2em;
}

.is-style-big_icon_point {
	--the-color:var(--color_icon_point);
}

.is-style-big_icon_point:before {
	content:"\e915";
}

.is-style-big_icon_check,
.is-style-big_icon_good {
	--the-color:var(--color_icon_check);
}

.is-style-big_icon_check:before,
.is-style-big_icon_good:before {
	content:"\e923";
}

.is-style-big_icon_bad,
.is-style-big_icon_batsu {
	--the-color:var(--color_icon_batsu);
}

.is-style-big_icon_bad:before,
.is-style-big_icon_batsu:before {
	content:"\e91f";
}

.is-style-big_icon_hatena {
	--the-color:var(--color_icon_hatena);
}

.is-style-big_icon_hatena:before {
	content:"\e917";
}

.is-style-big_icon_caution {
	--the-color:var(--color_icon_caution);
}

.is-style-big_icon_caution:before {
	content:"\e916";
}

.is-style-big_icon_memo {
	--the-color:var(--color_icon_memo);
}

.is-style-big_icon_memo:before {
	content:"\e929";
}

.swell-block-column .is-style-browser_mac {
	--frame-width:4px;--caption-fz:11px;--bar-height:30px;
}

.swell-block-column .is-style-desktop {
	--bezel-width:6px;
}

.wp-block-image.is-style-border img,
.wp-block-video.is-style-border video {
	border:1px solid rgba(0,0,0,.1);
}

.swl-marker {
	display:inline;padding:2px;
}

ol.is-style-index ul li:before,
ul.is-style-index li li:before {
	background:none;border-bottom:2px solid;border-left:2px solid;border-radius:0;box-shadow:none;color:inherit;content:""!important;height:calc(1em - 2px);left:.25em;opacity:.75;position:absolute;top:0;-webkit-transform:none;transform:none;-webkit-transform:scale(.75);transform:scale(.75);-webkit-transform-origin:50% 100%;transform-origin:50% 100%;width:6px;
}

.is-style-bad_list,
.is-style-check_list,
.is-style-good_list,
.is-style-index,
.is-style-note_list,
.is-style-num_circle,
.is-style-triangle_list {
	--swl-list-padding--left:.25em;--swl-list-padding--has_bg:1em;list-style:none!important;
}

.is-style-bad_list ol,
.is-style-bad_list ul,
.is-style-check_list ol,
.is-style-check_list ul,
.is-style-good_list ol,
.is-style-good_list ul,
.is-style-index ol,
.is-style-index ul,
.is-style-note_list ol,
.is-style-note_list ul,
.is-style-num_circle ol,
.is-style-num_circle ul,
.is-style-triangle_list ol,
.is-style-triangle_list ul {
	--swl-list-padding--left:0px;list-style:none!important;
}

ul.is-style-index li {
	padding-left:1.25em;position:relative;
}

ul.is-style-index li:before {
	background-color:currentcolor;border-radius:50%;color:inherit;content:"";display:block;height:6px;left:2px;position:absolute;top:calc(.75em - 3px);width:6px;
}

ol.is-style-index>:first-child {
	counter-reset:toc;
}

ol.is-style-index ol>li,
ol.is-style-index>li {
	margin-left:2em;padding-left:0;position:relative;
}

ol.is-style-index ol>li:before,
ol.is-style-index>li:before {
	border-right:1px solid;content:counters(toc,"-");counter-increment:toc;display:block;font-family:inherit;letter-spacing:-.1px;line-height:1.1;padding:0 .5em 0 0;position:absolute;right:calc(100% + .5em);top:.25em;-webkit-transform:scale(.95);transform:scale(.95);white-space:nowrap;width:auto;
}

ol.is-style-index ol {
	counter-reset:toc;padding-left:1em;
}

ol.is-style-index ol li:before {
	opacity:.75;
}

ol.is-style-index ul li {
	counter-increment:none;margin-left:0;padding-left:1.25em;
}

.is-style-bad_list li,
.is-style-check_list li,
.is-style-good_list li,
.is-style-triangle_list li {
	padding-left:1.5em;
}

.is-style-bad_list li:before,
.is-style-check_list li:before,
.is-style-good_list li:before,
.is-style-triangle_list li:before {
	-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:none;border:none;border-radius:0;display:block;font-family:icomoon;height:auto;left:0;position:absolute;top:0;width:1em;
}

.is-style-bad_list li li:before,
.is-style-check_list li li:before,
.is-style-good_list li li:before,
.is-style-triangle_list li li:before {
	background-color:currentcolor;-webkit-clip-path:circle(12% at 50%);clip-path:circle(12% at 50%);content:"\00a0";font-family:inherit;
}

.is-style-check_list li:before {
	color:var(--color_list_check);content:"\e923";
}

.is-style-good_list li:before {
	color:var(--color_list_good);content:"\ea56";
}

.is-style-triangle_list li:before {
	color:var(--color_list_triangle);content:"\e93f";
}

.is-style-bad_list li:before {
	color:var(--color_list_bad);content:"\e91f";
}

.is-style-note_list {
	font-size:.9em;
}

.is-style-note_list:not(.has-text-color) {
	opacity:.85;
}

.is-style-note_list li {
	margin:.5em 0;padding-left:1.25em;
}

.is-style-note_list li:before {
	background:none;border:none;border-radius:0;content:"※";height:auto;left:0;position:absolute;top:0;-webkit-transform:scale(.75);transform:scale(.75);-webkit-transform-origin:0 50%;transform-origin:0 50%;white-space:nowrap;
}

ol.is-style-note_list {
	counter-reset:li;
}

ol.is-style-note_list>li {
	padding-left:1.75em;
}

ol.is-style-note_list>li:before {
	content:"※" counter(li);counter-increment:li;letter-spacing:1px;
}

.is-style-num_circle {
	counter-reset:li;
}

.is-style-num_circle li {
	padding-left:2em;
}

.is-style-num_circle li:before {
	background-color:var(--color_list_num);border-radius:50%;box-shadow:0 0 0 1px var(--color_list_num);box-sizing:content-box;color:#fff;content:counter(li);counter-increment:li;display:block;height:1.8em;left:1px;line-height:1.8;padding:0;position:absolute;text-align:center;top:-.15em;-webkit-transform:scale(.75);transform:scale(.75);-webkit-transform-origin:0 50%;transform-origin:0 50%;width:1.8em;
}

.is-style-num_circle ol {
	counter-reset:li;
}

.is-style-num_circle ol li:before {
	background:none;box-shadow:0 0 0 1px var(--color_list_num);color:var(--color_list_num);opacity:.75;-webkit-transform:scale(.7);transform:scale(.7);
}

.is-style-num_circle ul li {
	padding-left:1.25em;
}

.is-style-num_circle ul li:before {
	content:"";counter-increment:none;-webkit-transform:scale(.15);transform:scale(.15);
}

.is-style-index[reversed]>li:before,
.is-style-note_list[reversed]>li:before,
.is-style-num_circle[reversed]>li:before {
	counter-increment:li -1;
}

.swell-block-button {
	--the-icon-size:1.1em;
}

.swell-block-button[data-align=right] {
	text-align:right;
}

.swell-block-button[data-align=left] {
	text-align:left;
}

.swell-block-button a {
	text-align:center;
}

.swell-block-button .swell-block-button__link[data-has-icon] {
	align-items:center;display:inline-flex;gap:.5em;justify-content:center;
}

.swell-block-button .__icon:not(.-right) {
	margin-left:-.25em;
}

.swell-block-button .__icon.-right {
	margin-right:-.25em;
}

.swell-block-button .__icon {
	font-size:var(--the-icon-size);height:var(--the-icon-size);width:var(--the-icon-size);
}

.swell-block-button .__icon:before {
	display:block;
}

.swell-block-button__img {
	border:none;display:none!important;
}

[data-cell1-fixed].is-style-simple thead) tr>:first-child:not(.-no1) {
	background-color:var(--color_content_bg,#fff)!important;
}

.is-style-simple {
	--tbody-th-color--bg:transparent;--thead-color--txt:curentcolor;--thead-color--bg:transparent;
}

.is-style-simple>table {
	border-right:none!important;box-shadow:none;
}

.is-style-simple td,
.is-style-simple th {
	border-left:none;border-right:none;box-shadow:none;
}

.is-style-simple thead td,
.is-style-simple thead th {
	border-bottom:4px double var(--color_border--table);
}

.is-style-simple thead[style*="--thead-color--bg"] td,
.is-style-simple thead[style*="--thead-color--bg"] th {
	border-bottom:none;
}

.swell-block-accordion__item+.swell-block-accordion__item {
	margin-top:.5em;
}

.swell-block-accordion__title {
	align-items:center;background:var(--color_gray);cursor:pointer;display:flex;font-weight:400;justify-content:space-between;padding:1em;position:relative;
}

.swell-block-accordion__title::-webkit-details-marker {
	display:none;
}

.swell-block-accordion__title .swell-block-accordion__label {
	flex:1 1 auto;font-size:inherit;font-weight:inherit;margin:0;padding:0 1em 0 0;word-break:break-all;
}

.swell-block-accordion__icon {
	flex:0 0 auto;font-size:1.25em;text-align:right;width:1em;
}

.swell-block-accordion__body {
	height:auto;opacity:1;overflow:hidden;padding:1em;transition:padding .25s,height .25s,opacity .25s,visibility .25s;
}

:not(.is-opened)>.swell-block-accordion__body {
	height:0!important;opacity:0;padding-bottom:0!important;padding-top:0!important;
}

.swell-block-accordion.is-style-border .swell-block-accordion__title,
.swell-block-accordion.is-style-simple .swell-block-accordion__title {
	background:none;
}

.swell-block-accordion.is-style-border .swell-block-accordion__body,
.swell-block-accordion.is-style-simple .swell-block-accordion__body {
	border-top:1px dashed var(--color_border);margin:0 .5em;padding:1em .5em;
}

.is-style-border>.swell-block-accordion__item {
	border:1px solid var(--color_border);
}

.is-style-simple>.swell-block-accordion__item {
	border-bottom:1px solid var(--color_border);margin-bottom:0;
}

.is-style-simple>.swell-block-accordion__item:first-child {
	border-top:1px solid var(--color_border);
}

.is-style-simple>.swell-block-accordion__item+.swell-block-accordion__item {
	margin-top:0;
}

.swell-block-accordion.is-style-main .swell-block-accordion__title {
	background-color:var(--color_main);color:#fff;
}

.swell-block-accordion.is-style-main .swell-block-accordion__body {
	border:1px solid var(--color_main);border-top:none;
}

.c-switchIconBtn,
.c-switch_icon_btn {
	display:block;position:relative;
}

.c-switchIconBtn .__icon--closed,
.c-switchIconBtn .__icon--opened,
.c-switchIconBtn .__icon_closed,
.c-switchIconBtn .__icon_opened,
.c-switch_icon_btn .__icon--closed,
.c-switch_icon_btn .__icon--opened,
.c-switch_icon_btn .__icon_closed,
.c-switch_icon_btn .__icon_opened {
	display:block;font-size:inherit;line-height:1;transition:opacity .25s,-webkit-transform .25s;transition:transform .25s,opacity .25s;transition:transform .25s,opacity .25s,-webkit-transform .25s;width:100%;
}

.c-switchIconBtn .__icon--closed,
.c-switchIconBtn .__icon_closed,
.c-switch_icon_btn .__icon--closed,
.c-switch_icon_btn .__icon_closed {
	-webkit-transform:scale(1) rotate(0);transform:scale(1) rotate(0);
}

.c-switchIconBtn .__icon--opened,
.c-switchIconBtn .__icon_opened,
.c-switch_icon_btn .__icon--opened,
.c-switch_icon_btn .__icon_opened {
	left:0;opacity:0;position:absolute;top:0;-webkit-transform:scale(.5) rotate(-180deg);transform:scale(.5) rotate(-180deg);
}

.c-switchIconBtn[data-opened=true]>.__icon--closed,
.c-switchIconBtn[data-opened=true]>.__icon_closed,
.c-switch_icon_btn[data-opened=true]>.__icon--closed,
.c-switch_icon_btn[data-opened=true]>.__icon_closed {
	opacity:0;-webkit-transform:scale(.5) rotate(180deg);transform:scale(.5) rotate(180deg);
}

.c-switchIconBtn[data-opened=true]>.__icon--opened,
.c-switchIconBtn[data-opened=true]>.__icon_opened,
.c-switch_icon_btn[data-opened=true]>.__icon--opened,
.c-switch_icon_btn[data-opened=true]>.__icon_opened {
	opacity:1;-webkit-transform:scale(1) rotate(0);transform:scale(1) rotate(0);
}

.c-balloon {
	align-content:flex-start;display:flex;justify-content:space-between;position:relative;
}

.c-balloon.-bln-right {
	flex-direction:row-reverse;
}

.c-balloon__icon {
	flex-shrink:0;position:relative;text-align:center;width:60px;
}

.c-balloon__iconImg {
	display:block;margin:0 auto;-o-object-fit:cover;object-fit:cover;
}

.c-balloon .c-balloon__iconImg {
	height:60px;width:60px;
}

.-circle>.c-balloon__iconImg {
	border:2px solid #ececec;border-radius:50%;
}

.c-balloon__iconName {
	display:block;font-size:10px;line-height:1;opacity:.8;padding-top:4px;
}

.c-balloon__body {
	align-items:flex-start;display:flex;flex-basis:100%;padding:4px 24px;
}

.c-balloon__body.-thinking {
	padding-top:8px;
}

.-bln-left .c-balloon__body {
	justify-content:flex-start;
}

.-bln-right .c-balloon__body {
	justify-content:flex-end;
}

.c-balloon__text {
	border-radius:8px;color:#333;line-height:1.6;max-width:560px;padding:1em;position:relative;
}

.-border-on .c-balloon__text {
	border-style:solid;border-width:1px;
}

.c-balloon .c-balloon__text>p {
	margin-bottom:0;margin-top:0;
}

.c-balloon__shapes {
	background-color:inherit;border-color:inherit;height:0;position:absolute;top:16px;width:0;z-index:1;
}

.-bln-left .c-balloon__shapes {
	left:0;
}

.-bln-right .c-balloon__shapes {
	right:0;-webkit-transform:rotateY(180deg);transform:rotateY(180deg);
}

.c-balloon__after,
.c-balloon__before {
	border-color:transparent;border-style:solid;display:block;height:0;position:absolute;top:0;width:0;
}

.-speaking .c-balloon__after,
.-speaking .c-balloon__before {
	border-width:8px 10px 8px 0;left:-10px;
}

.-thinking .c-balloon__after,
.-thinking .c-balloon__before {
	background:inherit;border-radius:50%;
}

.-thinking.-border-none .c-balloon__after,
.-thinking.-border-none .c-balloon__before {
	border:none;
}

.-thinking.-border-on .c-balloon__after,
.-thinking.-border-on .c-balloon__before {
	border-color:inherit;border-width:1px;
}

.c-balloon__before {
	z-index:3;
}

.-speaking.-border-on .c-balloon__before {
	left:-8px;
}

.-thinking .c-balloon__before {
	border-radius:50%;height:8px;left:-21px;top:0;width:8px;
}

.c-balloon__after {
	border-right-color:inherit;z-index:2;
}

.-speaking.-border-none .c-balloon__after {
	display:none;
}

.-thinking .c-balloon__after {
	height:12px;left:-16px;top:8px;width:12px;
}

.cap_box {
	--capbox-color:var(--color_main);--capbox-color--bg:unset;--the-icon-size:1.1em;position:relative;
}

.cap_box_ttl {
	align-items:center;background-color:var(--capbox-color);color:#fff;display:flex;gap:.5em;justify-content:center;line-height:1.5;margin-bottom:0!important;padding:.5em;position:relative;text-align:center;z-index:1;
}

.cap_box_ttl i {
	font-size:var(--the-icon-size);
}

.cap_box_ttl i:not(.-right) {
	margin-left:-.25em;
}

.cap_box_ttl i.-right {
	margin-left:.4em;
}

.cap_box_ttl svg {
	height:var(--the-icon-size);width:var(--the-icon-size);
}

.cap_box_ttl svg:not(.-right) {
	margin-left:-.25em;
}

.cap_box_ttl svg.-right {
	margin-right:-.25em;
}

.cap_box_content {
	background-color:var(--capbox-color--bg);border:1px solid var(--capbox-color);clear:both;margin-top:-2px;padding:1.25em;position:relative;z-index:0;
}

.is-style-small_ttl .cap_box_ttl {
	float:left;font-size:.85em;padding:.25em .75em;position:relative;top:1px;
}

.is-style-onborder_ttl2>.cap_box_ttl,
.is-style-onborder_ttl>.cap_box_ttl {
	display:inline-flex;font-size:.85em;left:1em;line-height:1;margin-bottom:0;padding:.5em .75em;position:relative;text-align:center;top:1em;z-index:1;
}

.is-style-onborder_ttl2>.cap_box_content,
.is-style-onborder_ttl>.cap_box_content {
	padding-top:1.5em;
}

.is-style-onborder_ttl>.cap_box_ttl {
	color:var(--capbox-color);
}

.is-style-onborder_ttl>.cap_box_content,
.is-style-onborder_ttl>.cap_box_ttl {
	background-color:var(--color_content_bg)!important;
}

.is-style-shadow.cap_box {
	box-shadow:var(--swl-box_shadow);overflow:hidden;
}

.is-style-shadow>.cap_box_content {
	border:none;
}

.is-style-shadow:not([data-colset]) {
	--capbox-color--bg:#fff;
}

.is-style-shadow:not([data-colset])>.cap_box_content {
	color:#333;
}

.is-style-inner>.cap_box_ttl {
	font-size:.85em;max-width:100%;min-width:2em;overflow:hidden;padding:.25em 1em;position:absolute;white-space:nowrap;
}

.is-style-inner>.cap_box_content:before {
	content:"";display:block;height:1em;visibility:hidden;width:100%;
}

.is-style-intext[data-colset] {
	background-color:var(--capbox-color--bg);
}

.is-style-intext.cap_box {
	border:1px solid var(--capbox-color);padding:1.5em;
}

.is-style-intext>.cap_box_ttl {
	background:none!important;color:var(--capbox-color);justify-content:flex-start;padding:0;text-align:left;
}

.is-style-intext>.cap_box_content {
	background:none!important;border:none;margin-top:1em;padding:0;
}

.swell-block-columns {
	--swl-clmn-mrgn--x:1.5rem;--swl-clmn-mrgn--y:1.5rem;--swl-clmn-pddng:0;
}

.swell-block-columns>.c-scrollHint {
	margin-top:0;
}

.swell-block-columns[data-scrollable] {
	--swl-clmn-mrgn--y:0px;overflow:hidden;
}

.swell-block-columns[data-scrollable]>.swell-block-columns__inner {
	padding-bottom:16px;
}

.swell-block-columns.alignfull {
	margin-left:0;margin-right:0;
}

.swell-block-columns[data-valign=top]>.swell-block-columns__inner {
	align-items:flex-start;
}

.swell-block-columns[data-valign=center]>.swell-block-columns__inner {
	align-items:center;
}

.swell-block-columns[data-valign=bottom]>.swell-block-columns__inner {
	align-items:flex-end;
}

.swell-block-columns__inner {
	display:flex;flex-wrap:wrap;justify-content:flex-start;margin-left:calc(var(--swl-clmn-mrgn--x)*-1);margin-top:0!important;row-gap:var(--swl-clmn-mrgn--y);
}

.swell-block-column {
	--clmn-w:var(--clmn-w--mobile,100%);
}

.swell-block-columns .swell-block-column {
	margin:0 0 0 var(--swl-clmn-mrgn--x);padding:var(--swl-clmn-pddng);width:calc(var(--clmn-w) - var(--swl-clmn-mrgn--x));
}

.swell-block-column[data-valign=top] {
	align-self:flex-start;
}

.swell-block-column[data-valign=center] {
	align-self:center;
}

.swell-block-column[data-valign=bottom] {
	align-self:flex-end;
}

.swell-block-column.is-breadk-all {
	word-break:break-all;
}

.is-style-clmn-shadow[data-scrollable="1"]>.swell-block-columns__inner {
	padding:4px 4px 20px;
}

.is-style-clmn-shadow>.swell-block-columns__inner>.swell-block-column {
	background-color:#fff;box-shadow:var(--swl-box_shadow);color:#333;
}

.is-style-clmn-border>.swell-block-columns__inner>.swell-block-column {
	border:1px solid var(--color_border);
}

.swell-block-columns[data-scrollable="1"]>.swell-block-columns__inner {
	flex-wrap:nowrap;margin-left:0;overflow-x:auto;
}

.swell-block-columns[data-scrollable="1"]>.swell-block-columns__inner>.swell-block-column {
	flex-shrink:0;width:var(--clmn-w);
}

.swell-block-columns[data-scrollable="1"]>.swell-block-columns__inner>.swell-block-column:first-child {
	margin-left:0;
}

.swell-block-dl__dt {
	font-weight:700;
}

.swell-block-dl__dd {
	margin-left:1em;padding:1em;
}

.swell-block-dl__dd+.swell-block-dl__dt {
	margin-top:1em;
}

.is-style-border>.swell-block-dl__dt {
	border-left:1px solid var(--color_main);padding-left:.75em;
}

.is-style-vtabel>.swell-block-dl__dt {
	background-color:var(--color_main);color:#fff;margin-top:-1px!important;padding:.5em 1em;
}

.is-style-vtabel>.swell-block-dl__dd {
	border:1px solid var(--color_border);border-top:none;margin-left:0;
}

.is-style-float.swell-block-dl {
	display:flex;flex-wrap:wrap;line-height:1.5;
}

.is-style-float>.swell-block-dl__dt {
	margin-top:0!important;padding:.25em 2.5em .25em 0;position:relative;width:var(--swl-dt-width);
}

.is-style-float>.swell-block-dl__dt:after {
	background:var(--color_border);bottom:auto;content:"";display:block;height:2px;left:auto;position:absolute;right:1em;top:calc(1em - 1px);width:.5em;
}

.is-style-float>.swell-block-dl__dd {
	margin-left:0;padding:.25em 0;width:calc(100% - var(--swl-dt-width));
}

.is-style-float>.swell-block-dl__dd+.swell-block-dl__dd {
	margin-left:var(--swl-dt-width);
}

.swell-block-faq {
	--swl-faq_icon_radius:0;
}

.swell-block-faq.-icon-rounded {
	--swl-faq_icon_radius:10%;
}

.swell-block-faq.-icon-circle {
	--swl-faq_icon_radius:50%;
}

.swell-block-faq .swell-block-faq__item+.swell-block-faq__item {
	margin-top:1em;
}

.swell-block-faq .faq_q {
	font-size:inherit;font-weight:700;line-height:1.5;margin:0;padding:1em 1em 1em 3em;position:relative;
}

.swell-block-faq .faq_q:before {
	border-radius:var(--swl-faq_icon_radius);bottom:unset;content:"Q";display:block;font-family:Arial,sans-serif;font-weight:400;left:0;line-height:2;position:absolute;text-align:center;top:.75em;width:2em;
}

.swell-block-faq .faq_a {
	line-height:1.5;padding:1em 1em 1em 3em;position:relative;
}

.swell-block-faq .faq_a:before {
	border-radius:var(--swl-faq_icon_radius);content:"A";display:block;font-family:Arial,sans-serif;left:0;line-height:2;position:absolute;text-align:center;top:.75em;width:2em;
}

.is-style-faq-border .swell-block-faq__item {
	padding-left:.5em;padding-right:.5em;
}

.is-style-faq-border .swell-block-faq__item+.swell-block-faq__item {
	border-top:1px solid var(--color_border);padding-top:1em;
}

.is-style-faq-box .swell-block-faq__item {
	border:1px solid var(--color_border);
}

.is-style-faq-box .faq_q {
	border-bottom:1px dashed var(--color_border);
}

.is-style-faq-box .faq_a,
.is-style-faq-box .faq_q,
.is-style-faq-stripe .faq_a,
.is-style-faq-stripe .faq_q {
	padding:1.25em 1em 1.25em 4em;
}

.is-style-faq-box .faq_a:before,
.is-style-faq-box .faq_q:before,
.is-style-faq-stripe .faq_a:before,
.is-style-faq-stripe .faq_q:before {
	left:1em;position:absolute;top:1em;
}

.is-style-faq-stripe .swell-block-faq__item:not(:last-child) {
	margin-bottom:1.5em;
}

.is-style-faq-stripe .faq_q {
	background-color:var(--color_gray);
}

[data-a=col-text] .faq_a:before,
[data-q=col-text] .faq_q:before {
	box-shadow:0 0 0 1px currentcolor;
}

[data-a=fill-text] .faq_a:before,
[data-q=fill-text] .faq_q:before {
	background-color:var(--color_text);color:#fff;
}

[data-a=col-main] .faq_a:before,
[data-q=col-main] .faq_q:before {
	box-shadow:0 0 0 1px currentcolor;color:var(--color_main);
}

[data-a=fill-main] .faq_a:before,
[data-q=fill-main] .faq_q:before {
	background-color:var(--color_main);color:#fff;
}

[data-q=col-custom] .faq_q:before {
	box-shadow:0 0 0 1px currentcolor;color:var(--color_faq_q);
}

[data-a=col-custom] .faq_a:before {
	box-shadow:0 0 0 1px currentcolor;color:var(--color_faq_a);
}

[data-q=fill-custom] .faq_q:before {
	background-color:var(--color_faq_q);color:#fff;
}

[data-a=fill-custom] .faq_a:before {
	background-color:var(--color_faq_a);color:#fff;
}

.swell-block-linkList__icon {
	flex:0 0 auto;font-size:1.25em;
}

.swell-block-linkList__icon.-left {
	margin-left:var(--the-icon-offset);order:0;
}

.swell-block-linkList__icon.-right {
	margin-right:var(--the-icon-offset);order:2;
}

.swell-block-linkList__link {
	align-items:center;color:inherit;display:flex;flex-shrink:0;gap:.25em;line-height:1.4;margin:0 auto;padding:var(--the-list-padding);position:relative;text-decoration:none;
}

.swell-block-linkList__text {
	order:0;
}

.swell-block-linkList {
	--the-color:var(--color_text);--the-radius:100px;--the-fz:1em;--the-gap:0;--the-list-padding:0;--the-icon-offset:0;align-items:center;display:flex;flex-wrap:wrap;font-size:var(--the-fz);gap:var(--the-gap);
}

.swell-block-linkList.swell-block-linkList {
	--swl-list-padding--left:0;list-style:none;
}

.swell-block-linkList .swell-block-linkList__item {
	margin:0 auto;width:100%;
}

.swell-block-linkList.is-style-default {
	--the-color:var(--color_main);--the-gap:.75em;
}

.swell-block-linkList.is-style-default .swell-block-linkList__icon,
.swell-block-linkList.is-style-default .swell-block-linkList__text {
	transition:-webkit-transform .25s;transition:transform .25s;transition:transform .25s,-webkit-transform .25s;
}

.swell-block-linkList.is-style-default .swell-block-linkList__link:hover {
	color:var(--the-color);
}

.swell-block-linkList.is-style-default .swell-block-linkList__text {
	margin-right:auto;
}

.swell-block-linkList.is-style-default .swell-block-linkList__icon {
	color:var(--the-color);
}

.swell-block-linkList.-border {
	--the-list-padding:.6em .5em;--the-gap:0;
}

.swell-block-linkList.-border .swell-block-linkList__item {
	border-bottom:1px solid var(--color_border);
}

.swell-block-linkList.-border .swell-block-linkList__item:first-child {
	border-top:1px solid var(--color_border);
}

.swell-block-linkList.is-style-default:not(.-flex) .swell-block-linkList__link:hover .-left+.swell-block-linkList__text,
.swell-block-linkList.is-style-default:not(.-flex) .swell-block-linkList__link:hover .-right {
	-webkit-transform:translateX(.4em);transform:translateX(.4em);
}

.swell-block-linkList.is-style-button {
	--the-gap:.5em;--the-icon-offset:-.75em;--the-list-padding:.6em 1.5em;
}

.swell-block-linkList.is-style-button.-flex {
	--the-icon-offset:-.15em;--the-list-padding:.25em .6em;
}

.swell-block-linkList.is-style-button .swell-block-linkList__text {
	margin:0 auto;
}

.swell-block-linkList.is-style-button .swell-block-linkList__link {
	background-color:transparent;border:1px solid var(--the-color);border-radius:var(--the-radius);color:var(--the-color);justify-content:center;text-align:center;transition:background-color .25s,color .25s;
}

.swell-block-linkList.-fill .swell-block-linkList__link,
.swell-block-linkList.is-style-button .swell-block-linkList__link:hover {
	background-color:var(--the-color);color:#fff;
}

.swell-block-linkList.-fill .swell-block-linkList__link:hover {
	background-color:transparent;color:var(--the-color);
}

.swell-block-linkList.-flex {
	--the-gap:.5em;
}

.swell-block-linkList.-flex .swell-block-linkList__item {
	margin:0!important;width:auto;
}

.swell-block-linkList.is-style-default.-flex {
	--the-list-padding:0px;--the-gap:.5em .75em;
}

.swell-block-linkList.is-style-default.-flex .swell-block-linkList__link:hover {
	text-decoration:underline;
}

.swell-block-step {
	--swl-step_arrow_color:#dedede;counter-reset:step;
}

.swell-block-step__item {
	margin-bottom:0!important;padding:0 0 3em 64px;position:relative;
}

.swell-block-step__item:before {
	border-left:1px dashed var(--color_border);content:"";display:block;height:100%;left:23px;position:absolute;top:0;width:0;
}

.swell-block-step__item:last-child:before {
	content:none;
}

.swell-block-step__item .swell-block-step__title {
	font-weight:700;margin:0;padding:0;
}

.swell-block-step__number {
	box-sizing:content-box;color:#fff;display:flex;flex-direction:column;height:48px;justify-content:center;left:0;line-height:1;position:absolute;text-align:center;top:0;width:48px;
}

.swell-block-step__number .__label {
	content:attr(data-label);display:block;font-size:10px;padding-bottom:1px;
}

.swell-block-step__number:after {
	content:counter(step);counter-increment:step;display:block;font-size:20px;
}

.swell-block-step__number[data-num]:after {
	content:attr(data-num);
}

.swell-block-step__number[data-hide] .__label,
.swell-block-step__number[data-hide]:after {
	display:none;
}

[data-num-style=circle] .swell-block-step__number,
[data-num-style=circle] .swell-block-step__number .__shape {
	border-radius:50%;
}

[data-num-style=horizontal] .swell-block-step__number {
	align-items:flex-end;flex-direction:row;
}

[data-num-style=horizontal] .swell-block-step__number .__label {
	padding-bottom:4px;padding-right:4px;
}

.swell-block-step__title+.swell-block-step__body {
	margin-top:1em;
}

.swell-block-step:not(.is-style-big)>.swell-block-step__item:last-child {
	padding-bottom:0;
}

.swell-block-step:not(.is-style-big):not(.is-style-small)>.swell-block-step__item>.swell-block-step__title {
	display:flex;flex-direction:column;justify-content:center;min-height:48px;
}

.is-style-big>.swell-block-step__item {
	border-bottom:1px dashed var(--swl-step_arrow_color);padding:2em;
}

.is-style-big>.swell-block-step__item:first-child {
	border-top:1px dashed var(--swl-step_arrow_color);
}

.is-style-big>.swell-block-step__item:before {
	border:12px solid transparent;border-top:12px solid var(--swl-step_arrow_color);display:block;height:0;left:50%;top:100%;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:0;
}

.is-style-big>.swell-block-step__item>.swell-block-step__number {
	border-radius:0;color:inherit;height:auto;margin:0 auto 1em;position:relative;width:auto;
}

.is-style-big>.swell-block-step__item>.swell-block-step__number .__label {
	font-size:12px;
}

.is-style-big>.swell-block-step__item>.swell-block-step__number:after {
	font-size:24px;
}

.is-style-big .swell-block-step__title {
	text-align:center;
}

.is-style-small .swell-block-step__item {
	padding:0 0 2em 24px;
}

.is-style-small .swell-block-step__item:before {
	border-left:2px solid var(--color_border);height:calc(100% - 20px);left:7px;top:18px;
}

.is-style-small .swell-block-step__title {
	margin-top:.25em;text-align:left;
}

.is-style-small .swell-block-step__body {
	margin-top:.5em;
}

.is-style-small .swell-block-step__number {
	align-items:center;color:inherit;flex-direction:row;height:auto;justify-content:flex-start;margin-left:-24px;position:relative;width:auto;
}

.is-style-small .swell-block-step__number .__shape {
	border:2px solid;box-sizing:border-box;height:16px;margin-right:8px;width:16px;
}

.is-style-small .swell-block-step__number .__label {
	font-size:12px;opacity:.8;padding:0 2px 0 0;
}

.is-style-small .swell-block-step__number:after {
	font-size:14px;opacity:.8;
}

.is-style-small [data-hide]+.swell-block-step__title {
	margin-top:-24px;
}

.is-style-simple {
	--the-tab-margin:0 0 1em;
}

.is-style-simple>.c-tabList {
	--the-tab-item-margin:0 0 8px;
}

.is-style-simple>.c-tabList .c-tabList__item:not(:first-child) {
	margin-left:-1px;
}

.is-style-simple>.c-tabList .c-tabList__button {
	background:none;border:1px solid #ddd;box-shadow:none;color:#666;
}

.is-style-simple>.c-tabList .c-tabList__button:hover,
.is-style-simple>.c-tabList .c-tabList__button[aria-selected=true] {
	background:#ddd;color:#333;
}

.is-style-simple>.c-tabList .c-tabList__button:hover:before,
.is-style-simple>.c-tabList .c-tabList__button[aria-selected=true]:before {
	opacity:1;
}

@media (min-width:600px) {
	[class*=is-style-big_icon_] {
		padding:2.5em 2em 2em;
	}
	[class*=is-style-big_icon_]:before {
		left:.75em;
	}
	.c-balloon__icon {
		width:80px;
	}
	.c-balloon .c-balloon__iconImg {
		height:80px;width:80px;
	}
	.c-balloon__body {
		padding:8px 24px;
	}
	.c-balloon__body.-thinking {
		padding-top:16px;
	}
	.cap_box_content {
		padding:1.5em;
	}
	.is-style-onborder_ttl2>.cap_box_content,
.is-style-onborder_ttl>.cap_box_content {
		padding-top:2em;
	}
	.swell-block-column {
		--clmn-w:var(--clmn-w--tab,50%);
	}
}

@media not all and (min-width:960px) {
	.is-style-float.swell-block-dl {
		font-size:.95em;
	}
}

@media (min-width:960px) {
	.swell-block-column {
		--clmn-w:var(--clmn-w--pc,50%);
	}
}

@media not all and (min-width:600px) {
	.c-balloon__text {
		font-size:.95em;
	}
	.-sp-vrtcl.c-balloon {
		flex-wrap:wrap;
	}
	.-sp-vrtcl .c-balloon__body {
		padding:8px 0 0;width:100%;
	}
	.-sp-vrtcl .-speaking .c-balloon__shapes {
		margin:0 22px 0 36px;top:0;-webkit-transform:rotate(90deg);transform:rotate(90deg);
	}
	.-sp-vrtcl .-thinking .c-balloon__shapes {
		margin:0 88px;top:-24px;
	}
	.swell-block-step:not(.is-style-big):not(.is-style-small)>.swell-block-step__item:before {
		display:none;
	}
	.swell-block-step:not(.is-style-big):not(.is-style-small)>.swell-block-step__item>.swell-block-step__body {
		margin-left:-48px;
	}
	.is-style-big>.swell-block-step__item {
		padding:2em 1em;
	}
}

/* ==========================================================================
   7. コアブロック用の橋渡し（シム）

   SWELL のアコーディオンとふきだしは、独自ブロックでないと作れない DOM
   （summary の中の label / icon、ふきだしの尻尾の二重三角）を使っています。
   カスタムブロックを増やさない方針なので、コアブロックの DOM に対して
   同じ見た目になるスタイルをここで当てています。宣言の値は SWELL と同じです。
   ========================================================================== */

/* --------------------------------------------------------------------------
   7-1. アコーディオン（コアの「詳細」ブロック = details 要素）
   SWELL の .swell-block-accordion__title / __body に相当するスタイルを
   summary と、summary 以外の子要素に当てています。
   開閉はブラウザ標準の details に任せるため、JavaScript は不要です。
   -------------------------------------------------------------------------- */

details.swell-block-accordion__item > summary {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1em;
	padding-right: 3em;
	font-weight: normal;
	background: var(--color_gray);
	cursor: pointer;
	list-style: none;
}

details.swell-block-accordion__item > summary::-webkit-details-marker {
	display: none;
}

/* 開閉アイコン（SWELL の c-switchIconBtn のプラス／マイナスに相当） */

details.swell-block-accordion__item > summary::before,
details.swell-block-accordion__item > summary::after {
	position: absolute;
	right: 1em;
	top: 50%;
	width: 12px;
	height: 2px;
	background: currentcolor;
	content: "";
	transition: transform .25s, opacity .25s;
}

details.swell-block-accordion__item > summary::after {
	transform: rotate(90deg);
}

details.swell-block-accordion__item[open] > summary::after {
	transform: rotate(180deg);
	opacity: 0;
}

details.swell-block-accordion__item > :not(summary) {
	margin: 0;
	padding: 1em;
	overflow: hidden;
}

.swell-block-accordion.is-style-simple details.swell-block-accordion__item > :not(summary),
.swell-block-accordion.is-style-border details.swell-block-accordion__item > :not(summary) {
	margin: 0 .5em;
	padding: 1em .5em;
	border-top: 1px dashed var(--color_border);
}

.swell-block-accordion.is-style-main details.swell-block-accordion__item > :not(summary) {
	border: solid 1px var(--color_main);
	border-top: none;
}

@media (prefers-reduced-motion: reduce) {
	details.swell-block-accordion__item > summary::before,
	details.swell-block-accordion__item > summary::after {
		transition: none;
	}
}

/* --------------------------------------------------------------------------
   7-2. ステップの番号
   SWELL は番号の背景色をブロックの設定から inline style で出力します。
   ここでは既定の丸型・メインカラーを当てています。
   -------------------------------------------------------------------------- */

.swell-block-step .swell-block-step__number {
	background-color: var(--color_main);
	border-radius: 50%;
}

.swell-block-step.is-style-big .swell-block-step__number,
.swell-block-step.is-style-small .swell-block-step__number {
	background-color: transparent;
	border-radius: 0;
	color: var(--color_main);
}

/* --------------------------------------------------------------------------
   7-3. ふきだし
   SWELL の .c-balloon は尻尾を二重の三角（枠線用と塗り用）で作る DOM ですが、
   コアブロックでは作れないため、::before / ::after で同じ形を描いています。
   寸法・色・角丸は SWELL と同じ値です。
   -------------------------------------------------------------------------- */

.c-balloon {
	margin: 2em 0;
}

.c-balloon .c-balloon__icon {
	margin: 0;
}

.c-balloon .c-balloon__iconImg,
.c-balloon .c-balloon__icon img {
	display: block;
	width: 60px;
	height: 60px;
	margin: 0 auto;
	object-fit: cover;
	border: 2px solid #ececec;
	border-radius: 50%;
}

.c-balloon .c-balloon__icon figcaption {
	display: block;
	padding-top: 4px;
	font-size: 10px;
	line-height: 1;
	text-align: center;
	opacity: .8;
}

.c-balloon .c-balloon__text {
	position: relative;
	max-width: 560px;
	margin: 0 0 0 24px;
	padding: 1em;
	background: var(--color_gray);
	color: #333;
	line-height: 1.6;
	border-radius: 8px;
}

.c-balloon .c-balloon__text::before {
	position: absolute;
	top: 16px;
	left: -10px;
	width: 0;
	height: 0;
	border: solid transparent;
	border-width: 8px 10px 8px 0;
	border-right-color: var(--color_gray);
	content: "";
}

.c-balloon.-bln-right .c-balloon__text {
	margin: 0 24px 0 0;
	background: var(--color_htag--15);
}

.c-balloon.-bln-right .c-balloon__text::before {
	left: auto;
	right: -10px;
	border-width: 8px 0 8px 10px;
	border-right-color: transparent;
	border-left-color: var(--color_htag--15);
}

/* --------------------------------------------------------------------------
   7-4. キャプションボックスの中身
   SWELL の .cap_box_content と同じ余白をコアのグループにも当てます。
   -------------------------------------------------------------------------- */

.cap_box > .cap_box_ttl {
	margin-bottom: 0;
	padding: .5em 1em;
	font-size: 1em;
}

.cap_box > .cap_box_content > :last-child {
	margin-bottom: 0;
}

/* --------------------------------------------------------------------------
   7-5. 表
   SWELL のテーブル装飾に相当。コアのテーブル、Flexible Table Block、
   HTMLブロックで手書きした表のいずれにも当たります。
   -------------------------------------------------------------------------- */

figure[class*="pt-table"] {
	margin: 2em 0;
	overflow-x: auto;
}

table[class*="pt-table"] {
	margin: 2em 0;
}

[class*="pt-table"] table,
table[class*="pt-table"] {
	width: 100%;
	border-collapse: collapse;
	line-height: 1.8;
}

[class*="pt-table"] th,
[class*="pt-table"] td {
	padding: .75em .95em;
	border: 1px solid var(--color_border);
	text-align: left;
	vertical-align: top;
}

[class*="pt-table"] thead th {
	background: var(--color_main);
	color: #fff;
	font-weight: 700;
	border-color: var(--color_main);
}

[class*="pt-table"] tbody th {
	background: var(--color_gray);
	font-weight: 700;
}

[class*="pt-table"] .pt-cell-accent {
	background: var(--color_htag--15);
	font-weight: 700;
}

[class*="pt-table"] .pt-cell-center {
	text-align: center;
	vertical-align: middle;
}

/* --------------------------------------------------------------------------
   7-6. リンクカード
   -------------------------------------------------------------------------- */

.pt-linkcard {
	margin: 2em 0;
	padding: 1.2em 1.4em;
	background: #fff;
	border: 1px solid var(--color_border);
	border-radius: 4px;
}

.pt-linkcard .pt-linkcard__label {
	margin: 0 0 .4em;
	font-size: .78em;
	font-weight: 700;
	letter-spacing: .12em;
	color: var(--color_main);
}

.pt-linkcard .pt-linkcard__title {
	margin: 0 0 .4em;
	font-size: 1.05em;
	font-weight: 700;
	line-height: 1.6;
}

.pt-linkcard .pt-linkcard__desc {
	margin: 0;
	font-size: .92em;
	line-height: 1.8;
	opacity: .85;
}

/* --------------------------------------------------------------------------
   7-7. 印刷
   -------------------------------------------------------------------------- */

@media print {
	.cap_box,
	.c-balloon,
	.swell-block-step__item,
	.swell-block-faq__item,
	.pt-linkcard {
		break-inside: avoid;
	}

	details.swell-block-accordion__item > :not(summary) {
		display: block;
	}
}

/* --------------------------------------------------------------------------
   7-8. FAQ の Q / A アイコン既定色
   SWELL は親要素の data-q / data-a 属性で色の付け方を切り替えますが、
   コアのグループブロックでは任意の data 属性を出せないため、
   SWELL の「カスタム色で塗りつぶし」に相当する既定を当てています。
   -------------------------------------------------------------------------- */

.swell-block-faq:not([data-q]) .faq_q::before {
	color: #fff;
	background-color: var(--color_faq_q);
}

.swell-block-faq:not([data-a]) .faq_a::before {
	color: #fff;
	background-color: var(--color_faq_a);
}

/* --------------------------------------------------------------------------
   7-9. ステップの「STEP」ラベル
   SWELL は番号ブロック内の span.__label に入れますが、コアの段落ブロックでは
   入れ子が作れないため、段落そのものをラベルとして扱います。
   番号は SWELL と同じく CSS カウンタが ::after で描きます。
   -------------------------------------------------------------------------- */

.swell-block-step .swell-block-step__number {
	margin: 0;
	font-size: 10px;
}