/*
Theme Name: Lightning Child (ECベース)
Template: lightning
Description: ecbase.net 用の Lightning 子テーマ。Lightning G3 と VK All in One Expansion Unit を前提に、BizVektor 時代の構成（ヘッダーの電話番号・トップの3PR/新着一覧・フッターの会社情報）を再現する。
Version: 2.6.2
Requires PHP: 7.4
Text Domain: lightning-child
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* ヘッダー上部のキャッチフレーズ帯 ---------------------------------------- */
.site-header-tagline {
	background-color: var(--vk-color-primary);
	color: #fff;
	font-size: 0.75rem;
	line-height: 1.4;
	padding: 0.4em 0;
}
.header_scrolled .site-header-tagline,
.header_scrolled .site-header-contact {
	display: none;
}

/* ヘッダーの問い合わせ情報 ------------------------------------------------ */
.site-header-contact {
	display: none;
	margin-left: auto;
	padding: 0 1.5em;
	text-align: right;
	line-height: 1.4;
}
.site-header-contact__txt,
.site-header-contact__time {
	margin: 0;
	font-size: 0.75rem;
	color: #666;
}
.site-header-contact__tel {
	margin: 0;
	font-size: 1.5rem;
	font-weight: bold;
	color: var(--vk-color-primary);
}
.site-header-contact__tel a {
	color: inherit;
	text-decoration: none;
}
@media (min-width: 992px) {
	/* 電話番号はロゴの右、グローバルナビは下の段に置く（BizVektor と同じ並び） */
	.site-header-container {
		flex-wrap: wrap;
	}
	/* Lightning はロゴを width:100% にしてナビを横に並べるので、電話番号を同じ段に置けるよう内容幅に戻す */
	.site-header-container .site-header-logo:has(+ .site-header-contact) {
		width: auto;
	}
	.site-header-contact {
		display: block;
	}
	.site-header-contact + .global-nav {
		flex-basis: 100%;
		margin-left: 0;
	}
	.site-header-logo img {
		max-height: 75px;
	}
	.site-header {
		border-bottom: 3px solid var(--vk-color-primary);
	}

	/* グローバルナビ：横幅いっぱいに 1 段で並べ、日本語の下に英語表記（キーカラー）を添える。
	 * ホバー中・表示中のページには下にキーカラーの線を出す */
	.site-header-contact + .global-nav {
		border-top: 1px solid #eee;
	}
	.global-nav-list {
		display: flex;
		flex-wrap: nowrap;
		width: 100%;
	}
	.global-nav-list > li {
		flex: 1 1 auto;
		position: relative;
		text-align: center;
	}
	.global-nav-list > li + li::after {
		/* 項目の間の細い区切り線 */
		content: "";
		position: absolute;
		left: 0;
		top: 25%;
		height: 50%;
		border-left: 1px solid #e5e5e5;
	}
	.global-nav-list > li:before {
		/* Lightning のホバー線を、下に引くキーカラーの線として使う */
		top: auto;
		right: auto;
		left: 50%;
		bottom: 0;
		width: 0;
		height: 0;
		border: none;
		border-bottom: 3px solid var(--vk-color-primary);
		transform: translateX(-50%);
		transition: width 0.3s ease-out;
	}
	.global-nav-list > li:hover:before,
	.global-nav-list > li[class*="current"]:before {
		width: 100%;
		height: 0;
	}
	.global-nav-list > li > a {
		padding: 0.9em 0.6em 0.8em;
	}
	.global-nav-name {
		font-size: 15px;
		white-space: nowrap;
	}
	.global-nav-list > li .global-nav-description {
		color: var(--vk-color-primary);
		opacity: 1;
		font-size: 11px;
		letter-spacing: 0.05em;
	}
}
@media (min-width: 992px) and (max-width: 1199.98px) {
	/* コンテナが 930px になる幅でも 1 段に収める（標準の文字サイズだと約 1005px 必要） */
	.global-nav-list > li > a {
		padding-left: 0.4em;
		padding-right: 0.4em;
	}
	.global-nav-name {
		font-size: 14px;
	}
	.global-nav-list > li .global-nav-description {
		font-size: 10px;
		letter-spacing: 0;
	}
}

/* ページタイトル・パンくず（BizVektor Calmly と同じ値） ------------------ */
.page-header {
	background-color: #f5f5f5;
	box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.2);
	border-bottom: 1px solid #e5e5e5;
	min-height: 0;
}
.page-header-inner {
	margin: 25px auto 21px;
}
h1.page-header-title,
.page-header-title {
	font-size: 22px;
	font-weight: normal;
	line-height: 1.1;
	color: #333;
	text-align: left;
	text-shadow: 0 1px #fff;
}
.breadcrumb {
	font-size: 10px;
	color: #999;
}

/* 本文 ---------------------------------------------------------------------
 * 本文は全角スペースの字下げと <br> の手動改行で組まれているため、
 * 1 行の文字数が変わらないよう文字サイズ・行間を BizVektor と同じにする */
.entry-body {
	font-size: 14px;
	line-height: 1.7;
	color: #333;
}
.entry-body p {
	margin: 0 0 20px;
}
/* 見出しは BizVektor Calmly の実測値に合わせる。
 * Lightning 本体の見出し装飾（h4 のグレー背景・角丸など）は、すべて打ち消す */
.entry-body h2,
.entry-body h3,
.entry-body h4,
.entry-body h5 {
	font-weight: bold;
	color: #333;
	background: none;
	border: none;
	border-radius: 0;
	box-shadow: none;
	text-shadow: 0 1px #fff;
}
.entry-body h2 {
	font-size: 18px;
	line-height: 1.14;
	margin: 0 0 25px;
	padding: 20px 15px 15px;
	border-top: 1px solid #e5e5e5;
	border-bottom: 3px solid var(--vk-color-primary);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.entry-body h3 {
	font-size: 18px;
	line-height: 21px;
	margin: 40px 0 35px;
	padding: 10px 10px 7px;
	background-color: #f4f4f4;
	border-left: 3px solid var(--vk-color-primary);
	box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.1);
}
.entry-body h4 {
	font-size: 16px;
	line-height: 21px;
	margin: 30px 0 20px;
	padding: 8px 0 5px;
	color: var(--vk-color-primary);
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
}
.entry-body h5 {
	font-size: 16px;
	line-height: 21px;
	margin: 30px 0 20px;
	padding: 10px 0 5px;
	color: var(--vk-color-primary);
	border-bottom: 1px dotted #eee;
	text-shadow: none;
}
/* 字下げ ---------------------------------------------------------------------
 * 2015 年の本文は全角・半角の空白で字下げしていた。半角の空白はフォントで幅が変わり
 * 行がずれるため、空白の代わりにブロックの「追加 CSS クラス」で字下げする。
 *   is-indent-N : N 文字分下げる
 *   is-hang-1   : 2 行目以降を 1 文字分深くする（「→」「・」の後ろに折り返しを揃える）
 *   is-tight    : 次のブロックとの間を空けない（元は同じ段落内の改行だった行） */
.entry-body .is-indent-1 { padding-left: 1em; }
.entry-body .is-indent-2 { padding-left: 2em; }
.entry-body .is-indent-3 { padding-left: 3em; }
.entry-body .is-indent-4 { padding-left: 4em; }
.entry-body .is-indent-5 { padding-left: 5em; }
.entry-body .is-indent-6 { padding-left: 6em; }
.entry-body .is-indent-7 { padding-left: 7em; }
.entry-body .is-indent-8 { padding-left: 8em; }
.entry-body .is-hang-1 { text-indent: -1em; }
.entry-body .is-tight { margin-bottom: 0; }
.entry-body h3.is-indent-2 { padding-left: calc(10px + 2em); }
/* 「(1) 必ず　P(PLAN)」の下に D(DO)・C(CHECK)・A(ACTION) を揃える（4.375em は「(1) 必ず　」の幅） */
.entry-body h5.is-pdca {
	padding-left: calc(2em + 4.375em);
	text-indent: -4.375em;
}
.entry-body h2::before,
.entry-body h2::after,
.entry-body h3::before,
.entry-body h3::after,
.entry-body h4::before,
.entry-body h4::after,
.entry-body h5::before,
.entry-body h5::after {
	content: none;
}
.entry-body ul {
	margin: 0 0 20px 20px;
	padding: 0;
}
.entry-body ul li {
	list-style: disc;
}
.entry-body ul ul {
	margin-top: 10px;
}
.entry-body ul ul li {
	list-style: circle;
}
.entry-body ol {
	margin: 0 0 20px 25px;
	padding: 0;
}
.entry-body ol li {
	list-style: decimal;
}
.entry-body table {
	width: 100%;
	margin: 10px 0 24px;
	border-collapse: collapse;
	border-top: 1px solid #ccc;
	font-size: 85.7%;
	line-height: 1.417;
}
.entry-body table th,
.entry-body table td {
	border: 1px solid #ccc;
	padding: 10px 15px;
	vertical-align: top;
}
.entry-body table th {
	background-color: #f5f5f5;
}

/* サイドバー（BizVektor Calmly と同じ一覧表示） ----------------------------- */
.sub-section .widget-title {
	font-size: 14px;
	font-weight: bold;
	margin: 0;
	padding: 15px;
	color: #333;
	border-top: 1px solid #e5e5e5;
	border-bottom: 3px solid var(--vk-color-primary);
	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
	text-shadow: 0 1px #fff;
}
.sub-section .widget ul {
	margin: 0;
	padding: 0;
}
.sub-section .widget li {
	list-style: none;
	margin: 0;
	border-bottom: 1px solid #eee;
	font-size: 14px;
	line-height: 1.286;
}
.sub-section .widget li a {
	display: block;
	padding: 13px 10px 11px;
	color: #666;
	text-decoration: none;
}
.sub-section .widget li a:hover,
.sub-section .widget li.current_page_item > a,
.sub-section .widget li.current-cat > a {
	background-color: #f5f5f5;
}
.sub-section .widget li ul li {
	border-bottom: none;
	border-top: 1px solid #eee;
}
.sub-section .widget li ul li a {
	font-size: 75%;
	padding: 11px 10px 9px 22px;
}

/* トップのメイン画像 ------------------------------------------------------- */
.front-main-visual {
	background-color: #f3f3f3;
	padding: 2em 0;
}
.front-main-visual .ltg-slide {
	border: 6px solid #fff;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}

/* トップページ本文下（3PR・新着一覧） ------------------------------------ */
.front-main-widget-area {
	margin-top: 3em;
}
.front-main-widget-area > .widget {
	margin-bottom: 3em;
}
/* 見出しは本文の h2 と同じ */
.front-main-widget-area .widget-title {
	font-size: 18px;
	font-weight: bold;
	line-height: 1.4;
	margin: 0 0 10px;
	padding: 20px 15px 15px;
	border-top: 1px solid #e5e5e5;
	border-bottom: 3px solid var(--vk-color-primary);
	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
}
.front-main-widget-area .widget-title::before,
.front-main-widget-area .widget-title::after {
	content: none;
}
/* 新着一覧（BizVektor のタイトル一覧と同じ） */
.front-main-widget-area .veu_postList .postList {
	margin: 10px 0 5px;
	padding: 0;
}
.front-main-widget-area .veu_postList .postList li {
	list-style: none;
	margin: 0;
	padding: 12px 0;
	border-bottom: 1px dotted #ccc;
	font-size: 14px;
}
.front-main-widget-area .veu_postList .postList_date {
	margin-right: 8px;
	color: #d00;
}
.front-main-widget-area .veu_postList .postList_terms a {
	margin-right: 4px;
	padding: 1px 5px 2px;
	font-size: 10px;
	line-height: 14px;
	text-decoration: none;
	color: #666 !important; /* ExUnit がカテゴリー色をインラインで指定するため */
	background-color: #efefef !important;
	border: 1px solid #e5e5e5 !important;
}
.front-main-widget-area .veu_postList .postList_more {
	text-align: right;
}
.front-main-widget-area .veu_postList .postList_more a {
	display: inline-block;
	margin-top: 15px;
	padding: 5px 15px 5px 11px;
	font-size: 11px;
	line-height: 1.05;
	color: #333;
	text-decoration: none;
	background-color: #efefef;
	border-left: 4px solid var(--vk-color-primary);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}
.front-main-widget-area .veu_postList .postList_more a:hover {
	color: #fff;
	background-color: #666;
}

/* フッターの会社情報 ------------------------------------------------------ */
.site-footer .widget_text .textwidget {
	line-height: 1.8;
}
