@charset "UTF-8";
/**
 * KCH ブロック基本レイアウト
 *
 * 旧CMS（baserCMS + BurgerEditor）時代のページ本文HTML（data-bgb / data-bgt 属性）を
 * そのまま表示するための基本スタイル。BurgerEditor本体のCSSは使わず、表示に必要な分を新たに記述している。
 * 見た目の装飾（色・見出し・ボタンなど）は css/bge_style.css（テーマ側）で定義。
 */

/* ---------------------------------------------------------------
 * フォントアイコン（Font Awesome 4.7 / SIL OFL 1.1）
 * ------------------------------------------------------------- */
@font-face {
	font-family: "FontAwesome";
	src: url("../fonts/fontawesome-webfont.woff2") format("woff2"),
		url("../fonts/fontawesome-webfont.woff") format("woff"),
		url("../fonts/fontawesome-webfont.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
	font-display: block;
}

/* ---------------------------------------------------------------
 * ブロック共通
 * ------------------------------------------------------------- */
[data-bgb] {
	margin: 0 0 1.5em;
}
[data-bgb],
[data-bgb] *,
[data-bgb]::before,
[data-bgb]::after,
[data-bgb] *::before,
[data-bgb] *::after {
	box-sizing: border-box;
}
/* 回り込み解除 */
[data-bgb]::after {
	content: "";
	display: block;
	clear: both;
}

/* ---------------------------------------------------------------
 * 複数列ブロック（.bgt-grid を横に並べる）
 * ------------------------------------------------------------- */
:is([data-bgb="button2"], [data-bgb="download-file2"], [data-bgb="image2"], [data-bgb="image-link2"],
	[data-bgb="image-text2"], [data-bgb="image-link-text2"], [data-bgb="trimmed-image2"],
	[data-bgb="trimmed-image-link2"], [data-bgb="wysiwyg2"], [data-bgb="image-button2"], [data-bgb="card2"]) .bgt-grid {
	float: left;
	width: 50%;
}
:is([data-bgb="button2"], [data-bgb="download-file2"], [data-bgb="image2"], [data-bgb="image-link2"],
	[data-bgb="image-text2"], [data-bgb="image-link-text2"], [data-bgb="trimmed-image2"],
	[data-bgb="trimmed-image-link2"], [data-bgb="wysiwyg2"], [data-bgb="image-button2"], [data-bgb="card2"]) .bgt-grid:nth-child(1) {
	padding-right: 10px;
}
:is([data-bgb="button2"], [data-bgb="download-file2"], [data-bgb="image2"], [data-bgb="image-link2"],
	[data-bgb="image-text2"], [data-bgb="image-link-text2"], [data-bgb="trimmed-image2"],
	[data-bgb="trimmed-image-link2"], [data-bgb="wysiwyg2"], [data-bgb="image-button2"], [data-bgb="card2"]) .bgt-grid:nth-child(2) {
	padding-left: 10px;
}

:is([data-bgb="button3"], [data-bgb="image3"], [data-bgb="image-link3"], [data-bgb="image-text3"],
	[data-bgb="image-link-text3"], [data-bgb="trimmed-image3"], [data-bgb="trimmed-image-link3"], [data-bgb="card3"]) .bgt-grid {
	float: left;
	width: 33.3333%;
	padding: 0 calc(20px / 3);
}
:is([data-bgb="button3"], [data-bgb="image3"], [data-bgb="image-link3"], [data-bgb="image-text3"],
	[data-bgb="image-link-text3"], [data-bgb="trimmed-image3"], [data-bgb="trimmed-image-link3"], [data-bgb="card3"]) .bgt-grid:nth-child(1) {
	padding-left: 0;
	padding-right: 13.3333px;
}
:is([data-bgb="button3"], [data-bgb="image3"], [data-bgb="image-link3"], [data-bgb="image-text3"],
	[data-bgb="image-link-text3"], [data-bgb="trimmed-image3"], [data-bgb="trimmed-image-link3"], [data-bgb="card3"]) .bgt-grid:nth-child(3) {
	padding-left: 13.3333px;
	padding-right: 0;
}

/* テキスト＋画像（左右2分割） */
:is([data-bgb="text-image1"], [data-bgb="text-image2"]) .bgt-grid--first {
	float: left;
	padding-right: 10px;
}
:is([data-bgb="text-image1"], [data-bgb="text-image2"]) .bgt-grid--last {
	float: right;
	padding-left: 10px;
}

/* 列幅の指定（12分割） */
[data-bgb] .bgt-grid1 { width: 8.3333%; }
[data-bgb] .bgt-grid2 { width: 16.6666%; }
[data-bgb] .bgt-grid3 { width: 25%; }
[data-bgb] .bgt-grid4 { width: 33.3333%; }
[data-bgb] .bgt-grid5 { width: 41.6666%; }
[data-bgb] .bgt-grid6 { width: 50%; }
[data-bgb] .bgt-grid7 { width: 58.3333%; }
[data-bgb] .bgt-grid8 { width: 66.6666%; }
[data-bgb] .bgt-grid9 { width: 75%; }
[data-bgb] .bgt-grid10 { width: 83.3333%; }
[data-bgb] .bgt-grid11 { width: 91.6666%; }
[data-bgb] .bgt-grid12 { width: 100%; }

@media screen and (max-width: 768px) {
	[data-bgb] > .bgt-grid,
	[data-bgb] > .bgt-grid--first,
	[data-bgb] > .bgt-grid--last,
	[data-bgb] [class*="bgt-grid"] {
		float: none !important;
		width: 100% !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	/* 縦積み時の間隔（旧BurgerEditorの既定値と同じ詳細度：bge_style.css の 0.75em 指定が優先される。最後の列は0。画像ボタンは列の下マージン10pxで間隔をとるため対象外） */
	[data-bgb]:where(:not([data-bgb^="image-button"])) .bgt-grid [data-bgt] > :last-child:not(:where([data-bge-empty="1"])) {
		margin-bottom: 20px;
	}
	[data-bgb] .bgt-grid:last-child [data-bgt] > :last-child {
		margin-bottom: 0;
	}
}

/* ---------------------------------------------------------------
 * ボタン・ダウンロード
 * ------------------------------------------------------------- */
:is([data-bgb="button"], [data-bgb="button2"], [data-bgb="button3"]) {
	text-align: center;
}
:is([data-bgb="button"], [data-bgb="button2"], [data-bgb="button3"]) [data-bgt="button"] {
	display: inline-block;
	vertical-align: middle;
}
.bgt-btn-container {
	text-align: center;
}
.bgt-btn {
	appearance: button;
}

:is([data-bgb="download-file"], [data-bgb="download-file2"]) {
	text-align: left;
}
:is([data-bgb="download-file"], [data-bgb="download-file2"]) [data-bgt="download-file"] {
	display: inline-block;
	vertical-align: middle;
}
.bgt-link__size::before { content: "("; }
.bgt-link__size::after { content: ")"; }
.bgt-link__icon--after { display: none; }

/* ファイル種類のアイコン */
.bgt-link__icon::after {
	font-family: "FontAwesome";
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	font-size: 1.3em;
	vertical-align: bottom;
	-webkit-font-smoothing: antialiased;
	content: "\f016"; /* ファイル */
}
.bgt-download-file__link[href$="pdf" i] .bgt-link__icon::after { content: "\f1c1"; }
.bgt-download-file__link:is([href$="doc" i], [href$="docx" i]) .bgt-link__icon::after { content: "\f1c2"; }
.bgt-download-file__link:is([href$="xls" i], [href$="xlsx" i], [href$="xlsm" i]) .bgt-link__icon::after { content: "\f1c3"; }
.bgt-download-file__link:is([href$="ppt" i], [href$="pptx" i]) .bgt-link__icon::after { content: "\f1c4"; }
.bgt-download-file__link[href$="zip" i] .bgt-link__icon::after { content: "\f1c6"; }
.bgt-download-file__link:is([href$="jpg" i], [href$="jpeg" i], [href$="png" i], [href$="gif" i]) .bgt-link__icon::after { content: "\f1c5"; }
.bgt-download-file__link:is([href$="mp4" i], [href$="mov" i]) .bgt-link__icon::after { content: "\f1c8"; }

/* ---------------------------------------------------------------
 * 画像
 * ------------------------------------------------------------- */
:is(.bgt-image__link, .bgt-image-link__link, .bgt-trimmed-image__link, .bgt-trimmed-image-link__link) {
	display: block;
	position: relative;
	z-index: 1;
	color: #333;
	text-decoration: none;
}
:is(.bgt-image__link, .bgt-image-link__link, .bgt-trimmed-image__link, .bgt-trimmed-image-link__link) .bgt-link__box {
	margin: 0;
}
:is(.bgt-image__link, .bgt-image-link__link) .bgt-box__image-container {
	background: none;
}
:is(.bgt-image__link, .bgt-image-link__link) .bgt-box__image-container img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}
:is(.bgt-image__link, .bgt-image-link__link, .bgt-trimmed-image__link, .bgt-trimmed-image-link__link) .bgt-box__caption:empty {
	display: none;
}
/* リンク先のない画像・ダミー画像はクリック不可 */
:is(.bgt-image__link, .bgt-trimmed-image__link, .bgt-trimmed-image-link__link)[href*="bg-noimage"],
.bgt-image__link:not([href]) {
	pointer-events: none;
	cursor: default;
}
/* 空の画像枠 */
[data-bge-empty="1"] :is(.bgt-image__link, .bgt-image-link__link) .bgt-box__image-container {
	width: 100%;
	height: 1px;
	visibility: hidden;
}
[data-bge-empty="1"] :is(.bgt-image__link, .bgt-image-link__link) .bgt-box__image-container img {
	display: none;
}
@media screen and (max-width: 768px) {
	[data-bge-empty="1"] .bgt-box__image-container,
	[data-bge-empty="1"] .bgt-box__image {
		display: none;
	}
}
/* 正方形にトリミングして表示する画像 */
:is(.bgt-image__link, .bgt-trimmed-image__link, .bgt-trimmed-image-link__link) .bgt-box__image {
	width: 100%;
	height: 0;
	padding-top: 100%;
	overflow: hidden;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

/* ---------------------------------------------------------------
 * 表・見出し
 * ------------------------------------------------------------- */
.bge-type-table { margin: 0; }
.bge-type-table th { width: 25%; }
.bge-type-table td { width: 75%; }
.bge-title-h2,
.bge-title-h3 { margin-bottom: 0; }

/* ---------------------------------------------------------------
 * YouTube（サムネイル → 再生時に埋め込み）
 * ------------------------------------------------------------- */
.bgt-youtube {
	position: relative;
	width: 100%;
	height: auto;
	padding-top: 56.25%;
}
.bgt-youtube iframe,
.bgt-youtube .bgt-youtube__thumb {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}
.bgt-youtube iframe {
	display: block;
	height: 100%;
	border: none;
}
.bgt-youtube .bgt-youtube__thumb {
	height: auto;
}

/* ---------------------------------------------------------------
 * ブロックオプション（余白・背景・枠線）
 * ------------------------------------------------------------- */
.bgb-opt--mb-large { margin-bottom: 4em !important; }
.bgb-opt--mb-small { margin-bottom: 1em !important; }
.bgb-opt--mb-none { margin-bottom: 0 !important; }
.bgb-opt--bg-gray { background-color: #efefef !important; }
.bgb-opt--bg-blue { background-color: #d8f4ff !important; }
.bgb-opt--bg-pink { background-color: #fee !important; }
.bgb-opt--border-none { border-style: none; border-width: 0 !important; }
.bgb-opt--border-bold { border-style: solid; border-width: 5px !important; }
.bgb-opt--border-thin { border-style: solid; border-width: 1px !important; }
.bgb-opt--border-dotted { border-style: dotted; border-width: 1px !important; }
.bgb-opt--border-tb,
.bgb-opt--border-td { border-left-width: 0 !important; border-right-width: 0 !important; }
.bgb-opt--border-lr { border-top-width: 0 !important; border-bottom-width: 0 !important; }
.bgb-opt--border-trl { border-bottom-width: 0 !important; }
.bgb-opt--border-rbl { border-top-width: 0 !important; }

/* ---------------------------------------------------------------
 * 画像の拡大表示（js/kch.js のライトボックス）
 * ------------------------------------------------------------- */
.kch-lightbox {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, .8);
	cursor: zoom-out;
}
.kch-lightbox img {
	max-width: 80%;
	max-height: 90%;
	background: #fff;
	padding: 5px;
	box-shadow: 0 2px 12px rgba(0, 0, 0, .4);
}
.kch-lightbox figcaption {
	position: absolute;
	bottom: 2%;
	left: 0;
	right: 0;
	color: #fff;
	text-align: center;
}