@charset 'UTF-8';

/*
 * front-editer-style-both.css
 * Version: 1.0.0
 * @package WordPress 5.0 or Gutenberg Plugin 4.1
 * License: GPLv2 or later
*/

:root {
	--text-default-color: #3e3a39;
	--text-black: #3e3a39;
	--text-white: #fff;
	--link-color: #4169e1;
	--black-max: #000;
	--white-bg: #fff;
	--white-alpha09: rgba( 255,255,255,0.9 );
	--gray-mostlight: #eee;
	--gray-white: #f5f5f5;
	--key-main-color: #666;
	--key-sub01-color: #ccc;
	--font-mincho: 'Frank Ruhl Libre', "YakuHanMPs", Frank Ruhl Libre, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	--font-gothic: "YakuHanJP",-apple-system,BlinkMacSystemFont,"Yu Gothic","YuGothic","游ゴシック体","游ゴシック","Hiragino Kaku Gothic ProN","Hiragino Sans", Meiryo, sans-serif;
}

/** ============================================================================
 * 基本HTMLタグ
============================================================================ **/

/* 見出し */

/*h1,
html :where(.editor-styles-wrapper) h1 { font-size: 2em; }*/

h2,
html :where(.editor-styles-wrapper) h2 { font-size: 1.675em; }

h3,
html :where(.editor-styles-wrapper) h3 { font-size: 1.375em; }

h4,
html :where(.editor-styles-wrapper) h4 { font-size: 1.25em; }

h5,
html :where(.editor-styles-wrapper) h5 { font-size: 1.125em; }

h6,
html :where(.editor-styles-wrapper) h6 { font-size: 1.0625em; }

h2 { clear: both; }

abbr,
acronym {
	cursor: help;
}

address {
	font-style: normal;
}

blockquote,
.wp-block-quote {
	font-style: italic;
	margin: 1em;
	padding: 1.5em 2.5em;
	position: relative;
	quotes: '' '';
	border: none;
	border-radius: 0.5em;
}

blockquote::before,
blockquote::after {
	color: #999;
	font-family: serif;
	font-size: 3.4em;
	line-height: 1;
	position: absolute;
}


blockquote::before {
	content: '“';
	top: 0.1em;
	left: 0.1em;
}

blockquote::after {
	content: '”';
	right: 0.35em;
	bottom: -0.4em;
}

blockquote cite {
	font-weight: 700;
	font-style: normal;
	margin-top: 0.5em;
	display: block;
}

em,
dt {
	font-weight: 700;
}

p > code,
li > code,
kbd {
	padding: 0 0.3em;
}

kbd {
	border: 1px solid;
}

pre > code { font-size: 0.875em; }


q {
	padding: 0 0.5em;
}

/* コードブロック */

pre.wp-block-code {
	padding: 1.5em 4%;
}
/* 整形済みテキストブロック */

pre.wp-block-preformatted { font-family: inherit; }


/* 詩ブロック */

pre.wp-block-verse {
	line-height: 2.4em;
	letter-spacing: 2px;
	padding: 0 4%;
}

/* 画像キャプション */

.wp-block-image.text-right figcaption { text-align: right; }

.wp-block-image.text-left figcaption { text-align: left; }

/** ============================================================================
 * 共通クラス
============================================================================ **/

/* 背景色設定関連
----------------------------- */

h1.has-background,
h2.has-background,
h3.has-background,
h4.has-background,
h5.has-background,
h6.has-background { padding: 0 0.5em; }


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

.is-style-stripes th { background: none; }

.wp-block-table thead,
.wp-block-table tfoot {
	border-style: solid;
	border-width: 2px 0;
}

.wp-block-table tr td:first-child,
.wp-block-table tr th:first-child {
	border-left: 0 solid transparent;
}

.wp-block-table tr td:last-child,
.wp-block-table tr th:last-child {
	border-right: 0 solid transparent;
}

/** ----------------------------------------------------------
 * テキスト関連クラス
---------------------------------------------------------- **/

/* フォントスタイル
----------------------------- */

.text-center { text-align: center; }

.text-right { text-align: right; }

.text-bold { font-weight: 700; }

.text-normal { font-weight: 400; }

.text-mincho { font-family: var(--font-mincho) }

.text-gothic { font-family: var(--font-gothic)}

/* webフォント
----------------------------- */

.wbf-OS { font-family: 'Open Sans', sans-serif; }

.wbf-Cinzel { font-family: 'Cinzel', serif; }

.wbf-Frl { font-family: 'Frank Ruhl Libre', serif; }


/* テキストカラー
----------------------------- */

.text-black { color: var(--text-black); }

.text-red { color: #f00; }

.text-yellow { color: #ff0; }

.text-shadow { text-shadow: 1px 1px 1px rgba( 0,0,0,0.3 ); }

/* 頭出しインデント
----------------------------- */

.indent_-05 { text-indent: -0.5em; }

.indent_-1 {
	padding-left: 1em !important;
	text-indent: -1em;
}


/* テキストアンダーライン
-------------------------------*/

.uline-s,
.uline-d { padding-bottom: 0.3em; }

.uline-s { border-bottom: 1px solid; }

.uline-d { border-bottom: 1px dotted; }

/* マーカー */

.marker-y { background: linear-gradient( transparent 80% ,rgba(255,230,5,0.8) 0%); }

.marker-wb { background: linear-gradient( transparent 80% ,rgba(126,206,244,0.8) 0%); }


/* spanブロック
-------------------------------*/

.sp-block,
.mb-sp-block  { display: block; }

@media screen and ( min-width: 641px )  {

	.mb-sp-block { display: inline; }

	.pc-sp-block { display: block; }
}


/* サイズ相対指定
----------------------------- */

.text06 { font-size: 0.6em !important; }

.text07 { font-size: 0.7em !important; }

.text08 { font-size: 0.8em !important; }

.text09 { font-size: 0.9em !important; }

.text110 { font-size: 1.1em !important; }

.text120 { font-size: 1.2em !important; }

.text130 { font-size: 1.3em !important; }

.text140 { font-size: 1.4em !important; }

.text150 { font-size: 1.5em !important; }

.text160 { font-size: 1.6em !important; }

.text180 { font-size: 1.8em !important; }

.text200 { font-size: 2em !important; }


/* has-background 関係
----------------------------- */

h2.has-background,
h3.has-background,
h4.has-background,
h5.has-background,
h6.has-background,
p.has-background,
dt.has-background {
	padding: 0 0.5em;
}



/* ドロップキャプス
----------------------------- */

.has-drop-cap:not(:focus)::first-letter {
	color: var( --text-black );
	font-size: 3.2em;
	font-weight: normal;
	font-style: normal;
	letter-spacing: 0;
	line-height: 0.68;
	text-transform: uppercase;
	margin: 0.4rem 0 0 0;
	float: left;
}

.has-drop-cap:not(:focus)::after {
	content: '';
	padding-top: 14px;
	display: table;
	clear: both;
}

/** ----------------------------------------------------------
 * リスト関連
---------------------------------------------------------- **/

/* リストスタイルクリア
----------------------------- */

.ul-none,
.ol-none {
	list-style: none;
	padding: 0;
	margin-top: 0;
	margin-bottom: 0;
}

.style-none,
.editor-styles-wrapper .style-none {
	list-style: none;
	padding-left: 0.5em;
}

/* スタイル再設定
----------------------------- */

ul.ul-disc,
ol.ol-decimal { padding-left: 2.5em; }

ul.ul-disc,
.ul-disc  ul { list-style: disc; }

ol.ol-decimal,
.ol-decimal ol { list-style: decimal; }


/* olリナンバリング
----------------------------- */

.renumber-list {
	list-style: none;
	padding-left: 0;
}

.renumber-list > li { counter-increment: re-number; }

.renumber-list > li::before {
	content: counter(re-number);
	display: inline-block;
}

.renumber-normal.renumber-list > li::before { content: counter(re-number)'.'; }

/* サークル リナンバリング */

.renumber-circle.renumber-list > li { padding-left: 1.5em; }

.renumber-circle.renumber-list > li::before {
	font-size: 0.75em;
	text-align: center;
	letter-spacing: 0;
	line-height: 1.2;
	border: 1px solid;
	width: 1.5em;
	height: 1.5em;
	border-radius: 50%;
	vertical-align: 0.125em;
	margin: 0 0.2em 0 -1.5em;
}

/* インラインul
----------------------------- */

.inline-list { padding-left: 0; }

.inline-list > li {
	display: inline-block;
	margin-right: 0.5em;
}

/* インラインフロー */
.inline-flow.inline-list { padding-left: 0.8em; }

.inline-flow > li {
	margin: 0.3em 1em 0.3em 0;
	position: relative;
}

.inline-flow > li:first-child { margin-left: -0.8em; }

.inline-flow > li:not(:first-child)::before {
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0.4em 0.5em;
	border-top-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	position: absolute;
	top: 50%;
	left: -0.8em;
	-ms-transform: translateX(0) translateY(-50%);
	transform: translate(0,-50%);
	opacity: 0.4;
}

/* 注釈リスト
----------------------------- */

.note-list,
.editor-styles-wrapper .note-list {
	text-align: left;
	list-style: none;
	padding: 0;
}

.note-list > li {
	text-indent: -1em;
	padding-left: 1em;
}

/* リストマージン
----------------------------- */

.li-mg05 > li:not(:last-child) { margin-bottom: 0.5em; }

.li-mg1 > li:not(:last-child) { margin-bottom: 1em; }

.li-mg15 > li:not(:last-child) { margin-bottom: 1.5em; }

.li-mg2 > li:not(:last-child) { margin-bottom: 2em; }


/** ----------------------------------------------------------
 * レイアウト装飾
---------------------------------------------------------- **/

/* clearfix
----------------------------- */

.clearfix::before,
.clearfix::after {
	content: '';
	display: table;
	clear: both;
}

/* ボックス、フレーム設定
----------------------------- */

.box,
.fr-box,
.fr-box-r { padding: 1em; }

/* フレーム */

.fr-box,
.fr-box-r,
.frame {
	border-style: solid;
	border-width: 1px;
}

.fr-box-r { border-radius: 8px; }

.frame img { margin: 0; }

/* ボックスシャドウ */

.box-shodow { box-shadow: 0 1px 3px rgba( 0,0,0,0.3 ); }


/* 背景・フレームカラー設定
----------------------------- */

/* 背景 */

.bg-lbeige { background: #f3eee5; }

.bg-beige { background: #f5f4e6; }

/* フレーム */

.fr-lgray { border-color: #ccc; }


/* ブロック背景
----------------------------- */


/** ----------------------------------------------------------
 * マージン・パディング関連
---------------------------------------------------------- **/

/* マージン
----------------------------- */

.mg-t0 { margin-top: 0 !important; }

.mg-t8 { margin-top: 8px !important; }

.mg-t16 { margin-top: 16px !important; }

.mg-t32 { margin-top: 32px !important; }

.mg-t40 { margin-top: 40px !important; }

.mg-t80 { margin-top: 80px !important; }

.mg-b0 { margin-bottom: 0 !important; }

.mg-b8 { margin-bottom: 8px !important; }

.mg-b16 { margin-bottom: 16px !important; }

.mg-b32 { margin-bottom: 32px !important; }

.mg-b40 { margin-bottom: 40px !important; }

.mg-b56 { margin-bottom: 56px !important; }

.mg-b80 { margin-bottom: 80px !important; }

.mg-tb0 {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

.mg-tb16 {
	margin-top: 16px !important;
	margin-bottom: 16px !important;
}

.mg-tb32 {
	margin-top: 32px !important;
	margin-bottom: 32px !important;
}

.mg-tb40 {
	margin-top: 40px !important;
	margin-bottom: 40px !important;
}

.mg-tb80 {
	margin-top: 80px !important;
	margin-bottom: 80px !important;
}

.mg-l0 { margin-left: 0 !important; }

/* パディング
----------------------------- */

.pd-tb0 {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.pd-tb16 {
	padding-top: 16px !important;
	padding-bottom: 16px !important;
}

.pd-tb32 {
	padding-top: 32px !important;
	padding-bottom: 32px !important;
}


/** ----------------------------------------------------------
 * img 関係ギャラリー
---------------------------------------------------------- **/

/* ギャラリー 関係
----------------------------- */

/* マージン0 */
.gallery-mg0.wp-block-gallery figure.wp-block-image { margin: 0 !important; }
