@charset "utf-8";
/* CSS Document */

/* ========== DESIGN TOKENS (Brand: Blue/Green) ========== */
:root{
	/* colors */
	--brand:#2B7DF5;          /* メイン（青） */
	--brand-2:#00C2A8;        /* サブ（緑） */
	--ink:#595959;               /* 文字 */
	--muted:#586072;          /* 補助テキスト */
	--line:#E7ECF3;           /* 枠線・区切り */
	--bg:#fff;                /* 背景 */
	--card:#fff;              /* カード・ボックス */
	--focus:#5CA0FF;          /* フォーカスリング */

	/* effects */
	--shadow-sm:0 6px 16px rgba(22,34,51,.08);
	--shadow:0 14px 40px rgba(22,34,51,.12);

	/* radius */
	--radius:14px; --radius-lg:22px; --radius-xl:30px;

	/* typography scale */
	--fs-xs:12px; --fs-sm:13px; --fs:15px; --fs-md:16px; --fs-lg:20px; --fs-xl:28px; --fs-xxl:36px;
	--lh:1.75;
}

/* ダークモード（任意） */
/*
@media (prefers-color-scheme: dark){
:root{
--bg:#0F1216; --card:#12161B;
--ink:#E8EDF5; --muted:#A6B0BF;
--line:#283041;
--shadow-sm:none; --shadow:none;
}
}
*/

/* ========== BASE ========== */
html{scroll-behavior:smooth;}
body{background:var(--bg); color:var(--ink); line-height:var(--lh); font-size:var(--fs); -webkit-font-smoothing:antialiased;}
img{max-width:100%; height:auto; display:block;}
a{color:var(--brand); text-decoration:none;}
a:hover{opacity:.9; text-decoration:underline;}
:focus-visible{outline:3px solid var(--focus); outline-offset:2px;}

/* コンテナ（本文の横幅を共通化） */
.container, .inner, .narrow{
	max-width: 980px; margin: 0 auto; padding: 0 16px;
}
.narrow{max-width: 840px;}

/* 見出し */
.entry-title, h1{font-size:var(--fs-xxl); line-height:1.25; margin:0 0 .6em;}
h2{font-size:var(--fs-xl); margin:2em 0 .6em;}
h3{font-size:var(--fs-lg); margin:1.6em 0 .4em;}
p{margin:0 0 1em; color:var(--ink);}
.small, .text-sm{font-size:var(--fs-sm); color:var(--muted);}

/* 区切り線 */
.hr, hr{border:0; border-top:1px solid var(--line); margin:2rem 0;}

/* ========== BUTTONS (共通) ========== */
.btn{
	display:inline-flex; align-items:center; gap:.5em;
	padding:.7em 1.1em; border-radius:999px; border:1px solid transparent;
	background:var(--brand); color:#fff; box-shadow:var(--shadow-sm); font-weight:600;
}
.btn:hover{transform:translateY(-1px);}
.btn--ghost{background:#fff; color:var(--brand); border-color:var(--brand);}
.btn--alt{background:var(--brand-2);}

/* ========== CARD / セクションボックス ========== */
.card{
	background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
	box-shadow:var(--shadow-sm); padding:24px;
}

/* ========== TABLE（会社概要・料金表など） ========== */
.table{
	width:100%; border-collapse:separate; border-spacing:0; background:var(--card);
	border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
}
.table th, .table td{padding:14px 16px; border-bottom:1px solid var(--line); vertical-align:top; font-size:var(--fs-md);}
.table th{width:28%; background:rgba(43,125,245,.06); font-weight:700;}
.table tr:last-child th, .table tr:last-child td{border-bottom:none;}
@media (max-width: 640px){
	.table thead{display:none;}
	.table tr{display:block; border-bottom:1px solid var(--line);}
	.table th{display:block; width:auto; background:transparent; padding-bottom:6px; color:var(--muted);}
	.table td{display:block; padding-top:0;}
}

/* ========== 定義リスト（プライバシーポリシーなど） ========== */
.policy dl{margin:0;}
.policy dt{
	font-weight:800; margin-top:1.6em;
	padding-left:.8em; border-left:4px solid var(--brand);
}
.policy dd{margin: .6em 0 1em;}
.policy ul{margin:.4em 0 1em 1.2em; list-style:disc;}
.policy li{margin:.2em 0;}

/* ========== FAQ（アコーディオンの初期スタイル） ========== */
.faq-item{border:1px solid var(--line); border-radius:var(--radius); background:var(--card); margin:10px 0;}
.faq-item .faq-q button{
	width:100%; text-align:left; padding:16px; font-weight:700; font-size:var(--fs-md);
	background:none; border:0; border-radius:var(--radius); display:flex; justify-content:space-between; align-items:center;
}
.faq-item .faq-a{padding:0 16px 16px; font-size:var(--fs); display:none;}
.faq-item.is-open .faq-a{display:block;}

/* ========== ヒーロー CTA（トップの共通ボタン見栄え） ========== */
.cta-bar{
	display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:18px 0;
}
.badge{display:inline-block; padding:.2em .6em; border-radius:999px; background:rgba(0,194,168,.12); color:var(--brand-2); font-size:var(--fs-sm);}

/* ========== フォーム（お問い合わせ） ========== */
.input, input[type="text"], input[type="email"], input[type="tel"], textarea, select{
	width:100%; padding:.8em 1em; border:1px solid var(--line); border-radius:10px; background:var(--card);
}
label{display:block; font-weight:700; margin:.4em 0 .3em;}
.required::after{content:" 必須"; color:#fff; background:var(--brand); border-radius:6px; padding:.1em .5em; margin-left:.4em; font-size:var(--fs-xs);}

/* ========== ユーティリティ ========== */
.center{text-align:center;}
.mt-0{margin-top:0!important;} .mt-1{margin-top:.5rem!important;} .mt-2{margin-top:1rem!important;} .mt-3{margin-top:1.5rem!important;}
.mb-0{margin-bottom:0!important;} .mb-1{margin-bottom:.5rem!important;} .mb-2{margin-bottom:1rem!important;} .mb-3{margin-bottom:1.5rem!important;}
.grid{display:grid; gap:16px;} .grid-2{grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width: 840px){ .grid-2{grid-template-columns:1fr;} }

/* ========== 会社概要とプライバシーポリシー専用の薄い装飾 ========== */
.company-profile .entry-title,
.privacy-policy .entry-title{margin-bottom:.8em;}
.company-profile .lead,
.privacy-policy .lead{color:var(--muted);}

/* ========== ヘッダー・フッター（必要に応じて） ========== */
/* 既存テーマを壊さないよう控えめに */
.site-header a:hover, .site-footer a:hover{opacity:.85;}

/* ========== 微アニメ（好みで） ========== */
.btn, .card, .faq-item, .table{transition: all .18s ease;}


/* 固定ページの本文内 h2 見出し */
.page #content h2 {
	font-size: 1.4rem;               /* 読みやすい大きさに */
	font-weight: 700;                /* 適度な太さ */
	margin: 2.2em 0 1em;             /* 前後の余白 */
	padding-left: 0.8em;             /* 左に少し余白 */
	border-left: 4px solid var(--brand); /* ブランドカラーのライン */
	color: var(--ink)!important;               /* 本文色 */
	line-height: 1.4;
	background: #fff!important;
}
