/* ===============================================
   ブレークポイント（Lightning と同じ4段階）
   スマホ       : @media (max-width: 575.98px)
   タブレット縦 : @media (max-width: 767.98px)
   タブレット横 : @media (max-width: 991.98px)  ※ハンバーガーメニュー
   PC           : @media (min-width: 992px)
   広いPC       : @media (min-width: 1200px)
   max-width は .98 付き、min-width は整数で書く
   =============================================== */

:root {
	--brand: #40277A;
	--line: #e4e4ea;
	--text-sub: #6b6b7b;
	--vk-margin-element-bottom: 0;
	--blue: #40277A;
	--blue-hover: #32127AD9;
	--darker-blue: #14064c;
	--black: #1A1A1A;
	--gray: #ddd;
	--gold: #A68421;
	--gold-hover: #A67C00D9;
	--white: #ffffff;
	--font-base: "Kumbh Sans", "Noto Sans JP", sans-serif;

	/* セカンダリーカラー（青・橙はリンク推奨） */
	--sub-green: #5a913f;
	--sub-red: #c95a4e;
	--sub-teal: #3a9195;
	--sub-purple: #9252a5;
	--sub-blue: #3978ae;
	--sub-orange: #d17a32;
	--text-date: #999999;

	/* レイアウト */
	--content-width: 1260px;
	--page-width: 1280px; /* ワイヤーの基準幅（中身は左右80pxの内側） */
	--page-side: max(0px, (100vw - var(--page-width)) / 2); /* 基準幅を超えた分の片側 */
	--hero-width: 1300px; /* 下層ページのページヘッダーの文字の最大幅 */
	--content-gutter: 30px;
	--hero-top: 70px;
	--design-width: 1920px; 
	--hero-left: min(calc(200 / 1920 * 100vw), 200px); /* 1920pxで200px（比例）、それ以上は200px */

	/* 角丸 */
	--radius-news: 8px;
	--radius-case: 6px;

	/* 文字：ヒーロー */
	--fs-hero-title: 70px;
	--fw-hero-title: 700;
	--lh-hero-title: 1.1;
	--ls-hero-title: -0.96px;
	--fs-hero-lead: 20px;
	--fw-hero-lead: 600;
	--lh-hero-lead: 1.6;
	--mb-hero-lead: 20px;

	/* 文字：セクション見出し */
	--fs-section-title: 46px;
	--fw-section-title: 700;
	--lh-section-title: 1.1;
	--fs-section-sub: 15px;
	--fw-section-sub: 500;
	--lh-section-sub: 1;

	/* 文字：本文 */
	--fs-body: 15px;
	--fw-body: 400;
	--lh-body: 1.8;

	/* 文字：下層ページの本文（Expertise の導入文が基準） */
	--fs-text: 18px;
	--lh-text: 1.8;
	--fs-lead: var(--fs-text); /* 一覧ページ上部の導入文 */
	--fs-card: 16px; /* カードの文 */
	--fs-card-head: 17px; /* 下層ページのカードのタイトル */

	/* 文字：カード */
	--fs-card-title: 17px;
	--fw-card-title: 700;
	--lh-card-title: calc(23.46 / 17);
	--fs-label: 11px;
	--fw-label: 600;
	--lh-label: 1;
	--fs-date: 13px;
	--fw-date: 400;
	--lh-date: 1.5;

	/* 文字：ボタン・リンク */
	--fs-link: 13px;
	--fw-link: 600;
	--lh-btn: 1;

	/* 文字：実績の数字 */
	--fs-stat-num: 80px;
	--fw-stat-num: 700;
	--fw-stat-unit: 300;
	--lh-stat-num: 1.2;
	--fw-stat-label: 700;
}

/* 下層ページの本文：タブレット以下 */
@media (max-width: 991.98px) {
	:root {
		--fs-text: 16px;
		--fs-card-head: 16px;
	}
}
/* 日本語ページ：本文は全画面幅で 17px */
html[lang="ja"] {
	--fs-text: 17px;
}

body {
	font-family: var(--font-base);
}

/* コンテンツ幅：最大1260px・左右30px（中身1200px） */
@media (min-width: 1260px) {
	:root {
		--vk-width-container: var(--content-width);
		--vk-width-container-padding: var(--content-gutter);
	}
	.container {
		max-width: var(--content-width);
		padding-left: var(--content-gutter);
		padding-right: var(--content-gutter);
	}
}


/* 992〜1259px：画面幅いっぱい・左右30px */
@media (min-width: 992px) and (max-width: 1259.98px) {
	:root {
		--vk-width-container: 100vw;
		--vk-width-container-padding: var(--content-gutter);
	}
	.container {
		max-width: none;
		padding-left: var(--content-gutter);
		padding-right: var(--content-gutter);
	}
}

/* タブレット（576〜991px）：画面幅いっぱい・左右の余白 */
@media (min-width: 576px) and (max-width: 991.98px) {
	:root {
		--vk-width-container: 100vw;
		--vk-width-container-padding: var(--content-gutter);
	}
	.container {
		max-width: none;
		padding-left: var(--content-gutter);
		padding-right: var(--content-gutter);
	}
}

/* SP：左右20px */
@media (max-width: 767.98px) {
	:root {
		--content-gutter: 20px;
		--vk-width-container-padding: 20px;
	}
	.container {
		padding-left: var(--content-gutter);
		padding-right: var(--content-gutter);
	}
}


/* 文字色 */
.blue        { color: var(--blue); }
.darker-blue { color: var(--darker-blue); }
.black       { color: var(--black); }
.gray        { color: var(--gray); }
.gold        { color: var(--gold); }
.white       { color: var(--white); }

/* 背景色 */
.bg-blue        { background-color: var(--blue); }
.bg-darker-blue { background-color: var(--darker-blue); }
.bg-black       { background-color: var(--black); }
.bg-gray        { background-color: var(--gray); }
.bg-gold        { background-color: var(--gold); }
.bg-white       { background-color: var(--white); }

/* レイアウト */
.ct-margin {
	margin: 0 auto;
}
.ct-padding {
	padding: 2rem 1rem;
}

/* 固定ヘッダー（sticky）が効くよう、横のはみ出しは hidden ではなく clip で隠す */
html,
body {
	overflow-x: clip;
}
html {
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--cst-header-h, 0px) + var(--wp-admin--admin-bar--height, 0px));
}
.site-body {
	padding: 0;
}
/* Lightning のメインセクション下余白を解除（992px 以下の 2rem も含む） */
.main-section,
.main-section--margin-bottom--on {
	margin-bottom: 0;
}
h1:where(.wp-block-heading).has-background, 
h2:where(.wp-block-heading).has-background, 
h3:where(.wp-block-heading).has-background, 
h4:where(.wp-block-heading).has-background, 
h5:where(.wp-block-heading).has-background, 
h6:where(.wp-block-heading).has-background{
	padding: 0;
}
/* headingの装飾解除 */
.entry-title--post-type--page, h2:where(:not(.wp-block-post-title)){
	    padding: 0;
		border-top:0;
		border-bottom: 0;
}
.contact-block__title{
	border-bottom: 2px solid var(--blue) !important;
}
.site-footer-title, .sub-section-title, h3:where(:not(.wp-block-post-title)){
	border-bottom: 0;
}
h4:where(:not(.wp-block-post-title)) {
    padding: 0;
    background-color: unset;
    border-radius: 0;
}
.site-footer-title:after, .sub-section-title:after, h3:where(:not(.wp-block-post-title)):after {
    content: ".";
    line-height: 0;
    display: block;
    overflow: hidden;
    position: absolute;
    bottom: 0;
    border-bottom: 0;
}


/* ===============================================
  固定ページヘッダー
   =============================================== */

/* 高さは全ページ同じ（固定値）・中身は上下中央 */
.page-header {
	display: flex;
	align-items: center;
	min-height: 190px;
	padding-top: 24px;
	padding-bottom: 24px;
	text-align: left;
}
.page-header > * {
	width: 100%;
}
@media (max-width: 991.98px) {
	.page-header {
		min-height: 176px;
	}
}
/* SP：導入文（Case Studies・News）が収まる高さ */
@media (max-width: 767.98px) {
	.page-header {
		min-height: 200px;
		padding-top: 16px;
		padding-bottom: 16px;
	}
}
.page-header-title, h1.page-header-title{
	font-size: 44px;
	font-weight: var(--fw-section-title);
	line-height: var(--lh-section-title);
}
@media (max-width: 767.98px) {
	.page-header-title, h1.page-header-title{
		font-size: 36px;
	}
}

/* PC：本文と同じ幅（左右80px）で、タイトルの左端を本文にそろえる */
@media (min-width: 992px) {
	.page-header .page-header-inner {
		width: 100%;
		max-width: var(--page-width);
		margin-left: auto;
		margin-right: auto;
		padding-left: 80px;
		padding-right: 80px;
	}
	.page-header .page-header-inner > * {
		max-width: 700px;
	}
	.page-header .page-header-title {
		margin: 0;
		font-size: 56px;
		font-weight: var(--fw-section-title);
		line-height: var(--lh-section-title);
		color: #fff;
	}
}

/* ===============================================
  全ページでcontact form 7のbr無効化
   =============================================== */
.wpcf7-form br {
	display: none;
}

/* reCAPTCHA：右下のマークは隠し、送信ボタンの下に表記 */
.grecaptcha-badge {
	visibility: hidden;
}
body .wpcf7 p.cf7-recaptcha-note {
	margin: 12px 0 0;
	font-size: 14px;
	line-height: 1.5;
	letter-spacing: 0;
	color: #ccc;
}
body .wpcf7 p.cf7-recaptcha-note a {
	color: inherit;
	text-decoration: underline;
}

/* ===============================================
   パンくず（全ページ共通）
   =============================================== */
.breadcrumb {
	border-bottom: 1px solid #eee;
	background: var(--white);
}
.breadcrumb .breadcrumb-list {
	padding-top: 12px;
	padding-bottom: 12px;
	font-size: 13px;
	color: #333;
}
.breadcrumb .breadcrumb-list a {
	color: #888;
	text-decoration: none;
	transition: color .15s;
}
.breadcrumb .breadcrumb-list a:hover,
.breadcrumb .breadcrumb-list a:focus {
	color: var(--blue);
	text-decoration: none;
}
/* リンクのない途中の項目もリンクと同じ色に */
.breadcrumb .breadcrumb-list li:not(:last-child) {
	color: #888;
}
/* 区切り */
.breadcrumb-list li:after {
	content: "›";
	color: #aaa;
}
/* PC：本文と同じ幅 */
@media (min-width: 992px) {
	.breadcrumb .container {
		max-width: var(--page-width);
		margin: 0 auto;
		padding-left: 80px;
		padding-right: 80px;
	}
}

/* Privacy Policy・Cookie Policy・検索結果：本文の枠と上下の余白をほかのページにそろえる */
body:has(.legal-content) .site-body,
body.search .site-body {
	padding-top: 72px;
	padding-bottom: 72px;
}
@media (min-width: 992px) {
	body:has(.legal-content) .site-body-container,
	body.search .site-body-container {
		max-width: var(--page-width);
		padding-left: 80px;
		padding-right: 80px;
	}
}
@media (max-width: 991.98px) {
	body:has(.legal-content) .site-body,
	body.search .site-body {
		padding-top: 56px;
		padding-bottom: 56px;
	}
}
@media (max-width: 767.98px) {
	body:has(.legal-content) .site-body,
	body.search .site-body {
		padding-top: 48px;
		padding-bottom: 48px;
	}
}
/* 検索結果・News：画像がない記事のロゴは、切らずに中央に置く */
.vk_post_imgOuter[style*="loop-img"] {
	background-size: 60% auto;
	background-repeat: no-repeat;
	background-position: center;
	background-color: #fff;
}
.vk_post_imgOuter img[src*="loop-img"],
.ni-card__img img[src*="loop-img"] {
	object-fit: contain;
	padding: 0 20%;
	background: #fff;
}

/* 最初の h2 は上の余白なし（下の h2 の指定より強くする） */
.legal-content.legal-content > h2:first-child {
	margin-top: 0;
}

/* Privacy Policy・Cookie Policy（グループに legal-content） */
.legal-content h2,
.legal-content h2.wp-block-heading {
	margin: 72px 0 32px;
	padding: 20px 0 16px;
	border-top: 3px solid var(--blue);
	border-bottom: 1px solid #e8e8e8;
	background: none;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.3;
	color: #222;
}
.legal-content p,
.legal-content li {
	font-size: var(--fs-text);
	line-height: var(--lh-text);
}
.legal-content h2::before,
.legal-content h2::after {
	content: none;
}
@media (max-width: 767.98px) {
	.legal-content h2,
	.legal-content h2.wp-block-heading {
		margin: 56px 0 24px;
		font-size: 26px;
	}
}

/* ===============================================
   リンク・テキスト
   =============================================== */
li a, p a {
	text-decoration: none;
}

a:hover {
	color: var(--blue);
}

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

/* ===============================================
   サンクスページ
   =============================================== */
.thanks {
	padding: 90px 20px 120px;
	text-align: center;
}
.thanks .thanks__title {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font-size: clamp(20px, 2.4vw, 28px);
	font-weight: 700;
	line-height: 1.4;
	color: #1a1a24;
}
/* タイトル下の短いライン */
.thanks .thanks__title::before {
	content: none;
}
.thanks .thanks__title::after {
	content: "";
	display: block;
	width: 44px;
	height: 3px;
	margin: 28px auto 0;
	border: 0;
	background: var(--blue);
}
/* 余白は Lightning のブロック間の打ち消しより強くする */
body .thanks p.thanks__text {
	max-width: 640px;
	margin: 36px auto 0;
	font-size: 15px;
	line-height: 1.9;
	color: var(--text-sub);
}
body .thanks p.thanks__text + p.thanks__text {
	margin-top: 16px;
}
body .thanks p.thanks__back {
	margin: 52px 0 0;
}
.thanks .thanks__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	min-width: 204px;
	padding: 15px 32px;
	border-radius: 3px;
	background: var(--blue);
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
	transition: opacity .2s;
}
.thanks .thanks__btn:hover,
.thanks .thanks__btn:focus {
	background: var(--blue);
	color: #fff;
	opacity: .85;
	text-decoration: none;
}
/* 矢印は CSS で描く（文字の ‹ は使わない） */
.thanks .thanks__btn-arrow {
	display: none;
}
.thanks .thanks__btn::before {
	content: "";
	width: 7px;
	height: 7px;
	border-left: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
}

@media (max-width: 575px) {
	.thanks {
		padding: 60px 16px 80px;
	}
	body .thanks p.thanks__text {
		font-size: 14px;
		text-align: left;
	}
	body .thanks p.thanks__back {
		margin-top: 40px;
	}
}

/* PC だけの改行 */
@media (max-width: 767.98px) {
	br.br-pc {
		display: none;
	}
}


/* ===============================================
   日本語ページ：文字サイズ（本文 +1px）・改行位置
   =============================================== */

/* トップ：サービスと専門分野 */
html[lang="ja"] .svc-exp__lead {
	font-size: 18px;
}
html[lang="ja"] .svc-card .wp-block-button__link,
html[lang="ja"] .exp-item .wp-block-button__link {
	font-size: 22px;
}

/* タブレット・SP */
@media (max-width: 767.98px) {
	html[lang="ja"] .svc-exp__lead {
		font-size: 17px;
	}
	html[lang="ja"] .svc-card .wp-block-button__link,
	html[lang="ja"] .exp-item .wp-block-button__link {
		font-size: 18px;
	}
}
/* PC：改行は <wbr> の位置で（管理画面で入れる） */
@media (min-width: 992px) {
	html[lang="ja"] .svc-exp__title,
	html[lang="ja"] .svc-card .wp-block-button__link,
	html[lang="ja"] .exp-item .wp-block-button__link {
		word-break: keep-all;
		overflow-wrap: anywhere;
	}
}