@charset "utf-8";

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

	Gutenberg・記事本文

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


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

	変数

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

:root {
	/* ★common.css ＝ editor.css★ */
	--main-red: 206,18,37;
	--main-blue: 11,47,139;
	--sub-blue: 35,84,155;
	--gradient: linear-gradient(90deg,rgba(var(--main-red),.75) 0%,rgba(var(--main-blue),.75) 100%);
}

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

	エディター画面のみ

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

/* 全体
------------------------------------------------------------------------------*/

body#tinymce,
.edit-post-visual-editor .editor-styles-wrapper,
.edit-post-visual-editor .editor-styles-wrapper textarea  {
	/* ★common.css ＝ editor.css★ */
	line-height: 1.8;
	font-family: YuGothic,"游ゴシック","メイリオ",Meiryo,sans-serif,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,verdana,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
	font-size: 16px;
	font-weight: 500;
	color: rgba(35,35,0,1);
  	-webkit-text-size-adjust: 100%;
	font-feature-settings: "palt";
}

/* 入力画面幅
------------------------------------------------------------------------------*/

.edit-post-visual-editor__post-title-wrapper,
.block-editor-block-list__layout,
html :where(.wp-block) {
	max-width: 900px;
}

.edit-post-visual-editor__post-title-wrapper,
.block-editor-block-list__layout {
	margin: 0 auto;
	width: 86%;
}


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

.edit-post-visual-editor .editor-styles-wrapper .wp-block[data-align="left"],
.edit-post-visual-editor .editor-styles-wrapper .wp-block[data-align="right"],
.edit-post-visual-editor .editor-styles-wrapper .wp-block[data-align="left"] > *,
.edit-post-visual-editor .editor-styles-wrapper .wp-block[data-align="right"] > * {
	float: none;
	height: auto;
}

.edit-post-visual-editor .editor-styles-wrapper .wp-block[data-align="right"] > .wp-block-image {
	float: right;
	margin: 0;
}

.edit-post-visual-editor .editor-styles-wrapper .wp-block[data-align="right"]:after {
	display: block;
	content: "";
	clear: both;
	height: 0;
}

.edit-post-visual-editor .editor-styles-wrapper .wp-block-table table + figcaption {
	display: none;
}

.edit-post-visual-editor .editor-styles-wrapper .wp-block {
	margin-left: 0;
}



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

	本文

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

/* マージン上下
------------------------------------------------------------------------------*/

/* hx */
.edit-post-visual-editor .editor-styles-wrapper h2,
.edit-post-visual-editor .editor-styles-wrapper h3,
.edit-post-visual-editor .editor-styles-wrapper h4,
.edit-post-visual-editor .editor-styles-wrapper h5,
.edit-post-visual-editor .editor-styles-wrapper h6,
body.contents main h2,
body.contents main h3,
body.contents main h4,
body.contents main h5,
body.contents main h6 {
	margin-top: 50px;
	font-weight: bold;
}

/* h2 */
.edit-post-visual-editor .editor-styles-wrapper h2,
body.contents main h2 {
	margin-bottom: 48px;
}

/* h3・h4・h5・h6 */
.edit-post-visual-editor .editor-styles-wrapper h3,
.edit-post-visual-editor .editor-styles-wrapper h4,
.edit-post-visual-editor .editor-styles-wrapper h5,
.edit-post-visual-editor .editor-styles-wrapper h6,
.edit-post-visual-editor .editor-styles-wrapper table,
body.contents main h3,
body.contents main h4,
body.contents main h5,
body.contents main h6,
body.contents main table {
	margin-bottom: 25px;
}

/* table・ul・ol・dl・figure */
.edit-post-visual-editor .editor-styles-wrapper table,
.edit-post-visual-editor .editor-styles-wrapper ul,
.edit-post-visual-editor .editor-styles-wrapper ol,
.edit-post-visual-editor .editor-styles-wrapper dl,
.edit-post-visual-editor .editor-styles-wrapper figure,
body.contents main table,
body.contents main ul,
body.contents main ol,
body.contents main dl,
body.contents main figure {
	margin-top: 25px;
	margin-bottom: 25px;
}

@media screen and (max-width: 767px) {

/* hx */
.edit-post-visual-editor .editor-styles-wrapper h2,
.edit-post-visual-editor .editor-styles-wrapper h3,
.edit-post-visual-editor .editor-styles-wrapper h4,
.edit-post-visual-editor .editor-styles-wrapper h5,
.edit-post-visual-editor .editor-styles-wrapper h6,
body.contents main h2,
body.contents main h3,
body.contents main h4,
body.contents main h5,
body.contents main h6 {
	margin-top: 7vw;
}

/* h2 */
.edit-post-visual-editor .editor-styles-wrapper h2,
body.contents main h2 {
	margin-bottom: 5vw;
}

/* h3・h4・h5・h6 */
.edit-post-visual-editor .editor-styles-wrapper h3,
.edit-post-visual-editor .editor-styles-wrapper h4,
.edit-post-visual-editor .editor-styles-wrapper h5,
.edit-post-visual-editor .editor-styles-wrapper h6,
body.contents main h3,
body.contents main h4,
body.contents main h5,
body.contents main h6 {
	margin-bottom: 4vw;
}
	
/* table・ul・ol・dl・figure */
.edit-post-visual-editor .editor-styles-wrapper table,
.edit-post-visual-editor .editor-styles-wrapper ul,
.edit-post-visual-editor .editor-styles-wrapper ol,
.edit-post-visual-editor .editor-styles-wrapper dl,
.edit-post-visual-editor .editor-styles-wrapper figure,
body.contents main table,
body.contents main ul,
body.contents main ol,
body.contents main dl,
body.contents main figure {
	margin-top: 4vw;
	margin-bottom: 4vw;
}

}


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

.edit-post-visual-editor .editor-styles-wrapper h1,
.edit-post-visual-editor .editor-styles-wrapper h2,
.edit-post-visual-editor .editor-styles-wrapper h3,
.edit-post-visual-editor .editor-styles-wrapper h4,
.edit-post-visual-editor .editor-styles-wrapper h5,
.edit-post-visual-editor .editor-styles-wrapper h6 {
	line-height: 1.4;
}

/* h1の標準設定 */
.edit-post-visual-editor .editor-styles-wrapper h1 {
	line-height: 1.6;
	font-size: 2em;
	word-break: normal;
	font-weight: bold;
}

/* h2 */
.edit-post-visual-editor .editor-styles-wrapper h2,
body.contents main h2 {
	position: relative;
	padding: .65em 1em;
	font-size: 1.75em;
	color: #FFF;
	z-index: 1;
}

.edit-post-visual-editor .editor-styles-wrapper h2::after,
body.contents main h2::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--gradient);
	border-radius: 4px;
	opacity: .7;
	z-index: -1;
}

/* h3 */
.edit-post-visual-editor .editor-styles-wrapper h3,
body.contents main h3 {
	padding: .25em .5em .25em .75em;
	font-size: 1.25em;
	border-bottom: 1px solid rgba(var(--main-blue),1);
	border-left: 5px solid rgba(var(--main-blue),1);
	color: rgba(var(--main-blue),1)
}

/* h4 */
.edit-post-visual-editor .editor-styles-wrapper h4,
body.contents main h4 {
	position: relative;
	padding-left: 2.125em;
	color: rgba(var(--sub-blue),1)
}

.edit-post-visual-editor .editor-styles-wrapper h4::before,
body.contents main h4::before {
	content: '';
	display: block;
	position: absolute;
	top: .6em;
	left: 0;
	width: 1.5em;
	height: 1px;
	background-color: rgba(var(--sub-blue),1)
}

@media screen and (max-width: 767px) {

.edit-post-visual-editor .editor-styles-wrapper h2,
body.contents main h2 {
	font-size: 4.5vw;
}

}


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

.edit-post-visual-editor .editor-styles-wrapper p,
body.contents main p {
	line-height: 1.8;
}

body.contents main .has-text-align-right {
	text-align: right;
}

body.contents main .has-text-align-center {
	text-align: center;
}

body.contents main .has-text-align-left {
	text-align: left;
}


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

.edit-post-visual-editor .editor-styles-wrapper li,
body.contents main li {
	line-height: 1.8;
}



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

.edit-post-visual-editor .editor-styles-wrapper .wp-block-table thead,
body.contents main .wp-block-table thead{
    border-bottom: none;
}

.edit-post-visual-editor .editor-styles-wrapper th,
.edit-post-visual-editor .editor-styles-wrapper td,
body.contents main th,
body.contents main td {
	padding-top: 1.5em;
	padding-bottom: 1.5em;
	border-top: 1px solid rgba(204,204,204,1);
	border-bottom: 1px solid rgba(204,204,204,1);
}

.edit-post-visual-editor .editor-styles-wrapper thead th,
body.contents main thead th {
	text-align: center;
}

.edit-post-visual-editor .editor-styles-wrapper th,
body.contents main th {
	padding-left: 2.5em;
	padding-right: 2.5em;
	vertical-align: top;
}

.edit-post-visual-editor .editor-styles-wrapper td,
body.contents main td {
	padding-left: 1.5em;
	padding-right: 1.5em;
}

.edit-post-visual-editor .editor-styles-wrapper thead th:first-child,
.edit-post-visual-editor .editor-styles-wrapper tbody td:first-child,
body.contents main tbody tr:first-child td:first-child,
body.contents main tbody tr:first-child th:first-child {
	min-width: 8em;
}


.edit-post-visual-editor .editor-styles-wrapper th,
.edit-post-visual-editor .editor-styles-wrapper tr td:first-of-type,
body.contents main th,
body.contents main tr :first-child:not(p,a,span,sup,sub) {
	background-color: rgba(193,182,154,.1);
	font-weight: bold;
}

@media screen and (max-width: 1000px) {

.edit-post-visual-editor .editor-styles-wrapper th,
body.contents main th {
	padding-left: 1.5em;
	padding-right: 1.5em;
}

}


/* テーブル（管理画面用）
------------------------------------------------------------------------------*/

.edit-post-visual-editor .editor-styles-wrapper .wp-block-table {
	width: 100%;
}

.edit-post-visual-editor .editor-styles-wrapper .wp-block-table .has-fixed-layout {
	table-layout: auto;
}


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

.edit-post-visual-editor .editor-styles-wrapper a:not(a[href^="tel:"]),
body.contents main a:not(a[href^="tel:"]) {
	color: rgba(var(--main-red),1);
}


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

.edit-post-visual-editor .editor-styles-wrapper figure.wp-block,
body.contents main figure.wp-block-image,
body.contents main .wp-block-image figure {
	display: table;
}

.edit-post-visual-editor .editor-styles-wrapper figure.wp-block figcaption,
body.contents main figure.wp-block-image figcaption,
body.contents main .wp-block-image figure figcaption {
	display: table-caption;
	caption-side: bottom;
	text-align: center;
}

body.contents main .wp-block-image .aligncenter,
body.contents main .wp-block-image.aligncenter {
	margin-right: auto;
	margin-left: auto;
}


.edit-post-visual-editor .editor-styles-wrapper .is-layout-flow > .wp-block[data-align="right"] figure,
.edit-post-visual-editor .editor-styles-wrapper .is-layout-flow > .wp-block.alignright,
body.contents main .wp-block-image .alignright,
body.contents main .wp-block-image.alignright {
	float: none;
	margin-right: 0;
	margin-left: auto;
}

.edit-post-visual-editor .editor-styles-wrapper .is-layout-flow > .wp-block[data-align="left"] figure,
.edit-post-visual-editor .editor-styles-wrapper .is-layout-flow > .wp-block.alignleft,
body.contents main .wp-block-image .alignleft,
body.contents main .wp-block-image.alignleft {
	float: none;
	margin-right: auto;
	margin-left: 0;
}

body.contents main figure img {
	height: auto;
}


/* ドロップキャップ打ち消し
------------------------------------------------------------------------------*/

.edit-post-visual-editor .editor-styles-wrapper .has-drop-cap:not(:focus)::first-letter {
	float: none;
	font-size: inherit;
	line-height: inherit;
	font-weight: inherit;
	margin: 0;
	text-transform: none;
	font-style: inherit;
}


/* カラー設定
------------------------------------------------------------------------------*/

body.contents main .has-inline-color.has-important-color,
body.contents main .has-inline-color.has-important-color a,
body.contents main .has-text-color.has-important-color,
body.contents main .has-text-color.has-important-color a,
.edit-post-visual-editor .editor-styles-wrapper .has-inline-color.has-important-color,
.edit-post-visual-editor .editor-styles-wrapper .has-inline-color.has-important-color a,
.edit-post-visual-editor .editor-styles-wrapper .has-text-color.has-important-color,
.edit-post-visual-editor .editor-styles-wrapper .has-text-color.has-important-color a {
	background: none;
	color: rgba(180,0,20,1);
}

body.contents main .has-inline-color,
.edit-post-visual-editor .editor-styles-wrapper .has-inline-color,
.edit-post-visual-editor .editor-styles-wrapper .has-important-background-color,
.edit-post-visual-editor .editor-styles-wrapper .has-background.has-important-background-color  {
	background-color: transparent !important;
}

body.contents main .has-inline-color,
body.contents main .has-background.has-important-background-color,
.edit-post-visual-editor .editor-styles-wrapper .has-inline-color,
.edit-post-visual-editor .editor-styles-wrapper .has-background.has-important-background-color {
	display: inline;
	background:linear-gradient(transparent 70%, rgba(180,0,20,.2) 70%);
	color: inherit;
}

.edit-post-visual-editor .editor-styles-wrapper .has-background {
	padding: 0;
}


/* 本文のスタイルを継承したくないものをリセット
------------------------------------------------------------------------------*/

/* 記事内アーカイブ部分 */
body.contents main .article h2,
body.contents main .category h2,
body.contents main .year h2 {
	margin: 0;
	padding: 0;
	font-size: 1em;
	background: none;
	border: none;
}


/* 埋め込み
------------------------------------------------------------------------------*/

.iframe_content {
	position: relative;
	width: 100%;
	margin: 2em 0;
}

iframe.instagram-media {
	margin: 2em auto !important;
}

.twitter-tweet,
.wp-block-embed.wp-block-embed-twitter,
.iframe_content.youtube,
.iframe_content.facebook {
	margin-right: auto;
	margin-left: auto;
}

.iframe_content.youtube {
	max-width: 900px !important;
}

.iframe_content.youtube iframe,
.iframe_content.gmap iframe {
	width: 100%;
	height: 100%;
}

.fb_iframe_widget_fluid span,
.iframe_content.facebook,
.post .fb_iframe_widget {
	background-color: #FFF;
}

.iframe_content.facebook {
	width: max-content;
}

.fb_iframe_widget_fluid span {
    max-width: 100% !important;
}

.iframe_content.youtube,
.iframe_content.gmap {
     position: relative;
	 aspect-ratio: 16 / 9;
     overflow: hidden;
}

@media screen and (max-width: 900px){

.iframe_content.gmap {
	 aspect-ratio: 4 / 3;
}

}

@media screen and (max-width: 767px){

.iframe_content.gmap {
	 aspect-ratio: 1 / 1;
}

.iframe_content.facebook {
	width: auto;
}

}


/* ギャラリー（管理画面用）
------------------------------------------------------------------------------*/

.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery {
	display: flex !important;
	justify-content: flex-start !important;
	align-items: flex-start !important;
	flex-wrap: wrap !important;
	gap: 0 !important;
	--wp--style--unstable-gallery-gap: 0 !important;
	width: 100% !important;
}

.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery figure {
	flex-grow: 0 !important;
	margin: 0 3% 25px 0 !important;
}

.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery figure figcaption {
	position: relative !important;
	top: auto !important;
	left: auto !important;
	bottom: auto !important;
	background: none !important;
	color: inherit !important;
}

/* 1-2 */
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-default figure,
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-2 figure {	width: 48.5% !important;}
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-2 figure:nth-child(2n) { margin-right: 0 !important;}

/* 3 */
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-3 figure { width: calc(94% / 3) !important;}
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-3 figure:nth-child(3n) { margin-right: 0 !important;}

/* 4 */
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-4 figure { width: calc(91% / 4) !important;}
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-4 figure:nth-child(4n) { margin-right: 0 !important;}

/* 5 */
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-5 figure { width: calc(88% / 5) !important;}
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-5 figure:nth-child(5n) { margin-right: 0 !important;}

/* 6 */
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-6 figure { width: calc(85% / 6) !important;}
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-6 figure:nth-child(6n) { margin-right: 0 !important;}

/* 7 */
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-7 figure { width: calc(82% / 7) !important;}
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-7 figure:nth-child(7n) { margin-right: 0 !important;}

/* 8 */
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-8 figure { width: calc(79% / 8) !important;}
.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-8 figure:nth-child(8n) { margin-right: 0 !important;}

/* 注意事項 */
.components-panel__body:not(.blocks-table-settings) > div.components-base-control.components-range-control::after {
	content: "ギャラリーの追加時に並べたい個数がうまく認識されない場合があります。上部のカラムの数値を増減して調整してください。（写真が横並びになる最大数：8）";
	display: block;
	margin-top: 2em;
	padding: 1.25em;
	background-color: rgba(0,0,0,.05);
	white-apace: pre;
}

@media screen and (max-width: 767px){

.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery.columns-default figure {
	width: 48.5% !important;
}

.edit-post-visual-editor .editor-styles-wrapper .wp-block-gallery figure:nth-child(2n) {
	margin-left: 0 !important;
}

}


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

body.contents main .custom_original_gallery {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: 0;
	margin-bottom: 0;
}

body.contents main .custom_original_gallery figure {
	margin: 0 3% 3% 0;
}

/* 1-2 */
body.contents main .custom_original_gallery.columns-default figure,
body.contents main .custom_original_gallery.columns-2 figure { width: 48.5%;}
body.contents main .custom_original_gallery.columns-default figure:nth-child(2n),
body.contents main .custom_original_gallery.columns-2 figure:nth-child(2n) { margin-right: 0;}

/* 3 */
body.contents main .custom_original_gallery.columns-3 figure { width: calc(94% / 3);}
body.contents main .custom_original_gallery.columns-3 figure:nth-child(3n) { margin-right: 0;}

/* 4 */
body.contents main .custom_original_gallery.columns-4 figure { width: calc(91% / 4);}
body.contents main .custom_original_gallery.columns-4 figure:nth-child(4n) { margin-right: 0;}

/* 5 */
body.contents main .custom_original_gallery.columns-5 figure { width: calc(88% / 5);}
body.contents main .custom_original_gallery.columns-5 figure:nth-child(5n) { margin-right: 0;}

/* 6 */
body.contents main .custom_original_gallery.columns-6 figure { width: calc(85% / 6);}
body.contents main .custom_original_gallery.columns-6 figure:nth-child(6n) { margin-right: 0;}

/* 7 */
body.contents main .custom_original_gallery.columns-7 figure { width: calc(82% / 7);}
body.contents main .custom_original_gallery.columns-7 figure:nth-child(7n) { margin-right: 0;}

/* 8 */
body.contents main .custom_original_gallery.columns-8 figure { width: calc(79% / 8);}
body.contents main .custom_original_gallery.columns-8 figure:nth-child(8n) { margin-right: 0;}


@media screen and (max-width: 767px){

body.contents main .custom_original_gallery.columns-3 figure,
body.contents main .custom_original_gallery.columns-3 figure:nth-child(n),
body.contents main .custom_original_gallery.columns-4 figure,
body.contents main .custom_original_gallery.columns-4 figure:nth-child(n),
body.contents main .custom_original_gallery.columns-5 figure,
body.contents main .custom_original_gallery.columns-5 figure:nth-child(n),
body.contents main .custom_original_gallery.columns-6 figure,
body.contents main .custom_original_gallery.columns-6 figure:nth-child(n),
body.contents main .custom_original_gallery.columns-7 figure,
body.contents main .custom_original_gallery.columns-7 figure:nth-child(n),
body.contents main .custom_original_gallery.columns-8 figure,
body.contents main .custom_original_gallery.columns-8 figure:nth-child(n) {
	 width: 48.5%;
	 margin-right: 3%;
	 margin-bottom: 3%;
}

body.contents #content main .custom_original_gallery figure:nth-child(2n) {
	margin-right: 0;
}

}