/*
Theme Name: Lightning Child Colors
Theme URI: ★ テーマの公式サイトなどのURL（空欄でも可） ★
Template: lightning
Description: ★ テーマの説明（空欄でも可） ★
Author: ★ テーマ作成者の名前（空欄でも可） ★
Tags: 
Version: 0.1.2
*/

body {
	font-family: 'Noto Sans Japanese','Open Sans', Helvetica Neue, Sans-serif;
}

p:empty {
	display: none;
}
/* --- Post Grid プラグイン 画像が無い場合に表示しない-------------- */
div.layer-media:empty {
	display: none;
}

/* --- タグの直前で改行する -------------- */
.br {
	display:block;
}

/* --- 1文字インデント -------------- */
.indent {
	padding-left:1em;
}
/* --- 画像 CAPTION 指定時のマージン-------------- */
.wp-caption {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

/* --- 角丸-------------- */
div.round_corner {
	border:1px solid #333;
	margin: 15px;
	padding: 1.5em 10px 0px 10px;
	border-radius: 10px 10px 10px 10px ;
}


/* --- スライドショー画像上の文字背景 -------------- */
div.slide-text-container {
	min-width:10% ;          /*  最小横幅の設定  */
	max-width:90% ;          /*  最大横幅の設定  */
	display: inline-block ;
	text-align:center ;
	border-radius: 10px 10px 10px 10px ;
	padding: 5px ;
	background-color:rgba(255,255,255,0.75) ;
}
/* --- スライドショー画像上のナビゲーション prev next -------------- */
a.carousel-control,
.carousel-control.right,
.carousel-control.left {
	width:30px;
	background-image:none;
	/* background-color:rgba(226,108,144,0.75) ; */
	background-color:rgba(255,255,255,0.50) ;
}
.carousel-control.right {
	margin-right:5px;
}
.carousel-control.left {
	margin-left:5px;
}

	a.carousel-control i {
		position:absolute;
		top:50%;
		left:0;					/*          */
		right:0;				/* 中央寄せ */
		margin:0 auto;	/*          */
		z-index:5;
		display:inline-block;
		color: #e26c90;
		text-shadow:none;
	}
/* --- 2カラムコンテンツの幅変更 -------------- */
@media screen and (min-width: 992px) {
	div.col-md-8 {
			width: 73%;
	}
	.col-md-offset-1 {
			margin-left: 2%;
			width: 25%;
	}

}



/* --- 投稿内のグリッド表示 ２カラム-------------- */
div.grid2col {
	display: grid;
	grid-gap: 30px;
	grid-template-columns: repeat(auto-fit, 300px);
	padding-left:20px;
}
	div.grid2col div {
		
	}

/* --- 投稿内のグリッド表示 ３カラム-------------- */
div.grid3col {
	display: grid;
	grid-gap: 30px;
	grid-template-columns: repeat(auto-fit, 190px);
	padding-left:20px;
}
	div.grid3col div {

	}
		/* --- アイコンフォント -------------- */
		div.grid3col div div.font_icon_bk {
			display:block;
			margin:0 auto;
			width:80px;
			height:80px;
			border-radius:50%;
			position:relative;
			border:1px solid #e26c90;
			background-color:#e26c90;
		}
			div.grid3col div div.font_icon_bk span.font_icon_title {
				position:absolute;
				top:38%;
				left:20%;
				color:#fff;
				font-size:28px;
				letter-spacing:0.1em;
			}
			div.grid3col div div.font_icon_bk i.font_icon {
				position:absolute;
				top:8%;
				left:13%;
				color:#fff;
			}
			div.grid3col div p {
				font-size:14px;
			}
/* --- 投稿内のアイコン表示 -------------- */
div.icon_col {
	display: grid;
	grid-gap: 5px;
	grid-template-columns: repeat(auto-fit, 60px);
	padding-left:5px;
}
	div.icon_col div {
	}
		/* --- アイコンフォント -------------- */
		div.icon_col div div.font_icon_bk {
			display:block;
			margin:0 auto;
			width:40px;
			height:40px;
			border-radius:50%;
			position:relative;
			border:1px solid #e26c90;
			background-color:#e26c90;
		}
			div.icon_col div div.font_icon_bk span.font_icon_title {
				position:absolute;
				top:38%;
				left:18%;
				color:#fff;
				font-size:14px;
				letter-spacing:0.1em;
			}
			div.icon_col div div.font_icon_bk i.font_icon {
				position:absolute;
				top:8%;
				left:13%;
				color:#fff;
			}
			div.grid3col div p {
				font-size:14px;
			}

/* --- 投稿内で画像上に重ねる文字 -------------- */
div.overlayimg {
	position: relative;
}
	div.overlayimg div.overlaytext {
		position: absolute;
		top: 10px;
		right: 10px;
		border-radius: 10px 10px 10px 10px;
		padding: 10px;
		background-color: rgba(255,255,255,0.75);
		border: 1px solid #fff;
	}
		div.overlayimg div.overlaytext p {
			margin:0;
		}


@media screen and (max-width: 576px) {
	div.overlayimg div.overlaytext p ,
	div.overlayimg div.overlaytext p * {
		font-size: 2.5vw !important;
		line-height: 1.3em;
		margin:7px 0px 0px 0px;
	}
}

/*
  ---------------------------------------------
   職員紹介
  ---------------------------------------------
*/
div.staff_introduction
{
	
}
div.staff_introduction:after
{
	content: "";
	clear: both;
	display: block;
	padding-bottom:20px;
}
	/* 画像 */
	div.staff_introduction div.img_caption_width_auto {
		float: left;
		width: 200px;
	}
		/* 画像のキャプション調整 */
		div.staff_introduction div.img_caption_width_auto div.wp-caption ,
		div.staff_introduction div.img_caption_width_auto div.mceTemp dl.wp-caption
		{
			width:auto !important;
			margin:0px;
			border-radius: 10px 10px 10px 10px ;
			background-color:#fff;
			border:3px solid  #e26c90;
		}
			div.staff_introduction div.img_caption_width_auto div.wp-caption p.wp-caption-text ,
			div.staff_introduction div.img_caption_width_auto div.mceTemp dl.wp-caption dd.wp-caption-dd
			{
				font-size:20px;
				font-weight:bold;
				color:#333;
			}
		/* 文字 */
		div.staff_introduction div.img_caption_width_auto div.hobby 
		{
			margin:5px;
			font-size:10pt;
			line-height:1.8em;
		}
		div.staff_introduction div.img_caption_width_auto div.hobby * 
		{
			margin:0px;
			font-size:10pt;
			line-height:1.8em;
		}
		div.staff_introduction div.img_caption_width_auto div.hobby ol ,
		div.staff_introduction div.img_caption_width_auto div.hobby ul
		{
			padding: 0px 0px 0px 25px;
		}
	/* 説明 */
	div.staff_introduction div.description {
		margin-left: 210px;
		max-width: 600px;
		min-width: 200px;
	}
		/* 画像のキャプション調整 */
		div.staff_introduction div.description div.wp-caption ,
		div.staff_introduction div.description div.mceTemp dl.wp-caption
		{
			float: left;
			width:100px !important;
			margin:0px;
			border-radius: 10px 10px 10px 10px ;
			background-color:#fff;
			border:2px solid  #e0edff;
		}
			div.staff_introduction div.description  div.wp-caption p.wp-caption-text ,
			div.staff_introduction div.description div.mceTemp dl.wp-caption dd.wp-caption-dd
			{
				font-size:12px;
				font-weight:bold;
				color:#333;
			}
		/* 文字 */
		div.staff_introduction div.description div.opinion
		{
			margin-left: 120px;
			font-size:10pt;
			line-height:1.8em;
		}

@media screen and (max-width: 320px) {
	div.staff_introduction div.img_caption_width_auto {
		float: none;
		width: 100%;
		margin: 0px auto;
	}
	div.staff_introduction div.description {
		float: none;
		margin: 0px auto;
		width: 100%;
		max-width: 100%;
		min-width: 100%;
	}
}

/*
  ---------------------------------------------
   吹き出し
  ---------------------------------------------
*/
.balloon1-left {
	position: relative;
	margin: 1.5em 0 1.5em 15px;
	padding: 7px 10px;
	min-width: 120px;
	color: #555;
	font-size: 16px;
	background: #e0edff;
	border-radius: 10px 10px 10px 10px ;
}

.balloon1-left:before{
	content: "";
	position: absolute;
	top: 50px;
	left: -30px;
	margin-top: -15px;
	border: 15px solid transparent;
	border-right: 15px solid #e0edff;
}

.balloon1-left p {
	margin: 0;
	padding: 0;
}

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

.page-header {
    background-color: #e26c90;
}

h2, .mainSection-title {
		border: 2px solid #e26c90;
		border-radius: 10px 10px 10px 10px ;
		background-color: #fff;
		color: #e26c90;
/*
		background-color: #e26c90;
		color: #fff;
*/
}

/* --- 文字フォントの右マージン ------------------------ */
h2 > i.far ,
h2 > i.fas ,
h2 > i.fab  {
	margin-right:0.5em;
}

/* --- ゴーストボタン ------------------------ */
a.btn-ghostex {
	display: inline-block;
	border: 1px solid #e26c90;
	border-radius: 3px;
	background: #fff;
	text-decoration: none;
	padding:5px 10px 5px 10px ;
	-webkit-transition: 0.8s;
	-moz-transition: 0.8s;
	-o-transition: 0.8s;
	-ms-transition: 0.8s;
	transition: 0.8s;
	font-size:12px;
	line-height: 1em;
	margin: 0px 0px 0px 10px;

}
.btn-ghostex:hover {
	color: #fff;
	background: #e26c90;
}

/* --- ページトップボタン ------------------------ */
.page_top_btn {
	position: fixed;
	right: 2%;
	bottom: 3%;
	z-index: 99999;
	display: none;
	width: 40px;
	height: 38px;
	background: rgba(226,108,144,.8);
	border: 1px solid rgba(255,255,255,.8);

	-moz-border-radius: 60px;
	-webkit-border-radius: 60px;
	border-radius: 50px;

	outline: 0px none;

	box-shadow: 0 0 0 2px #e21452;
	-webkit-box-shadow: 0 0 0 2px #e21452;
	-moz-box-shadow: 0 0 0 2px #e21452;
	-webkit-transition: opacity .3s;
	transition: opacity .3s;
	background-image: url(../images/to-top-btn-icon.svg);

	padding-top: 7px;
	text-align: center;
	text-indent: 0;
	white-space: nowrap;

	overflow: hidden;
	background-size: 50%;
	background-repeat: no-repeat;
	background-position: center;
}
/* --- トップメニュー ------------------------ */
ul.gMenu > li > ul.sub-menu {
	width:auto;
	left:0;
}
ul.gMenu > li > ul.sub-menu li {
	width:auto;
	left:0;
	
}
ul.sub-menu li.menu-item a * {
	text-align:left;
	white-space: nowrap;
	color:#464646;
}
ul.sub-menu > li a:hover * ,
ul.sub-menu > li a:hover .gMenu_description {
	color:#e21452;
}

/*
-------------------------------------------------
  固有レイアウト
-------------------------------------------------
*/
/* --- 一日の流れ タイムテーブル ----------------------------- */

div.timetable
{
	margin: 0;
	padding: 0;
	outline: 0;
	font-size:0; /* display-block横並び時の隙間を除去 */
}
	div.timetable div.tt_caption
	{
		position: relative;
		display: inline-block;
		vertical-align: top;
		width: 50px;		/* 時間表示枠の横幅 */
		margin: 0;
		padding: 0;
		outline: 0px;
		border: none;
		font-size: 16px;	/* display-block横並び時の隙間を除去設定を解除 */
	}
		div.timetable div.tt_caption div.tt_caption_container
		{
			
		}
			div.timetable div.tt_caption div.tt_caption_container div.tt_hour
			{
				position: relative;
				height: 70px;
			}
				div.timetable div.tt_caption div.tt_caption_container div.tt_hour span.tt_text
				{
					position: absolute;
					left: 0px:
					top: 0px;
					margin: 0;
					padding: 0;
					transform: translateY(-50%);	/* 文字を50%上に */
				}
	div.timetable div.tt_content
	{
		position: relative;
		display: inline-block;
		width: calc(100% - 50px);	/* tt_captionの横幅を差引いたサイズを指定 */
		margin: 0;
		padding: 0;
		outline: 0px;
		border: none;
		font-size:0;	/* display-block横並び時の隙間を除去 */
	}
		/* 背景 縦列共通 */
		div.timetable div.tt_content div.tt_cols1 ,
		div.timetable div.tt_content div.tt_cols2 ,
		div.timetable div.tt_content div.tt_cols3 
		{
			position: absolute;
			top: 0px;
			height: 100%;
			width: calc(100% / 3);
			margin: 0;
			padding: 0;
			border:none;
			background-color: #fee;
		}
		/* 背景 縦列1 */
		div.timetable div.tt_content div.tt_cols1
		{
			left: 0;	/* 3分割、最初の位置 */
			background-color: #fee;
		}
		/* 背景 縦列2 */
		div.timetable div.tt_content div.tt_cols2
		{
			left:  calc(100% / 3);	/* 3分割、2番目の位置 */
			background-color: #efe;
		}
		/* 背景 縦列3 */
		div.timetable div.tt_content div.tt_cols3
		{
			left: calc((100% * 2)/ 3);	/* 3分割、3番目の位置 */
			background-color: #eef;
		}
		/* 背景 行のコンテナ */
		div.timetable div.tt_content div.tt_rows
		{
			position: relative;
			display: inline-block;
			width: 100%;
			margin: 0;
			padding: 0;
			border: none;
		}
			/* 背景 行共通 */
			div.timetable div.tt_content div.tt_rows div.tt_row_1st    ,
			div.timetable div.tt_content div.tt_rows div.tt_row_dashed ,
			div.timetable div.tt_content div.tt_rows div.tt_row_solid  
			{
				position: relative;
				height: 70px;
				margin: 0;
				padding: 0;
				border: none;
			}
			/* 背景 先頭行 */
			div.timetable div.tt_content div.tt_rows div.tt_row_1st
			{

			}
			/* 背景 点線行 */
			div.timetable div.tt_content div.tt_rows div.tt_row_dashed
			{
				border-top: 3px dashed #ccc;
			}
			/* 背景 実線行 */
			div.timetable div.tt_content div.tt_rows div.tt_row_solid
			{
				border-top: 3px solid #ccc;
			}
		/*
			------------------------------------------------
			タイムテーブル データ
			------------------------------------------------
		*/
		div.timetable div.tt_content div.tt_details
		{
			position: absolute;
			top: 0px;
			width: 100%;
			margin: 0;
			padding: 0;
			border:none;
			z-index: 10;
			font-size:16px;
		}
			div.timetable div.tt_content div.tt_details div.tt_title
			{
				position: absolute;
				top: 0px;
				width: calc((100% / 3) - 4px);
				height: 70px;
				border:none;
				margin: 30px 0 0 0;
				padding: 0;
				text-align:center;
			}
			div.timetable div.tt_content div.tt_details div.tt_data ,
			div.timetable div.tt_content div.tt_details div.tt_data_wc
			{
				position: absolute;
				border:3px solid rgba(226,108,144,.5);
				border-radius: 10px 10px 10px 10px;
				background-color: rgba(255,255,255,.5);
				margin: 0;
				padding: 3px;
				text-align: left;
			}
			div.timetable div.tt_content div.tt_details div.tt_data_wc
			{
				border:3px solid rgba(108,144,226,.5);
				width: calc(((100% / 3) * (3 / 4)) - 4px);
				height: calc(70px * 0.5 - 2px);
				font-size: 12px;
			}
@media screen and (max-width: 992px)
{
			div.timetable div.tt_content div.tt_details div.tt_data
			{
				font-size:14px;
			}
}
@media screen and (max-width: 576px)
{
			div.timetable div.tt_content div.tt_details div.tt_data
			{
				font-size:12px;
			}
			div.timetable div.tt_content div.tt_details div.tt_data_wc
			{
				font-size: 10px;
				line-height: 1.3em;
				color:blue;
			}
}
@media screen and (max-width: 320px) {
			div.timetable div.tt_content div.tt_details div.tt_data
			{
				padding: 2px;
				font-size:10px;
			}
			div.timetable div.tt_content div.tt_details div.tt_data_wc
			{
				font-size: 8px;
				line-height: 1.3em;
				color:red;
			}
}