@charset "utf-8";
/*
Theme Name: Lightning Child
Theme URI:
Template: lightning
Description:
Author:
Tags:
Version: 0.0.0
*/

body {color:#3C3C3C;}/*ページ全体の文字色*/

/*ヘッダー右エリア*/
.aisy-header-text { font-size:.8em; text-align:right;}
.aisy-header-text span { font-size:1.1em;} 

/*--------------トップページ----------------*/

/*トップページの角丸2の値を調整*/
body.home .wp-block-image.is-style-vk-image-rounded figure.aligncenter img {border-radius:2rem;}

/*コンテンツページの見出しスタイルをリセットしトップページのみのスタイルを設定*/
body.home h2 {font-size:1.4rem; color:#00A6BC; margin-bottom:0.25em;border:none; padding-top:inherit;}
body.home h2::after { border-top: none;}
body.home h2 a {color:#3FA9F5; margin-bottom:0.25em;}
body.home h2 a:hover { color:#0130B1;}

body.home h3{ background-color:none; padding:inherit; border-radius:0; font-size:inherit; font-weight:inherit;}

.aisy-top-copy {text-align:center; font-size:1.3rem; font-weight:500; color:#696969; line-height:2em; margin-bottom:3.5em; padding-top:1em;}

.aisy-btn-border {border:1px solid #BDCCD4; border-radius:.5rem;}


/*-----------------デザイン要素カスタマイズ----------------------*/


/* 見出し　コンテンツページ共通　（投稿画面で装飾は無しにすること） */

.entry-body h2{ position: relative; border-top: 3px solid #D1D1D1; padding-top:.25em;}
.entry-body h2::after {position: absolute; content: " "; display: block; border-top: solid 3px #7AC943; top: -3px; width:15%;}

.entry-body h3{ background-color:#FCF8F2; padding:.25em .75em; border: 1px solid #F7DBA8; border-radius:6px; font-size:1.2rem; font-weight:600;}

/*表の枠線　エディタで枠線を選択しておくこと*/
.is-style-vk-table-border th{ border:1px solid #000!important; background-color:#DCEFF5;}
.is-style-vk-table-border td{ border:1px solid #383838!important;}

/*pdfダウンロードボタン　文字を左*/
.aisy-t-left a.btn {text-align:left!important;}
.fa-file-pdf{font-size:1.2em; color:#DA493E}


/*固定ページ：カテゴリを与えた場合にページ下のコンテンツを非表示にする*/
body.page .entry-footer{display:none;}

/*　固定ページ：カテゴリを与えた固定ページを投稿リスト表示　カードタイプをボタン化　*/
.aisy-kanren .card-body {background-color:#54C3DA; text-align:center; padding:0;}
.aisy-kanren .card-body a { font-size:1rem; color:#fff; padding:.75em .5em; display:block;}
.aisy-kanren .card-body a:hover { background-color:#0292FA; color:#fff; display:block; }



/*固定ページ：ニュースブロックの見出し*/
.vk_outer_container h2 {border:none; text-align:center;font-size:1.2rem;}
.vk_outer_container h2::after { border-top: none;}



/* 投稿ページ　次の投稿前の投稿ブロック　デザイン変更　高さ・オーバーレイの色　*/

/*.vk_posts,
.next-prev {height:8em;}*/

.vk_post_imgOuter {height:8em;}

/*画像の高さ

.vk_post_imgOuter {
	height:8em;
    position: relative;
    background-size: cover;
    background-position: center 80%;
    border-bottom: 1px solid #fff;
}*/

/*タイトルの色*/
.card-intext .card-intext-inner .vk_post_body .vk_post_title {color:#000!important;}
.card-intext .card-intext-inner .vk_post_body div, .card-intext .card-intext-inner .vk_post_body p  {color:#000!important;}


.card-intext .card-intext-inner .vk_post_body {
    position: absolute;
    display: block;
    overflow: hidden;
    width: 100%;
    bottom: 0;
    height: calc(15px + var(--vk-line-height-low) + 15px);
    transition:all .3s ease-out;
    background-color: rgba(255,255,255,.7);
    z-index: 100;

}






/*フッター上部のボーダーを非表示*/
.site-footer  {border-top:none;}



.aisy-footer-bn-box {
  width: 100%;
  display: flex;
	 /*justify-content: space-between;*/
	justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

.aisy-footer-bn-box figure { }

.aisy-footer-bn-box img {max-width:220px; height:auto; }

.aisy-footer-bn-box .wp-block-image {margin:0 0 .25em;}

/*バナー　行あたり4個入らない時のズレをなくす*/

.aisy-footer-bn-box　.item {
 width: 220px;
 text-align: center;
 padding: 10% 0;
}


.aisy-footer-bn-box::after {
display: block;
content:"";
width: 220px;
}

.aisy-footer-bn-box::before {
    content: "";
    display: block;
    width: 220px;   /*.boxに指定したwidthと同じ幅を指定する*/
    height: 0;
    order: 1;  /*疑似要素beforeの順番を必ず指定する*/
}

/* ==================================================
   ヘッダー内 Instagram・QRコード
================================================== */

.aishiyo-header-instagram {
	z-index: 20;
	flex: 0 0 auto;
	line-height: 1;
}

.aishiyo-header-instagram-link {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 4px;
	text-decoration: none;
	border-radius: 6px;
	transition:
		opacity 0.2s ease,
		transform 0.2s ease;
}

.aishiyo-header-instagram-link:hover {
/*	opacity: 0.8;
	transform: translateY(-1px);*/
	transform: scale(1.1);
}

.aishiyo-header-instagram-link:focus-visible {
	outline: 3px solid #f5aa35;
	outline-offset: 3px;
}

.aishiyo-header-instagram-icon,
.aishiyo-header-instagram-qr {
	display: block;
	max-width: none;
	height: auto;
	margin: 0;
}

.aishiyo-header-instagram-icon {
	width: 46px;
}

.aishiyo-header-instagram-qr {
	width: 46px;
}


/* ==================================================
   広いPC：ロゴ・Instagram・住所の3列
   Lightning旧ヘッダー型
================================================== */

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

	.siteHeader .navbar-header {
		display: grid;
		grid-template-columns:
			minmax(0, auto)
			minmax(120px, 1fr)
			minmax(0, auto);
		align-items: center;
		column-gap: 24px;

		width: 100%;
		position: relative;
	}

	.siteHeader .siteHeader_logo {
		float: none;
		margin: 0;
		grid-column: 1;
	}

	.siteHeader .aishiyo-header-instagram {
		position: static;
		grid-column: 2;
		justify-self: center;
		transform: none;
	}
}


/* ==================================================
   広いPC：Lightning G3の場合
   ロゴと右側情報の中間へ配置
================================================== */

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

	#site-header-container {
		position: relative;
	}

	#site-header-container > .aishiyo-header-instagram {
		position: absolute;
		top: 30%;
		left: 50%;
		right: auto;
		transform: translate(-50%, -50%);
	}
	
		.aishiyo-header-instagram-link {
		position: relative;
		padding-top: 20px;
	}

	.aishiyo-header-instagram-link::before {
		content: "＼Instagram始めました！／";
		position: absolute;
		top: 1px;
		left: 50%;
		transform: translateX(-50%);

		color: #404040;
		font-size: 13px;
		font-weight: bold;
		line-height: 1;
		white-space: nowrap;
	}

}


/* ==================================================
   狭いPC・タブレット
   ロゴの右側にInstagram＋QR
================================================== */

@media screen and (min-width: 768px) and (max-width: 991.98px) {

	.siteHeader .navbar-header,
	#site-header-container {
		position: relative;
	}

	.aishiyo-header-instagram {
		position: absolute;
		top: 50%;
		left: calc(50% + 165px);
		right: auto;
		transform: translateY(-50%);
	}

	.aishiyo-header-instagram-icon {
		width: 40px;
	}

	.aishiyo-header-instagram-qr {
		width: 40px;
	}

	.aishiyo-header-instagram-link {
		position: relative;
		padding-top: 10px;
	}

	.aishiyo-header-instagram-link::before {
		content: "＼Instagram始めました！／";
		position: absolute;
		top: -3px;
		left: auto;
		right: 0;
		transform: none;
		z-index: 2;

		color: #404040;
		font-size: 10px;
		font-weight: bold;
		line-height: 1;
		white-space: nowrap;
		pointer-events: none;
	}
}


/* ==================================================
   スマートフォン
   QRコードを消してInstagramアイコンのみ
================================================== */

@media screen and (max-width: 767.98px) {
	.site-header-logo img
	{
		width: auto;
		max-height: 38px;
	}
	
	.siteHeader .navbar-header,
	#site-header-container {
		position: relative;
	}

	.aishiyo-header-instagram {
		position: absolute;
		top: 50%;
		left: auto;
		right: 12px;
		transform: translateY(-50%);
	}

	.aishiyo-header-instagram-qr {
		display: none;
	}

	.aishiyo-header-instagram-icon {
		width: 32px;
	}

	.aishiyo-header-instagram-link {
		gap: 0;
		padding: 3px;
	}
	
		.aishiyo-header-instagram-link {
		position: relative;
		padding-top: 10px;
	}

	.aishiyo-header-instagram-link::before {
		content: "＼Instagram始めました！／";
		position: absolute;
		top: 0px;
		left: auto;
		right: 0;
		transform: none;
		z-index: 2;

		color: #404040;
		font-size: 9px;
		font-weight: bold;
		line-height: 1;
		white-space: nowrap;
		pointer-events: none;
	}
}
