@charset "utf-8";
/* ==========================================================================
   官足法究楽部 カスタムスタイル
   Figma: セミナーページ_デザイン_PC (90:167)
   ヘッダー / グローバルナビは全ページ共通、その他はセミナーページ用
   ========================================================================== */

:root {
	--ks-red: #c30100;
	--ks-red-86: rgba(195, 1, 0, 0.86);
	--ks-ink: #4d4d4d;
	--ks-black: #0b0b0b;
	--ks-bg: #f9f9f9;
	--ks-card: #f2f2f2;
	--ks-hair: #f6f6f6;
	--ks-placeholder: #d9d9d9;
	--ks-pill: #ededed;
	--ks-line: #cfcfcf;
	--ks-footer-bg: #141414;
	--ks-white: #fff;
	--ks-ff: "Noto Sans JP", system-ui, -apple-system, "Segoe UI", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	--ks-ff-serif: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
	--ks-ff-num: "Inter", system-ui, sans-serif;
	--ks-ff-plex: "IBM Plex Sans JP", var(--ks-ff);
	/* デザインのコンテンツ幅は 1172px（x134〜1306）。左右 padding 20px を足した値 */
	--ks-inner: 1212px;
	--ks-header-h: 119px;
}

/* SP（767px以下）でだけ改行させる <br>。PC・タブレットでは無効化する */
.ks-br-sp {
	display: none;
}

/* ==========================================================================
   1. ヘッダー / グローバルナビ（全ページ共通）
   ========================================================================== */

.ks-header {
	position: relative;
	z-index: 100;
	height: var(--ks-header-h);
	background: rgba(255, 255, 255, 0.8);
	font-family: var(--ks-ff);
	/* BizVektor の body { text-align: center } を打ち消す */
	text-align: left;
}

.ks-header__inner {
	display: flex;
	align-items: center;
	height: 100%;
	max-width: 1440px;
	margin: 0 auto;
	/* デザイン：ロゴ左端 x48 / CTA 右端 x1387（1440 - 53） */
	padding: 0 53px 0 48px;
}

/* --- ロゴ --- */
.ks-header__logo {
	display: block;
	flex: 0 0 auto;
	line-height: 0;
}

.ks-header__logo img {
	display: block;
	width: 91px;
	height: 100px;
	object-fit: contain;
}

/* --- ナビ本体（PC）--- */
.ks-header__body {
	display: flex;
	align-items: center;
	min-width: 0;
	margin-left: auto;
}

.ks-header__nav {
	min-width: 0;
	font-size: 16px;
	line-height: 1.4;
}

/* デザインは5項目・間隔32px（1440px時）。
   実際のメニュー項目数が増えても収まるよう可変にしている。 */
.ks-header__nav ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	row-gap: 4px;
	column-gap: clamp(12px, 2.2vw, 32px);
	margin: 0;
	padding: 0;
	list-style: none;
}

.ks-header__nav li {
	position: relative;
	margin: 0;
	padding: 0;
	background: none;
	list-style: none;
}

.ks-header__nav a {
	display: block;
	color: var(--ks-red);
	text-decoration: none;
	white-space: nowrap;
	transition: opacity 0.2s;
}

.ks-header__nav a:hover {
	opacity: 0.65;
	text-decoration: none;
}

/* サブメニュー（デザインには無いが既存メニュー構成を落とさないための対応） */
.ks-header__nav .sub-menu,
.ks-header__nav .children {
	position: absolute;
	top: 100%;
	left: 50%;
	display: block;
	min-width: 200px;
	padding: 8px 0;
	background: var(--ks-white);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, 6px);
	transition: opacity 0.2s, transform 0.2s, visibility 0.2s;
}

.ks-header__nav li:hover > .sub-menu,
.ks-header__nav li:hover > .children,
.ks-header__nav li:focus-within > .sub-menu,
.ks-header__nav li:focus-within > .children {
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, 0);
}

.ks-header__nav .sub-menu a,
.ks-header__nav .children a {
	padding: 8px 20px;
}

/* --- お問い合わせCTA --- */
.ks-header__cta {
	position: relative;
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 265px;
	height: 60px;
	margin-left: clamp(12px, 7.4vw, 107px);
	padding-right: 20px;
	border-radius: 100px;
	background: var(--ks-red);
	color: var(--ks-white);
	font-size: 19px;
	font-weight: 700;
	text-decoration: none;
	transition: opacity 0.2s;
}

.ks-header__cta:hover {
	opacity: 0.85;
	color: var(--ks-white);
	text-decoration: none;
}

.ks-header__cta::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 20px;
	width: 13px;
	height: 13px;
	background: url("../images/kansoku/caret.svg") no-repeat center / 100% 100%;
	transform: translateY(-50%) rotate(90deg);
}

/* --- ハンバーガー（SP専用）--- */
.ks-header__toggle {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	clip: rect(0 0 0 0);
	overflow: hidden;
}

.ks-header__burger {
	display: none;
	position: relative;
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	margin-left: auto;
	cursor: pointer;
}

.ks-header__burger span,
.ks-header__burger span::before,
.ks-header__burger span::after {
	position: absolute;
	left: 8px;
	width: 28px;
	height: 3px;
	border-radius: 2px;
	background: var(--ks-red);
	transition: transform 0.25s, opacity 0.25s;
}

.ks-header__burger span {
	top: 50%;
	margin-top: -1.5px;
}

.ks-header__burger span::before,
.ks-header__burger span::after {
	content: "";
	left: 0;
}

.ks-header__burger span::before {
	top: -9px;
}

.ks-header__burger span::after {
	top: 9px;
}

/* ==========================================================================
   2. セミナーページ共通パーツ
   ========================================================================== */

.ks-page {
	background: var(--ks-bg);
	color: var(--ks-ink);
	font-family: var(--ks-ff);
	font-size: 20px;
	line-height: 1.2;
	/* BizVektor の body { text-align: center } を打ち消す。
	   中央寄せが必要な箇所は各コンポーネント側で個別に指定する。 */
	text-align: left;
	-webkit-font-smoothing: antialiased;
}

/* テーマ既定スタイルの打ち消し（BizVektor の #main 内スタイル対策）
   :where() で詳細度を 0 に抑え、後段のコンポーネント指定が必ず勝つようにする。
   font-family は BizVektor が wp_head でインラインの h1〜h6 指定を出力するため、
   ここで inherit に戻して .ks-page のフォントを効かせる。 */
.ks-page :where(h2, h3, h4, p, ul, ol, li, dl, dt, dd, figure, blockquote) {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	color: inherit;
}

.ks-page :where(ul, ol) {
	list-style: none;
}

.ks-page :where(img) {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}

.ks-page :where(a) {
	transition: opacity 0.2s;
}

.ks-page :where(a:hover) {
	text-decoration: none;
}

/* セミナーページでは BizVektor のページタイトル/パンくず/本文枠を使わない */
.page-template-page-seminar #main {
	width: auto;
	max-width: none;
	margin: 0;
	padding: 0;
	background: var(--ks-bg);
}

.ks-inner {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--ks-inner);
	margin: 0 auto;
	padding: 0 20px;
}

/* --- セクション見出し --- */
.ks-sec-title {
	font-size: 30px;
	font-weight: 700;
	line-height: 1.45;
	text-align: center;
}

.ks-sec-title::after {
	content: "";
	display: block;
	width: 92px;
	height: 9px;
	margin: 8px auto 0;
	background: var(--ks-red);
}

.ks-sec-title--left {
	text-align: left;
}

.ks-sec-title--left::after {
	margin-left: 0;
	margin-right: 0;
}

/* --- ボタン --- */
.ks-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
}

.ks-btn:hover {
	opacity: 0.85;
	text-decoration: none;
}

.ks-btn--red {
	background: var(--ks-red);
	color: var(--ks-white);
}

.ks-btn--red:hover {
	color: var(--ks-white);
}

.ks-btn--black {
	background: var(--ks-black);
	color: var(--ks-white);
}

.ks-btn--black:hover {
	color: var(--ks-white);
}

.ks-btn--pill {
	border-radius: 31px;
	background: var(--ks-red);
	color: var(--ks-white);
}

.ks-btn--pill:hover {
	color: var(--ks-white);
}

.ks-btn--ghost {
	border-radius: 31px;
	background: var(--ks-white);
	color: var(--ks-red);
}

.ks-btn--ghost:hover {
	color: var(--ks-red);
}

/* 写真の上に重ねる半透明の赤ボタン */
.ks-btn--translucent {
	background: var(--ks-red-86);
	color: var(--ks-white);
}

.ks-btn--translucent:hover {
	color: var(--ks-white);
}

/* --- ＼ 見出し ／ の飾り罫 --- */
.ks-slash {
	display: inline-flex;
	align-items: center;
	gap: 14px;
}

.ks-slash::before,
.ks-slash::after {
	content: "";
	flex: 0 0 auto;
	width: 24px;
	height: 3px;
	background: url("../images/kansoku/line-9.svg") no-repeat center / 100% 100%;
}

.ks-slash::before {
	transform: rotate(45deg);
}

.ks-slash::after {
	background-image: url("../images/kansoku/line-10.svg");
	transform: rotate(-45deg);
}

.ks-slash--red::before {
	background-image: url("../images/kansoku/line-11.svg");
}

.ks-slash--red::after {
	background-image: url("../images/kansoku/line-12.svg");
}

/* ==========================================================================
   3. ヒーロー
   ========================================================================== */

.ks-hero {
	position: relative;
	height: 700px;
	background: url("../images/kansoku/hero-bg.jpg") no-repeat -12px -282px / 1478px auto;
	/* 1440px基準のトリミングを維持しつつ、幅広画面でも右端まで画像を敷く */
	background-position: 32% 99%;
	background-size: max(1478px, 100%) auto;
}

/* デザインではヒーロー内の要素はキャンバス(1440px)基準の絶対座標。
   バッジ/見出し左端 x123、ボタン右端 x1332（= right 108px）。 */
.ks-hero__inner {
	position: relative;
	width: 100%;
	max-width: 1440px;
	height: 100%;
	margin: 0 auto;
	box-sizing: border-box;
}

.ks-hero__badge {
	position: absolute;
	top: 130px;
	left: 123px;
	width: 309px;
	padding: 18px 0 13px;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.7);
	box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.25);
	text-align: center;
}

.ks-hero__badge-label {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 200px;
	height: 35px;
	border-radius: 100px;
	background: var(--ks-ink);
	color: var(--ks-white);
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
}

.ks-hero__badge-book {
	margin-top: 8px;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.45;
}

.ks-hero__badge-name {
	margin-top: 1px;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.45;
}

.ks-hero__title {
	position: absolute;
	top: 306px;
	left: 123px;
	width: 810px;
	color: var(--ks-white);
	font-family: var(--ks-ff-serif);
	font-size: 42px;
	font-weight: 600;
	line-height: 1.45;
	text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.ks-hero__actions {
	position: absolute;
	top: 456px;
	right: 108px;
	display: flex;
	flex-direction: column;
	gap: 23px;
}

.ks-hero__actions .ks-btn {
	width: 294px;
	height: 72px;
}

/* ==========================================================================
   4. 官足法とは
   ========================================================================== */

.ks-about {
	padding: 119px 0 0;
}

/* デザイン：写真 x166 y949 w417 / 見出し y941 / 本文 y1030 w607 */
.ks-about__inner {
	display: flex;
	align-items: flex-start;
	gap: 101px;
	padding-left: 52px;
}

.ks-about__media {
	flex: 0 0 417px;
	margin-top: 11px;
}

.ks-about__media img {
	display: block;
	width: 417px;
	height: 270px;
	object-fit: cover;
}

.ks-about__body {
	flex: 0 0 607px;
	min-width: 0;
}

.ks-about__text {
	margin-top: 31px;
	font-size: 20px;
	line-height: 1.2;
}

/* ==========================================================================
   5. 足もみの種類
   ========================================================================== */

.ks-types {
	padding: 149px 0 0;
}

.ks-types__lead {
	width: fit-content;
	margin: 50px auto 0;
	font-size: 20px;
	line-height: 1.2;
	text-align: center;
}

/* サブ文はブロックとして中央、テキストは左揃え（デザイン準拠） */

.ks-types__sub {
	width: fit-content;
	margin: 36px auto 0;
	font-size: 20px;
	line-height: 1.2;
	text-align: left;
}

/* カードはデザイン通り高さを固定（stretch させない） */
.ks-types__list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: start;
	max-width: 1173px;
	margin: 40px auto 0;
	padding: 16px 0 0;
}

.ks-type {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	min-height: 405px;
	padding: 31px 35px 30px;
	border: 3px solid var(--ks-ink);
	background: var(--ks-card);
}

.ks-type--main {
	position: relative;
	z-index: 1;
	min-height: 455px;
	padding-top: 28px;
	margin-top: -16px;
	border: 7px solid var(--ks-red);
	background: var(--ks-white);
}

.ks-type__head {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-height: 68px;
}

.ks-type__icon {
	flex: 0 0 auto;
	width: 39px;
	height: 39px;
	background: url("../images/kansoku/footprint.svg") no-repeat center / contain;
}

.ks-type--main .ks-type__icon {
	background-image: url("../images/kansoku/footprint-red.svg");
}

.ks-type__title {
	font-size: 25px;
	font-weight: 700;
	line-height: 1.25;
	text-align: center;
}

.ks-type--main .ks-type__title {
	font-size: 35px;
}

.ks-type--main .ks-type__text {
	margin-top: 24px;
}

.ks-type__text {
	margin-top: 25px;
	font-size: 18px;
	line-height: 1.222;
}

.ks-type__text strong {
	display: block;
	color: var(--ks-red);
	font-weight: 700;
}


/* ==========================================================================
   6. 官足法の根源（動画）
   ========================================================================== */

.ks-roots {
	padding: 128px 0 0;
	text-align: center;
}

.ks-roots__eyebrow {
	font-size: 20px;
	font-weight: 500;
	line-height: 1.4;
}

.ks-roots__title {
	font-size: 30px;
	font-weight: 700;
	line-height: 1.45;
}

.ks-roots__list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 21px;
	max-width: 1172px;
	margin: 14px auto 0;
}

/* デザイン：277 × 182 */
.ks-roots__item {
	position: relative;
	aspect-ratio: 277 / 182;
	background: var(--ks-placeholder);
}

.ks-roots__item iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.ks-roots__text {
	width: fit-content;
	margin: 50px auto 0;
	font-size: 20px;
	line-height: 1.2;
	text-align: left;
}

/* ==========================================================================
   7. セミナー一覧
   ========================================================================== */

.ks-courses {
	padding: 110px 0 0;
}

.ks-courses__list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	align-items: start;
	max-width: 1165px;
	margin: 35px auto 0;
	padding-top: 39px;
}

.ks-course {
	position: relative;
}

.ks-course__head {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 72px;
	padding: 10px;
	border: 9px solid var(--ks-hair);
	border-radius: 2px;
	background: var(--ks-white);
	font-size: 25px;
	font-weight: 700;
	line-height: 1.25;
	text-align: center;
}

.ks-course__body {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	min-height: 321px;
	margin-top: 6px;
	padding: 69px 21px 24px;
	border: 9px solid var(--ks-hair);
	border-radius: 2px;
	background: var(--ks-white);
}

.ks-course__features {
	font-size: 20px;
	line-height: 1.2;
}

.ks-course__features li {
	position: relative;
	margin-left: 67px;
	list-style: none;
}

/* ::marker は vertical-align を受け付けず、点が1行目のベースライン基準に置かれるため
   文字の上下中央より下にずれる。疑似要素の丸に置き換えて行ボックスの中央に合わせる。
   すべて em 基準なので、フォントサイズを変えても比率が保たれる。 */
.ks-course__features li::before {
	content: "";
	position: absolute;
	top: 0.6em; /* line-height: 1.2 の半分＝1行目の中央 */
	left: -0.63em;
	width: 0.28em;
	height: 0.28em;
	border-radius: 50%;
	background: currentColor;
	transform: translate(-50%, -50%);
}

.ks-course__actions {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: auto;
	padding-top: 24px;
	align-items: center;
}

.ks-course__actions .ks-btn {
	width: 231px;
	height: 62px;
}

/* おすすめ（3日間集中セミナー） */
.ks-course--reco {
	margin-top: -39px;
}

.ks-course__reco {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 32px;
	color: var(--ks-red);
	font-size: 20px;
	font-weight: 700;
	line-height: 1;
}

.ks-course--reco .ks-course__head {
	min-height: 85px;
	border-color: var(--ks-hair);
	background: var(--ks-red);
	color: var(--ks-white);
}

.ks-course--reco .ks-course__body {
	min-height: 322px;
	margin-top: 8px;
	padding-top: 21px;
	border-color: var(--ks-hair);
	background: var(--ks-red);
	color: var(--ks-white);
}

.ks-course--reco .ks-course__actions {
	gap: 8px;
}

/* ==========================================================================
   8. フルワイド CTA バンド
   ========================================================================== */

.ks-band {
	position: relative;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	min-height: 329px;
	margin-top: 131px;
	padding: 41px 20px 42px;
	overflow: hidden;
	color: var(--ks-white);
	text-align: center;
}

.ks-band::before {
	content: "";
	position: absolute;
	inset: -6px;
	background: url("../images/kansoku/cta-bg.jpg") no-repeat center / cover;
	filter: blur(1.5px);
}

.ks-band::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.3);
}

.ks-band__inner {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: var(--ks-inner);
	margin: 0 auto;
}

.ks-band__title {
	font-size: 42px;
	font-weight: 700;
	line-height: 1.3;
}

.ks-band__list {
	width: fit-content;
	margin: 24px auto 0;
	font-size: 20px;
	line-height: 1.2;
	text-align: left;
}

.ks-band__list li {
	margin-left: 30px;
	list-style: disc;
}

.ks-band .ks-btn {
	width: 344px;
	height: 60px;
	margin-top: 34px;
}

/* クロージング（明朝体） */
.ks-band--closing {
	margin-top: 133px;
	padding-top: 51px;
}

.ks-band--closing .ks-band__title {
	font-family: var(--ks-ff-serif);
	font-size: 40px;
	font-weight: 600;
}

.ks-band__sub {
	margin-top: 9px;
	font-family: var(--ks-ff-serif);
	font-size: 20px;
	font-weight: 500;
	line-height: 1.5;
}

.ks-band--closing .ks-btn,
.ks-band--closing .ks-btn:hover {
	width: 294px;
	height: 72px;
	margin-top: 23px;
	background: var(--ks-red-86);
	color: var(--ks-white);
	text-decoration: none;
}

/* ==========================================================================
   9. セミナーの選び方
   ========================================================================== */

.ks-choose {
	padding: 141px 0 0;
}

/* デザイン：写真 x170 y3865 / 見出し y3837（中央） */
.ks-choose__inner {
	display: flex;
	align-items: flex-start;
	gap: 93px;
	padding-left: 56px;
}

.ks-choose__media {
	flex: 0 0 417px;
	margin-top: 30px;
}

.ks-choose__media img {
	display: block;
	width: 417px;
	height: 270px;
	object-fit: cover;
	object-position: 50% 63%;
}

/* 見出しの中心をデザイン（x965）に合わせるため幅を固定 */
.ks-choose__body {
	flex: 0 0 570px;
	min-width: 0;
}

.ks-choose__list {
	margin-top: 48px;
}

.ks-choose__row {
	display: flex;
	align-items: flex-start;
	gap: 19px;
	height: 51px;
	font-size: 20px;
	line-height: 1.2;
}

.ks-choose__row::before {
	content: "";
	flex: 0 0 auto;
	width: 16px;
	height: 16px;
	margin-top: 6px;
	background: url("../images/kansoku/ellipse-4.svg") no-repeat center / contain;
}

.ks-choose__from {
	flex: 0 0 190px;
}

.ks-choose__arrow {
	flex: 0 0 61.5px;
	height: 17px;
	margin-top: 6px;
	background: url("../images/kansoku/arrow.svg") no-repeat center / contain;
}

.ks-choose__to {
	flex: 1 1 auto;
	min-width: 0;
	padding-left: 10px;
}

.ks-choose__note {
	display: block;
	margin-top: -2px;
	font-size: 16px;
	white-space: nowrap;
	line-height: 1.2;
}

.ks-choose__body .ks-btn {
	width: 307px;
	height: 62px;
	margin: 11px 0 0 132px;
}

/* ==========================================================================
   10. よくあるご質問
   ========================================================================== */

.ks-faq {
	padding: 187px 0 0;
}

.ks-faq__list {
	max-width: 682px;
	margin: 34px auto 0;
}

.ks-faq__item {
	border-bottom: 1px solid #000;
}

.ks-faq__q {
	display: flex;
	align-items: center;
	box-sizing: border-box;
	gap: 24px;
	min-height: 67px;
	padding: 11px 0 8px;
	cursor: pointer;
	font-size: 20px;
	line-height: 1.4;
	list-style: none;
}

.ks-faq__q::-webkit-details-marker {
	display: none;
}

.ks-faq__q::before {
	content: "Q";
	flex: 0 0 80px;
	color: #000;
	font-family: var(--ks-ff-num);
	font-size: 40px;
	font-weight: 600;
	line-height: 1;
}

.ks-faq__q::after {
	content: "＋";
	flex: 0 0 auto;
	margin-left: auto;
	color: #000;
	font-size: 20px;
	line-height: 1;
}

.ks-faq__item[open] .ks-faq__q::after {
	content: "－";
}

.ks-faq__a {
	padding: 0 0 24px 104px;
	font-size: 18px;
	line-height: 1.2;
}

.ks-faq .ks-btn {
	display: flex;
	width: 307px;
	height: 62px;
	margin: 56px auto 0;
}

/* ==========================================================================
   11. お問い合わせ
   ========================================================================== */

.ks-contact {
	margin-top: 0;
	padding: 42px 0 56px;
	background: var(--ks-white);
}

.ks-contact__cols {
	display: flex;
	min-height: 196px;
	max-width: 1160px;
	margin: 35px auto 0;
}

/* デザイン：区切り線 x720 / ボックス x140・x788（ともに w512） */
.ks-contact__col {
	flex: 1 1 50%;
	box-sizing: border-box;
	min-width: 0;
	padding: 0 68px 0 0;
	text-align: center;
}

.ks-contact__col + .ks-contact__col {
	padding: 0 0 0 68px;
	border-left: 1px solid var(--ks-ink);
}

.ks-contact__label {
	font-size: 22px;
	font-weight: 700;
	line-height: 1.4;
}

.ks-contact__box {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 129px;
	margin-top: 17px;
	padding: 16px 20px;
	background: var(--ks-red);
	color: var(--ks-white);
	text-decoration: none;
}

a.ks-contact__box:hover {
	opacity: 0.85;
	color: var(--ks-white);
	text-decoration: none;
}

.ks-contact__box-form {
	display: flex;
	align-items: center;
	gap: 35px;
	font-family: var(--ks-ff-plex);
	font-size: 30px;
	font-weight: 700;
	line-height: 1.3;
}

.ks-contact__box-form::before {
	content: "";
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	background: url("../images/kansoku/icon-mail.png") no-repeat center / contain;
}

.ks-contact__box-tel {
	/* アイコンの大きさと番号との間隔。営業時間の位置合わせにも使うため変数にしている */
	--ks-tel-icon: 59px;
	--ks-tel-gap: 21px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.ks-contact__tel {
	display: flex;
	align-items: center;
	gap: var(--ks-tel-gap);
	color: #fdfdfd;
	font-family: var(--ks-ff-num);
	font-size: 48px;
	font-weight: 800;
	line-height: 1.1;
	text-decoration: none;
}

.ks-contact__tel:hover {
	color: #fdfdfd;
	text-decoration: none;
}

.ks-contact__tel::before {
	content: "";
	flex: 0 0 auto;
	width: var(--ks-tel-icon);
	height: var(--ks-tel-icon);
	background: url("../images/kansoku/icon-tel.png") no-repeat center / contain;
	transform: rotate(-18.21deg);
}

/* 親の align-items: center は「アイコン＋番号」全体を中央に揃えるため、
   そのままだと営業時間が番号よりアイコン分だけ左にずれる。
   アイコン＋余白の半分だけ右へ寄せて、番号の真下に揃える。 */
.ks-contact__hours {
	margin-top: 1px;
	font-size: 18px;
	line-height: 1.4;
	transform: translateX(calc((var(--ks-tel-icon) + var(--ks-tel-gap)) / 2));
}

/* ==========================================================================
   12. TOPページ ヒーロー
   ========================================================================== */

/* BizVektor の本文枠を無効化（.page-template-page-seminar #main と同型） */
body.home #main {
	width: auto;
	max-width: none;
	margin: 0;
	padding: 0;
	background: var(--ks-bg);
}

.ks-home-hero {
	background: url(../images/kansoku/home-hero.jpg) center / cover no-repeat;
}

.ks-home-hero__inner {
	position: relative;
	box-sizing: border-box;
	max-width: 1440px;
	height: 600px;
	margin: 0 auto;
	padding: 0 48px;
}

/* 縦書きのキャッチコピー（<br> で右→左に折り返す） */
.ks-home-hero__title {
	position: absolute;
	top: 118px;
	left: 50%;
	margin: 0;
	transform: translateX(-50%);
	writing-mode: vertical-rl;
	font-family: var(--ks-ff);
	font-size: 40px;
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: 8px;
	color: var(--ks-white);
	text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.ks-home-hero__action {
	position: absolute;
	top: 431px;
	right: 108px;
}

.ks-home-hero__action .ks-btn {
	width: 294px;
	height: 72px;
}

/* ==========================================================================
   13. TOPページ 最新のお知らせ・セミナー情報
   ========================================================================== */

/* ヒーローの下端に 39px 重ねる */
.ks-news {
	position: relative;
	z-index: 2;
	margin-top: -39px;
	padding: 0 20px;
}

.ks-news__box {
	box-sizing: border-box;
	max-width: 958px;
	margin: 0 auto;
	padding: 50px 0 46px;
	background: rgba(255, 255, 255, 0.8);
}

.ks-news__list {
	margin: 35px 0 0;
	padding: 0 79px 0 95px;
	list-style: none;
}

.ks-news__item {
	border-bottom: 1px solid var(--ks-line);
}

.ks-news__link {
	display: flex;
	align-items: center;
	min-height: 58px;
	color: var(--ks-ink);
	font-size: 20px;
	line-height: 1.4;
	text-decoration: none;
}

a.ks-news__link:hover {
	color: var(--ks-red);
	text-decoration: none;
}

.ks-news__date {
	flex: 0 0 139px;
}

.ks-news__cat {
	display: flex;
	flex: 0 0 80px;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 30px;
	margin-right: 40px;
	border-radius: 18px;
	background: var(--ks-pill);
	font-size: 16px;
	line-height: 1;
}

.ks-news__cat--empty {
	background: transparent;
}

.ks-news__title {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.ks-news__plus {
	flex: 0 0 auto;
	margin-left: 24px;
}

/* ==========================================================================
   14. TOPページ 官足法究楽部とは
   ========================================================================== */

.ks-intro {
	margin-top: 44px;
}

.ks-intro__inner {
	position: relative;
	max-width: 1440px;
	height: 865px;
	margin: 0 auto;
}

/* 左上・右の赤い装飾ブロック */
.ks-intro__deco {
	position: absolute;
	width: 185px;
	height: 465px;
	background: var(--ks-red);
}

.ks-intro__deco--left {
	top: 0;
	left: 0;
}

.ks-intro__deco--right {
	top: 400px;
	right: 0;
}

.ks-intro__title {
	position: absolute;
	top: 55px;
	left: 126px;
	display: flex;
	align-items: baseline;
	margin: 0;
	font-family: var(--ks-ff-serif);
	white-space: nowrap;
}

/* 「官」は左の赤ブロックに重なる白文字 */
.ks-intro__title-kan {
	font-size: 50px;
	font-weight: 700;
	letter-spacing: -2.5px;
	color: var(--ks-white);
}

.ks-intro__title-lead {
	font-size: 30px;
	font-weight: 600;
	letter-spacing: -1.5px;
	color: var(--ks-ink);
}

.ks-intro__photo {
	position: absolute;
	width: 232px;
	height: 260px;
	margin: 0;
}

.ks-intro__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ks-intro__photo--left {
	top: 181px;
	left: 113px;
}

.ks-intro__photo--right {
	top: 429px;
	right: 94px;
}

.ks-intro__body {
	position: absolute;
	margin: 0;
	font-family: var(--ks-ff-serif);
	font-size: 20px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--ks-ink);
}

.ks-intro__body--first {
	top: 250px;
	left: 389px;
	width: 773px;
}

.ks-intro__body--second {
	top: 498px;
	left: 279px;
	width: 767px;
}

.ks-intro__body a {
	color: inherit;
	text-decoration: underline;
}

.ks-intro__closing {
	position: absolute;
	top: 738px;
	left: 302px;
	width: 837px;
	margin: 0;
	font-family: var(--ks-ff-serif);
	font-size: 25px;
	line-height: 1.45;
	color: var(--ks-ink);
}

/* ==========================================================================
   15. TOPページ セミナー告知バナー
   ========================================================================== */

.ks-promo {
	margin-top: 150px;
}

.ks-promo__banner {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	max-width: 960px;
	height: 240px;
	margin: 0 auto;
	overflow: hidden;
	text-align: center;
}

.ks-promo__banner::before,
.ks-promo__banner::after {
	content: "";
	position: absolute;
	inset: 0;
}

/* ぼかし背景（scale でにじみの白フチを防ぐ） */
.ks-promo__banner::before {
	background: url(../images/kansoku/promo-bg.jpg) center / cover no-repeat;
	filter: blur(2px);
	transform: scale(1.06);
}

.ks-promo__banner::after {
	background: rgba(0, 0, 0, 0.2);
}

.ks-promo__body {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	width: 100%;
	padding: 0 20px;
}

.ks-promo__title {
	margin: 0;
	font-family: var(--ks-ff-serif);
	font-size: 42px;
	font-weight: 700;
	line-height: 1.43;
	color: var(--ks-white);
	text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.ks-promo__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 82px;
	margin-top: 17px;
}

.ks-promo__actions .ks-btn {
	width: 294px;
	height: 72px;
}

/* ==========================================================================
   16. TOPページ コラム
   ========================================================================== */

.ks-column {
	padding: 133px 0 197px;
}

.ks-column__list {
	display: grid;
	grid-template-columns: repeat(3, 296px);
	justify-content: center;
	gap: 26px;
	margin: 36px 0 0;
	padding: 0;
	list-style: none;
}

.ks-column__card {
	width: 296px;
	min-height: 362px;
	background: var(--ks-white);
}

.ks-column__link {
	display: block;
	box-sizing: border-box;
	height: 100%;
	padding: 33px 35px;
	color: var(--ks-ink);
	text-decoration: none;
}

a.ks-column__link:hover {
	color: var(--ks-red);
	text-decoration: none;
}

/* アイキャッチ未設定時は背景色がプレースホルダになる */
.ks-column__thumb {
	width: 226px;
	height: 148px;
	overflow: hidden;
	background: var(--ks-placeholder);
}

.ks-column__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ks-column__date {
	display: block;
	margin-top: 21px;
	font-size: 20px;
	line-height: 1.2;
}

.ks-column__cat {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: fit-content;
	min-width: 80px;
	height: 30px;
	margin-top: 6px;
	padding: 0 12px;
	border-radius: 18px;
	background: var(--ks-pill);
	font-size: 14px;
	line-height: 1;
	margin-top: 10px;
}

.ks-column__title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	margin: 13px 0 0;
	overflow: hidden;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.2;
}

.ks-column__more {
	display: flex;
	width: 307px;
	height: 62px;
	margin: 54px auto 0;
}

/* ==========================================================================
   17. フッター（全ページ共通）
   ========================================================================== */

/* .ks-page の外側なので :where() リセットが効かない。
   BizVektor の body { text-align: center } を含め、余白・揃えは個別に打ち消す */
.ks-footer {
	background: var(--ks-footer-bg);
	color: var(--ks-white);
	font-family: var(--ks-ff);
	text-align: left;
}

.ks-footer__inner {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	box-sizing: border-box;
	gap: 40px;
	max-width: 1440px;
	margin: 0 auto;
	padding: 59px 74px 0 151px;
}

.ks-footer__logo {
	display: block;
	width: 480px;
	max-width: 100%;
	height: 88px;
	object-fit: contain;
}

.ks-footer__address {
	margin: 30px 0 0;
	font-size: 20px;
	line-height: 1.2;
}

.ks-footer__nav {
	padding-top: 28px;
}

.ks-footer__nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ks-footer__nav li {
	margin: 0;
	padding: 0;
	background: none;
	list-style: none;
}

.ks-footer__nav a {
	color: var(--ks-white);
	font-size: 16px;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
}

.ks-footer__nav a:hover {
	color: var(--ks-white);
	text-decoration: underline;
}

.ks-footer__copyright {
	padding: 40px 20px 32px;
	font-size: 14px;
	line-height: 1.6;
	text-align: center;
}

.ks-footer__copyright #copy,
.ks-footer__copyright #powerd {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	color: var(--ks-white);
	font-size: 14px;
	line-height: 1.6;
	text-align: center;
}

.ks-footer__copyright a {
	color: var(--ks-white);
	text-decoration: none;
}

/* ==========================================================================
   18. レスポンシブ
   ========================================================================== */

/* --- PC（1025px以上）はレイアウトを 1440px のデザイン基準で固定する ---
   TOPページとセミナーページは Figma の 1440px キャンバスを絶対配置・固定px
   で再現しているため、ウィンドウ幅が 1440px を下回ると要素どうしの位置関係が
   崩れる（左寄せの要素は固定のまま、右寄せの要素だけ内側に寄ってくる）。
   1025〜1439px では 1440px のキャンバスごと等倍で縮小し、どの画面幅でも
   まったく同じレイアウトになるようにする。1024px以下はタブレット／スマホ用の
   再フローをそのまま使う。

   - 100cqw は縦スクロールバーを除いた実コンテンツ幅。100vw はスクロールバー分を
     含む環境があり、その場合は横スクロールが出てしまうため container query 単位を使う。
   - tan(atan2(A, B)) は A / B を「単位なしの数値」として取り出すための定型句。
   - ヘッダーとフッターは全ページ共通の可変レイアウトなので縮小対象に含めない。 */
@media screen and (min-width: 1025px) {

	body.home,
	body.page-template-page-seminar {
		container-type: inline-size;
	}
}

@media screen and (min-width: 1025px) and (max-width: 1439.98px) {

	body.home .ks-page,
	body.page-template-page-seminar .ks-page {
		zoom: tan(atan2(100cqw, 1440px));
	}
}

/* --- タブレット --- */
@media screen and (max-width: 1200px) {
	.ks-header__cta {
		margin-left: 32px;
	}

	.ks-header__nav ul {
		row-gap: 4px;
		column-gap: 20px;
	}

	/* TOPフッター */
	.ks-footer__inner {
		padding: 48px 40px 0;
	}

	.ks-footer__nav ul {
		gap: 24px;
	}
}

@media screen and (max-width: 1024px) {
	/* ヘッダー：ドロワー化 */

	/* スクロールしてもハンバーガーが常に出ているよう、ヘッダーごと画面上部に追従させる。
	   ドロワー（.ks-header__body）はこのヘッダー基準の絶対配置なので一緒に追従する。 */

	/* sticky の追従範囲は親要素（#wrap）の高さで打ち切られる。
	   BizVektor のスキンCSSが #wrap に height: 100%（＝画面高）を指定しているため、
	   そのままだと1画面分しか追従しない。中身の高さまで伸ばす。 */
	#wrap {
		height: auto;
	}

	.ks-header {
		position: sticky;
		top: 0;
		/* 既定の rgba(255,255,255,0.8) のままだと追従中に背後のコンテンツが透ける。
		   ヒーロー画像に重ねる前提の半透明なので、追従時は不透明にして境界に影を付ける。 */
		background: var(--ks-white);
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	}

	.ks-header__burger {
		display: block;
	}

	/* ドロワーは .ks-header（position: relative）を基準にその真下へ出す。
	   position: fixed + top: var(--ks-header-h) だと
	   ・管理バー表示中（html に margin-top: 32px が付く）にヘッダーと 32px ずれる
	   ・ページをスクロールするとヘッダーだけ流れてドロワーが取り残される
	   という２つのズレが起きるため、ヘッダー基準の絶対配置にしている。 */
	.ks-header__body {
		position: absolute;
		top: 100%;
		right: 0;
		left: 0;
		z-index: 1;
		display: block;
		margin: 0;
		padding: 24px 20px 40px;
		background: #fff;
		/* 元の position: fixed + bottom: 0 と同じ「ヘッダー下いっぱい」の見た目を維持する */
		min-height: calc(100vh - var(--ks-header-h));
		min-height: calc(100dvh - var(--ks-header-h));
		opacity: 0;
		visibility: hidden;
	}

	.ks-header__toggle:checked ~ .ks-header__body {
		opacity: 1;
		visibility: visible;
	}
	/* メニューを閉じている間は中のリンクをタップできないようにする */
	.ks-header__toggle:not(:checked) ~ .ks-header__body {
		pointer-events: none;
	}

	/* SPではPC用ホバー時の translate(-50%) を打ち消し、タップ時にサブメニューが左へずれないようにする */
	.ks-header__nav li:hover > .sub-menu,
	.ks-header__nav li:hover > .children,
	.ks-header__nav li:focus-within > .sub-menu,
	.ks-header__nav li:focus-within > .children {
		transform: none;
	}

	.ks-header__nav .sub-menu,
	.ks-header__nav .children {
		transition: none;
	}

	.ks-header__toggle:checked ~ .ks-header__burger span {
		background: transparent;
	}

	.ks-header__toggle:checked ~ .ks-header__burger span::before {
		top: 0;
		transform: rotate(45deg);
	}

	.ks-header__toggle:checked ~ .ks-header__burger span::after {
		top: 0;
		transform: rotate(-45deg);
	}

	.ks-header__nav ul {
		display: block;
	}

	.ks-header__nav a {
		padding: 16px 4px;
		border-bottom: 1px solid rgba(195, 1, 0, 0.2);
		font-size: 17px;
	}

	.ks-header__nav .sub-menu,
	.ks-header__nav .children {
		position: static;
		min-width: 0;
		padding: 0 0 0 16px;
		box-shadow: none;
		opacity: 1;
		/* 閉じたメニュー内で透明なまま押せてしまわないよう、親（.ks-header__body）の表示状態に従う */
		visibility: inherit;
		transform: none;
	}

	.ks-header__nav .sub-menu a,
	.ks-header__nav .children a {
		padding: 12px 4px;
		font-size: 15px;
	}

	.ks-header__cta {
		width: 100%;
		max-width: 320px;
		height: 60px;
		margin: 24px auto 0;
		font-size: 17px;
	}

	.ks-types__list,
	.ks-courses__list {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
		padding-top: 0;
	}

	.ks-type--main,
	.ks-course--reco {
		margin-top: 0;
	}

	.ks-type,
	.ks-type--main,
	.ks-course__body,
	.ks-course--reco .ks-course__body {
		min-height: 0;
	}

	.ks-roots__list {
		grid-template-columns: repeat(2, 1fr);
	}

	.ks-hero__title {
		width: auto;
		max-width: 620px;
		font-size: 32px;
	}

	.ks-hero__actions {
		top: auto;
		bottom: 40px;
	}

	/* PC は 607px / 570px の固定幅。タブレットでは可変にしないと横に溢れる */
	.ks-about__inner,
	.ks-choose__inner {
		gap: 40px;
		padding-left: 20px;
	}

	.ks-about__media,
	.ks-choose__media {
		flex: 0 0 38%;
		min-width: 0;
	}

	.ks-about__body,
	.ks-choose__body {
		flex: 1 1 auto;
		min-width: 0;
	}

	.ks-about__media img,
	.ks-choose__media img {
		width: 100%;
		height: auto;
		aspect-ratio: 417 / 270;
	}

	/* 右カラムが細く潰れるので「〜な方は →」で改行して下に受け先を置く */
	.ks-choose__row {
		flex-wrap: wrap;
		gap: 10px;
		height: auto;
	}

	.ks-choose__row + .ks-choose__row {
		margin-top: 16px;
	}

	.ks-choose__from {
		flex: 0 1 auto;
	}

	.ks-choose__arrow {
		flex: 0 0 48px;
	}

	.ks-choose__to {
		flex: 1 1 100%;
		padding-left: 24px;
	}

	.ks-choose__note {
		margin-top: 0;
		white-space: normal;
	}

	.ks-choose__body .ks-btn {
		margin: 28px 0 0;
	}

	/* TOPヒーロー */
	.ks-home-hero__inner {
		height: 520px;
		padding: 0 20px;
	}

	.ks-home-hero__title {
		top: 80px;
		font-size: 32px;
		letter-spacing: 6px;
	}

	.ks-home-hero__action {
		top: auto;
		right: auto;
		bottom: 40px;
		left: 50%;
		transform: translateX(-50%);
	}

	/* TOPお知らせ：ヒーローとの重なりを解除 */
	.ks-news {
		margin-top: 0;
		padding: 40px 20px 0;
	}

	.ks-news__list {
		padding: 0 24px;
	}

	.ks-news__cat {
		margin-right: 24px;
	}

	/* TOP官足法究楽部とは：絶対配置を解除して縦積み */
	.ks-intro {
		margin-top: 50px;
		padding: 0 20px;
	}

	.ks-intro__inner {
		max-width: 720px;
		height: auto;
	}

	.ks-intro__deco {
		display: none;
	}

	.ks-intro__title,
	.ks-intro__photo,
	.ks-intro__body,
	.ks-intro__closing {
		position: static;
		width: auto;
	}

	.ks-intro__title {
		justify-content: center;
	}

	/* 赤ブロックを隠すので白→赤に戻す */
	.ks-intro__title-kan {
		color: var(--ks-red);
	}

	.ks-intro__photo {
		width: 232px;
		margin: 28px auto 0;
	}

	.ks-intro__body {
		margin-top: 24px;
	}

	.ks-intro__closing {
		margin-top: 28px;
	}

	/* TOPセミナー告知 */
	.ks-promo {
		margin-top: 56px;
	}

	.ks-promo__banner {
		height: auto;
		min-height: 200px;
		padding: 40px 0;
	}

	.ks-promo__title {
		font-size: 30px;
	}

	.ks-promo__actions {
		gap: 24px;
	}

	/* 768〜1024px はお問い合わせ欄に専用のサイズ指定が無く、
	   電話番号が2行に折り返して赤ボックスに余裕が無い。
	   ここで営業時間を右へずらすとボックスからはみ出すため無効化する。 */
	.ks-contact__hours {
		transform: none;
	}

	/* TOPコラム */
	.ks-column {
		padding: 64px 0 72px;
	}

	.ks-column__list {
		grid-template-columns: repeat(2, 296px);
	}

	.ks-column__cat {
		min-width: 116px;
		height: 30px;
		font-size: 16px;
	}

	/* TOPフッター */
	.ks-footer__inner {
		display: block;
		padding: 40px 20px 0;
		text-align: center;
	}

	.ks-footer__logo {
		margin: 0 auto;
	}

	.ks-footer__nav ul {
		justify-content: center;
		gap: 16px 24px;
	}
}

/* --- スマートフォン --- */
/* ログイン中は上部に #wpadminbar（783px以上で position: fixed / 高さ32px）が居座るため、
   追従ヘッダーをその分だけ下げる。782px以下の管理バーは固定されないので補正不要。 */
@media screen and (min-width: 783px) and (max-width: 1024px) {

	body.admin-bar .ks-header {
		top: 32px;
	}
}

@media screen and (max-width: 767px) {
	/* ヘッダー */
	.ks-header {
		--ks-header-h: 72px;
	}

	.ks-header__inner {
		padding: 0 16px;
	}

	.ks-header__logo img {
		width: 48px;
		height: 53px;
	}

	/* 共通 */
	.ks-page {
		font-size: 16px;
	}

	.ks-inner {
		padding: 0 20px;
	}

	.ks-sec-title {
		margin-top: 20px;
		font-size: 22px;
	}

	.ks-sec-title::after {
		width: 64px;
		height: 6px;
	}

	.ks-btn {
		font-size: 16px;
	}

	/* ヒーロー */
	.ks-hero {
		height: auto;
		background-position: center;
		background-size: cover;
		padding: 40px 0 48px;
	}

	/* 写真が明るいので白文字の可読性を確保するスクリム */
	.ks-hero::before {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(180deg, rgba(0, 0, 0, 0.12) 0%, rgba(0, 0, 0, 0.5) 40%, rgba(0, 0, 0, 0.6) 100%);
	}

	.ks-hero__inner {
		position: static;
		height: auto;
		padding: 0 20px;
	}

	.ks-hero__badge,
	.ks-hero__title,
	.ks-hero__actions {
		position: relative;
		z-index: 1;
	}

	.ks-hero__badge {
		top: auto;
		left: auto;
		width: 100%;
		max-width: 309px;
		margin: 0 auto;
	}

	.ks-hero__badge-name {
		font-size: 24px;
	}

	.ks-hero__title {
		top: auto;
		left: auto;
		width: auto;
		max-width: none;
		margin-top: 32px;
		font-size: 21px;
	}

	.ks-hero__actions {
		top: auto;
		right: auto;
		bottom: auto;
		margin-top: 40px;
		align-items: center;
		gap: 16px;
	}

	.ks-hero__actions .ks-btn {
		width: 100%;
		max-width: 320px;
		height: 64px;
	}

	/* 官足法とは */
	.ks-about {
		padding-top: 56px;
	}

	.ks-about__inner,
	.ks-choose__inner {
		display: block;
	}

	.ks-about__media {
		margin: 24px 0 0;
	}

	.ks-about__media img,
	.ks-choose__media img {
		width: 100%;
	}

	.ks-about__body {
		display: contents;
	}

	.ks-about__text {
		margin-top: 24px;
		font-size: 16px;
	}

	/* 足もみの種類 */
	.ks-types {
		padding-top: 56px;
	}

	.ks-types__sub,
	.ks-roots__text {
		width: auto;
		margin-top: 20px;
		font-size: 16px;
		text-align: left;
	}

	.ks-types__lead {
		width: auto;
		margin-top: 20px;
		font-size: 16px;
	}

	.ks-types__list {
		grid-template-columns: 1fr;
		margin-top: 28px;
	}

	.ks-type {
		padding: 28px 20px 24px;
	}

	.ks-type__head {
		min-height: 0;
	}

	.ks-type__title {
		font-size: 20px;
	}

	.ks-type--main .ks-type__title {
		font-size: 26px;
	}

	.ks-type__text {
		font-size: 15px;
	}

	/* 動画 */
	.ks-roots {
		padding-top: 56px;
	}

	.ks-roots__title {
		font-size: 22px;
	}

	.ks-roots__eyebrow {
		font-size: 16px;
	}

	.ks-roots__list {
		grid-template-columns: 1fr;
		gap: 16px;
		margin-top: 24px;
	}

	/* セミナー一覧 */
	.ks-courses {
		padding-top: 56px;
	}

	.ks-courses__list {
		grid-template-columns: 1fr;
		margin-top: 32px;
	}

	.ks-course__head {
		min-height: 0;
		border-width: 6px;
		font-size: 20px;
	}

	.ks-course__body {
		padding: 24px 20px;
		border-width: 6px;
	}

	.ks-course__features {
		font-size: 16px;
	}

	.ks-course__features li {
		margin-left: 22px;
	}

	.ks-course__actions .ks-btn {
		width: 100%;
		max-width: 260px;
		height: 56px;
	}

	/* バンド */
	.ks-band {
		min-height: 0;
		margin-top: 64px;
		padding: 48px 20px;
	}

	.ks-band--closing {
		margin-top: 64px;
	}

	.ks-band__title {
		font-size: 24px;
	}

	.ks-band--closing .ks-band__title {
		font-size: 24px;
	}

	.ks-band__sub {
		margin-top: 16px;
		font-size: 16px;
	}

	.ks-band__list {
		font-size: 16px;
	}

	.ks-band__list li {
		margin-left: 22px;
	}

	.ks-band .ks-btn,
	.ks-band--closing .ks-btn {
		width: 100%;
		max-width: 344px;
		height: 60px;
		margin-top: 28px;
	}

	/* セミナーの選び方 */
	.ks-choose {
		padding-top: 56px;
	}

	.ks-choose__media {
		margin: 24px 0 0;
	}

	.ks-choose__list {
		margin-top: 28px;
	}

	.ks-choose__row {
		flex-wrap: wrap;
		gap: 10px;
		height: auto;
		font-size: 16px;
	}

	/* 矢印は「〜な方は」の直後に置く（右端に浮かせない） */
	.ks-choose__from {
		flex: 0 1 auto;
	}

	.ks-choose__arrow {
		flex: 0 0 40px;
		height: 14px;
		margin-top: 7px;
	}

	.ks-choose__to {
		flex: 1 1 100%;
		padding-left: 22px;
	}

	.ks-choose__body .ks-btn {
		display: flex;
		width: 100%;
		max-width: 307px;
		margin: 32px auto 0;
	}

	/* FAQ */
	.ks-faq {
		padding-top: 56px;
	}

	.ks-faq__list {
		margin-top: 28px;
	}

	.ks-faq__q {
		gap: 12px;
		min-height: 56px;
		font-size: 16px;
	}

	.ks-faq__q::before {
		flex-basis: 34px;
		font-size: 28px;
	}

	.ks-faq__a {
		padding-left: 46px;
		font-size: 15px;
	}

	.ks-faq .ks-btn {
		width: 100%;
		max-width: 307px;
		margin-top: 32px;
	}

	/* お問い合わせ */
	.ks-contact {
		padding: 48px 0;
	}

	.ks-contact__cols {
		display: block;
		margin-top: 32px;
	}

	.ks-contact__col {
		padding: 0 20px;
	}

	.ks-contact__col + .ks-contact__col {
		/* PC の padding: 0 0 0 68px を全部上書きする（左寄りずれ防止） */
		margin-top: 32px;
		padding: 32px 20px 0;
		border-left: 0;
		border-top: 1px solid var(--ks-ink);
	}

	.ks-contact__label {
		font-size: 18px;
	}

	.ks-contact__box {
		min-height: 84px;
		margin-top: 16px;
	}

	/* 小さい端末でも1行に収まるよう幅に応じて可変させる */
	.ks-contact__box-form {
		gap: 3.2vw;
		font-size: clamp(15px, 4.7vw, 19px);
		white-space: nowrap;
	}

	.ks-contact__box-form::before {
		width: clamp(24px, 7.5vw, 30px);
		height: clamp(24px, 7.5vw, 30px);
	}

	.ks-contact__box-tel {
		--ks-tel-icon: clamp(28px, 9vw, 36px);
		--ks-tel-gap: 3.2vw;
	}

	.ks-contact__tel {
		font-size: clamp(23px, 7.4vw, 30px);
		white-space: nowrap;
	}

	.ks-contact__hours {
		margin-top: 6px;
		font-size: clamp(11px, 3.3vw, 13px);
		white-space: nowrap;
		transform: translateX(calc((var(--ks-tel-icon) + var(--ks-tel-gap)) / 2));
	}

	/* TOPヒーロー */
	.ks-home-hero__inner {
		height: 440px;
		padding: 0 16px;
	}

	.ks-home-hero__title {
		top: 100px;
		font-size: 26px;
		letter-spacing: 4px;
	}

	.ks-home-hero__action {
		bottom: 32px;
		width: 100%;
		max-width: 320px;
		padding: 0 16px;
		box-sizing: border-box;
	}

	.ks-home-hero__action .ks-btn {
		width: 100%;
		height: 60px;
	}

	/* TOPお知らせ */
	.ks-news__box {
		padding: 32px 0;
	}

	.ks-news__list {
		margin-top: 24px;
		padding: 0 16px;
	}

	.ks-news__link {
		flex-wrap: wrap;
		gap: 4px 12px;
		min-height: 0;
		padding: 14px 0;
		font-size: 15px;
	}

	.ks-news__date {
		flex: 0 0 auto;
	}

	.ks-news__cat {
		flex: 0 0 auto;
		height: 28px;
		margin-right: 0;
		padding: 0 14px;
		border-radius: 14px;
		font-size: 14px;
	}

	.ks-news__cat--empty {
		display: none;
	}

	.ks-news__title {
		flex: 1 1 100%;
		white-space: normal;
	}

	.ks-news__plus {
		display: none;
	}

	/* TOP官足法究楽部とは：flex を解除して文章として折り返させる */
	.ks-intro__title {
		display: block;
		white-space: normal;
		text-align: center;
	}

	.ks-intro__title-kan {
		font-size: 34px;
	}

	.ks-intro__title-lead {
		font-size: 20px;
	}

	.ks-intro__body,
	.ks-intro__closing {
		font-size: 16px;
	}

	.ks-br-sp {
		display: inline;
	}

	/* TOPセミナー告知 */
	.ks-promo__title {
		font-size: 22px;
	}

	.ks-promo__actions {
		flex-direction: column;
		gap: 12px;
		margin-top: 24px;
	}

	.ks-promo__actions .ks-btn {
		width: 100%;
		max-width: 300px;
		height: 56px;
	}

	/* TOPコラム */
	.ks-column {
		padding: 48px 0 56px;
	}

	.ks-column__list {
		grid-template-columns: minmax(0, 350px);
		gap: 20px;
		margin-top: 28px;
	}

	.ks-column__card {
		width: 100%;
		max-width: 350px;
		min-height: 0;
	}

	.ks-column__link {
		padding: 24px;
	}

	.ks-column__thumb {
		width: 100%;
		height: auto;
		aspect-ratio: 226 / 148;
	}

	.ks-column__date,
	.ks-column__title {
		font-size: 15px;
	}

	.ks-column__cat {
		min-width: 103px;
		height: 33px;
		font-size: 14px;
	}

	.ks-column__more {
		width: 100%;
		max-width: 307px;
	}

	/* TOPフッター */
	.ks-footer__logo {
		width: 320px;
		height: auto;
	}

	.ks-footer__address {
		margin-top: 20px;
		font-size: 16px;
	}

	.ks-footer__nav ul {
		gap: 12px 20px;
	}

	.ks-footer__copyright {
		padding: 28px 16px 14px;
		font-size: 12px;
	}

	/* #copy / #powerd は ID セレクタで 14px を持っているため、
	   親の .ks-footer__copyright の font-size では上書きできない。
	   SP だけ同じ詳細度で明示的に下げる。 */
	.ks-footer__copyright #copy,
	.ks-footer__copyright #powerd {
		font-size: 9px;
	}
}

/* ==========================================================================
   19. スクロールアニメーション（TOP / セミナーページ）
   --------------------------------------------------------------------------
   js/kansoku-anim.js は <head> で読み込まれ、実行された瞬間に
   <html> へ .ks-anim を付ける。初期状態（非表示）は下の CSS が持つので、
   最初の描画の時点でもう隠れている＝「一瞬見えてから消える」が起きない。
   JS はあとから画面に入った要素に .is-inview を足すだけ。

   ★ 対象セレクタの一覧は js/kansoku-anim.js の SELECTOR と同じ内容にすること。
     （片方だけ足すと「隠れたまま出てこない」「アニメしない」になる）

   transform ではなく translate プロパティで動かしているのは、
   .ks-home-hero__title の translateX(-50%) など既存の transform を
   打ち消さないため。
   ========================================================================== */

@media (prefers-reduced-motion: no-preference) {

	/* :where() は詳細度が 0。ここを (0,1,1) に抑えておくことで、
	   下の .is-inview や個別指定 (0,2,1) が確実に勝つ。 */
	html.ks-anim :where(.ks-page, .ks-contact) :where(
		.ks-sec-title,
		.ks-hero__badge, .ks-hero__title, .ks-hero__actions,
		.ks-about__media, .ks-about__text,
		.ks-types__lead, .ks-types__sub, .ks-type,
		.ks-roots__eyebrow, .ks-roots__title, .ks-roots__item, .ks-roots__text,
		.ks-course,
		.ks-band__title, .ks-band__sub, .ks-band__list, .ks-band .ks-btn,
		.ks-choose__media, .ks-choose__row, .ks-choose__body .ks-btn,
		.ks-faq__item, .ks-faq .ks-btn,
		.ks-contact__col,
		.ks-home-hero__title, .ks-home-hero__action,
		.ks-news__item, .ks-news .ks-btn,
		.ks-intro__title, .ks-intro__photo, .ks-intro__body, .ks-intro__closing,
		.ks-promo__title, .ks-promo__actions,
		.ks-column__card, .ks-column__more
	) {
		opacity: 0;
		translate: 0 32px;
		transition:
			opacity 0.8s cubic-bezier(0.22, 0.61, 0.36, 1),
			translate 0.8s cubic-bezier(0.22, 0.61, 0.36, 1);
		transition-delay: var(--ks-delay, 0s);
	}

	/* ヒーローの主役（バッジ・縦書き見出し）は動かさず、その場でフェードだけさせる */
	html.ks-anim .ks-hero__badge,
	html.ks-anim .ks-home-hero__title {
		translate: none;
	}

	html.ks-anim .ks-hero__title {
		transition-delay: 0.12s;
	}

	html.ks-anim .ks-hero__actions {
		transition-delay: 0.24s;
	}

	html.ks-anim .ks-home-hero__action {
		transition-delay: 0.2s;
	}

	/* 左右から寄ってくるのは写真だけ（PC・タブレットのみ）。
	   テキストは見出しも本文もすべて下からのフェードで統一する。
	   同じカラム内で見出しだけ上下・本文だけ左右に動くとちぐはぐに見えるため。 */
	@media screen and (min-width: 768px) {

		html.ks-anim .ks-about__media,
		html.ks-anim .ks-choose__media,
		html.ks-anim .ks-intro__photo--left {
			translate: -32px 0;
		}

		html.ks-anim .ks-intro__photo--right {
			translate: 32px 0;
		}
	}

	/* 表示状態。上の個別指定と詳細度が同じ (0,2,1) なので、必ず最後に置く。 */
	html.ks-anim .is-inview {
		opacity: 1;
		translate: none;
	}
}

/* --- ホバー／操作のトランジション ---
   出現アニメは translate、ホバーは transform と別プロパティを使い分けている。
   同じプロパティだと「出現後の translate: none」に負けてホバーが効かなくなるため。 */
.ks-btn {
	transition: background-color 0.25s, color 0.25s, border-color 0.25s, opacity 0.25s, transform 0.25s;
}

.ks-btn:hover {
	transform: translateY(-2px);
}

.ks-column__card {
	transition: transform 0.3s, box-shadow 0.3s;
}

.ks-column__card:hover {
	transform: translateY(-4px);
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.1);
}

.ks-column__thumb,
.ks-about__media img,
.ks-choose__media img {
	transition: scale 0.5s;
}

.ks-column__link:hover .ks-column__thumb {
	scale: 1.04;
}

/* FAQ アコーディオンの開閉 */
.ks-faq__q::after,
.ks-faq__q > span {
	transition: rotate 0.25s;
}

@media (prefers-reduced-motion: reduce) {

	.ks-btn,
	.ks-column__card,
	.ks-column__thumb,
	.ks-about__media img,
	.ks-choose__media img {
		transition: none;
	}
}


/* SPのみ非表示：トップ導入部の右写真（feet-rainbow.jpg） */
@media screen and (max-width: 767px) {
	.ks-intro__photo--right {
		display: none;
	}
}


/* =========================================================
   ナビ プルダウン（ホバーで子ページ一覧を表示）
   子ページは functions.php の kansoku_nav_items() で設定
   ========================================================= */
@media screen and (min-width: 1025px) {
	/* ヘッダー：項目が多いときはスクロール */
	.ks-header__nav .sub-menu {
		z-index: 100;
		max-height: 70vh;
		overflow-y: auto;
		text-align: left;
	}
	.ks-header__nav .sub-menu a {
		white-space: nowrap;
		font-size: 15px;
	}
	.ks-header__nav .sub-menu a:hover {
		background: rgba(195, 1, 0, 0.06);
		opacity: 1;
	}
	/* 右端の項目は画面外にはみ出さないよう右揃え */
	.ks-header__menu > li:last-child > .sub-menu {
		left: auto;
		right: 0;
		transform: translate(0, 6px);
	}
	.ks-header__menu > li:last-child:hover > .sub-menu,
	.ks-header__menu > li:last-child:focus-within > .sub-menu {
		transform: translate(0, 0);
	}

	/* フッター：上方向に開く */
	.ks-footer__nav li {
		position: relative;
	}
	.ks-footer__nav .sub-menu {
		position: absolute;
		bottom: 100%;
		left: 50%;
		z-index: 100;
		display: block;
		min-width: 220px;
		max-height: 60vh;
		overflow-y: auto;
		margin: 0;
		padding: 8px 0;
		background: var(--ks-white);
		box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.18);
		text-align: left;
		opacity: 0;
		visibility: hidden;
		transform: translate(-50%, -6px);
		transition: opacity 0.2s, transform 0.2s, visibility 0.2s;
	}
	/* 親リンクとプルダウンの間でホバーが切れないよう余白を確保 */
	.ks-footer__nav .menu-item-has-children > a {
		display: inline-block;
		padding-bottom: 12px;
		margin-bottom: -12px;
	}
	.ks-footer__nav li:hover > .sub-menu,
	.ks-footer__nav li:focus-within > .sub-menu {
		opacity: 1;
		visibility: visible;
		transform: translate(-50%, -8px);
	}
	.ks-footer__nav .sub-menu li {
		display: block;
	}
	.ks-footer__nav .sub-menu a {
		display: block;
		padding: 8px 20px;
		color: var(--ks-red);
		font-size: 15px;
	}
	.ks-footer__nav .sub-menu a:hover {
		color: var(--ks-red);
		background: rgba(195, 1, 0, 0.06);
	}
	.ks-footer__nav .ks-footer__menu > li:first-child > .sub-menu {
		left: 0;
		transform: translate(0, -6px);
	}
	.ks-footer__nav .ks-footer__menu > li:first-child:hover > .sub-menu,
	.ks-footer__nav .ks-footer__menu > li:first-child:focus-within > .sub-menu {
		transform: translate(0, -8px);
	}
	.ks-footer__nav .ks-footer__menu > li:last-child > .sub-menu {
		left: auto;
		right: 0;
		transform: translate(0, -6px);
	}
	.ks-footer__nav .ks-footer__menu > li:last-child:hover > .sub-menu,
	.ks-footer__nav .ks-footer__menu > li:last-child:focus-within > .sub-menu {
		transform: translate(0, -8px);
	}
}

/* タブレット・SP：フッターの子ページは非表示（全ページはヘッダーのメニュー内に表示） */
@media screen and (max-width: 1024px) {
	.ks-footer__nav .sub-menu {
		display: none;
	}
}

/* プルダウンが画面右にはみ出して横スクロール（右の余白）が出ないようにする */
.ks-header,
.ks-footer {
	overflow-x: clip;
}
@media screen and (min-width: 1025px) {
	/* 長いページ名は折り返して幅を抑える */
	.ks-header__nav .sub-menu,
	.ks-footer__nav .sub-menu {
		width: max-content;
		max-width: 320px;
	}
	.ks-header__nav .sub-menu a,
	.ks-footer__nav .sub-menu a {
		white-space: normal;
		line-height: 1.5;
	}
}

@media screen and (min-width: 1025px) {
	/* フッターのナビは右寄せ配置のため、プルダウンは項目の右端を基準に左方向へ開く */
	.ks-footer__nav .ks-footer__menu > li > .sub-menu {
		left: auto;
		right: 0;
		transform: translate(0, -6px);
	}
	.ks-footer__nav .ks-footer__menu > li:hover > .sub-menu,
	.ks-footer__nav .ks-footer__menu > li:focus-within > .sub-menu {
		transform: translate(0, -8px);
	}
}

/* =========================================================
   プルダウンの見た目調整（PC）
   ========================================================= */
@media screen and (min-width: 1025px) {
	/* 子ページを持つ項目に下向き矢印 */
	.ks-header__menu > .menu-item-has-children > a {
		display: inline-flex;
		align-items: center;
		gap: 6px;
	}
	.ks-header__menu > .menu-item-has-children > a::after {
		content: "";
		width: 6px;
		height: 9px;
		margin-top: -3px;
		border-right: 1.5px solid currentColor;
		border-bottom: 1.5px solid currentColor;
		transform: rotate(45deg);
		transition: transform 0.2s, margin 0.2s;
	}
	.ks-header__menu > .menu-item-has-children:hover > a::after,
	.ks-header__menu > .menu-item-has-children:focus-within > a::after {
		margin-top: 3px;
		transform: scaleY(-1) rotate(45deg);
	}

	/* 親項目とプルダウンの隙間でホバーが切れないようにする */
	.ks-header__menu > .menu-item-has-children::after {
		content: "";
		position: absolute;
		top: 100%;
		left: -12px;
		right: -12px;
		height: 22px;
	}

	/* プルダウン本体 */
	.ks-header__nav .sub-menu {
		top: calc(100% + 18px);
		min-width: 240px;
		padding: 6px 0;
		border-top: 3px solid var(--ks-red);
		border-radius: 0 0 8px 8px;
		box-shadow: 0 10px 28px rgba(0, 0, 0, 0.14);
		overflow: hidden auto;
	}
	.ks-header__nav .sub-menu li + li {
		border-top: 1px solid rgba(195, 1, 0, 0.1);
	}
	.ks-header__nav .sub-menu a {
		position: relative;
		padding: 13px 40px 13px 22px;
		color: #333;
		font-size: 14px;
		font-weight: 500;
		letter-spacing: 0.04em;
		transition: background-color 0.2s, color 0.2s, padding 0.2s;
	}
	/* 右端の小さな矢印 */
	.ks-header__nav .sub-menu a::after {
		content: "";
		position: absolute;
		top: 50%;
		right: 20px;
		width: 6px;
		height: 6px;
		margin-top: -3px;
		border-top: 1.5px solid var(--ks-red);
		border-right: 1.5px solid var(--ks-red);
		transform: rotate(45deg);
		opacity: 0.5;
		transition: right 0.2s, opacity 0.2s;
	}
	.ks-header__nav .sub-menu a:hover,
	.ks-header__nav .sub-menu a:focus-visible {
		padding-left: 26px;
		color: var(--ks-red);
		background: #fdf3f3;
		opacity: 1;
	}
	.ks-header__nav .sub-menu a:hover::after,
	.ks-header__nav .sub-menu a:focus-visible::after {
		right: 16px;
		opacity: 1;
	}

	/* フッターも同じトーンに */
	.ks-footer__nav .sub-menu {
		min-width: 240px;
		padding: 6px 0;
		border-bottom: 3px solid var(--ks-red);
		border-radius: 8px 8px 0 0;
		box-shadow: 0 -10px 28px rgba(0, 0, 0, 0.25);
	}
	.ks-footer__nav .sub-menu li + li {
		border-top: 1px solid rgba(195, 1, 0, 0.1);
	}
	.ks-footer__nav .sub-menu a {
		padding: 12px 22px;
		color: #333;
		font-size: 14px;
		text-decoration: none;
		transition: background-color 0.2s, color 0.2s;
	}
	.ks-footer__nav .sub-menu a:hover {
		color: var(--ks-red);
		background: #fdf3f3;
		text-decoration: none;
	}
}

@media screen and (min-width: 1025px) {
	/* ヘッダーのプルダウンは親項目の左端にそろえる（ロゴに被らないように） */
	.ks-header__menu > li > .sub-menu {
		left: -16px;
		right: auto;
		transform: translate(0, 6px);
	}
	.ks-header__menu > li:hover > .sub-menu,
	.ks-header__menu > li:focus-within > .sub-menu {
		transform: translate(0, 0);
	}
	/* 右端の項目のみ右端にそろえる */
	.ks-header__menu > li:last-child > .sub-menu {
		left: auto;
		right: -16px;
	}
}

/* SP・タブレット：開いたメニューが画面より長い場合はメニュー内でスクロール */
@media screen and (max-width: 1024px) {
	.ks-header__body {
		max-height: calc(100vh - var(--ks-header-h));
		max-height: calc(100dvh - var(--ks-header-h));
		min-height: 0;
		box-sizing: border-box;
		overflow-y: auto;
		overscroll-behavior: contain;
	}
	/* 子ページは常に表示（PC用のアニメーションを無効化） */
	.ks-header__nav .sub-menu {
		transition: none;
	}
}

/* ログイン中（管理バー表示時）は管理バーの高さ分を差し引く */
@media screen and (max-width: 1024px) {
	body.admin-bar .ks-header__body {
		max-height: calc(100vh - var(--ks-header-h) - 32px);
		max-height: calc(100dvh - var(--ks-header-h) - 32px);
		min-height: 0;
	}
}
@media screen and (max-width: 782px) {
	body.admin-bar .ks-header__body {
		max-height: calc(100vh - var(--ks-header-h) - 46px);
		max-height: calc(100dvh - var(--ks-header-h) - 46px);
		min-height: 0;
	}
}

/* =========================================================
   フッターナビ：プルダウンをやめ、子ページを常に一覧表示
   （上のプルダウン用指定を上書き）
   ========================================================= */
.ks-footer .ks-footer__nav .ks-footer__menu {
	align-items: flex-start;
	gap: 24px 40px;
}
.ks-footer .ks-footer__nav .ks-footer__menu > li {
	position: static;
}
.ks-footer .ks-footer__nav .ks-footer__menu > li > a {
	display: inline-block;
	margin: 0;
	padding: 0;
	font-weight: 700;
}
.ks-footer .ks-footer__nav .ks-footer__menu > li > .sub-menu,
.ks-footer .ks-footer__nav .ks-footer__menu > li:hover > .sub-menu,
.ks-footer .ks-footer__nav .ks-footer__menu > li:focus-within > .sub-menu {
	position: static;
	display: block;
	min-width: 0;
	width: auto;
	max-width: none;
	max-height: none;
	overflow: visible;
	margin: 12px 0 0;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: none;
}
.ks-footer .ks-footer__nav .sub-menu li {
	display: block;
	margin: 0;
	padding: 0;
	border: 0;
}
.ks-footer .ks-footer__nav .sub-menu li + li {
	margin-top: 8px;
	border: 0;
}
.ks-footer .ks-footer__nav .sub-menu a {
	position: relative;
	display: inline-block;
	padding: 0 0 0 14px;
	color: rgba(255, 255, 255, 0.8);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
	white-space: normal;
	background: none;
}
.ks-footer .ks-footer__nav .sub-menu a::before {
	content: "";
	position: absolute;
	top: 0.75em;
	left: 0;
	width: 6px;
	height: 1px;
	background: currentColor;
}
.ks-footer .ks-footer__nav .sub-menu a:hover {
	color: var(--ks-white);
	background: none;
	text-decoration: underline;
}

@media screen and (max-width: 1024px) {
	.ks-footer .ks-footer__nav .ks-footer__menu {
		justify-content: center;
		gap: 24px 32px;
	}
}
@media screen and (max-width: 767px) {
	/* SPは2列で表示 */
	.ks-footer .ks-footer__nav .ks-footer__menu {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 24px 20px;
		text-align: left;
	}
	.ks-footer .ks-footer__nav .ks-footer__menu > li > a {
		white-space: normal;
	}
}

/* フッターナビ：PC・タブレットは3列のグリッドで整列 */
@media screen and (min-width: 768px) {
	.ks-footer .ks-footer__nav .ks-footer__menu {
		display: grid;
		grid-template-columns: repeat(3, max-content);
		gap: 28px 56px;
	}
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
	.ks-footer .ks-footer__nav .ks-footer__menu {
		justify-content: center;
	}
}

/* __________________________________________________________________________
   PC幅が狭いとき（1025〜1279px）のはみ出し対策（右側の余白・横スクロール防止）
   __________________________________________________________________________ */
@media screen and (min-width: 1025px) and (max-width: 1279px) {
	.ks-about__inner,
	.ks-choose__inner {
		gap: 40px;
		padding-left: 20px;
	}
	.ks-about__media,
	.ks-choose__media {
		flex: 0 1 417px;
		min-width: 0;
	}
	.ks-about__body,
	.ks-choose__body {
		flex: 1 1 auto;
		min-width: 0;
	}
	.ks-about__media img,
	.ks-choose__media img {
		width: 100%;
		height: auto;
		aspect-ratio: 417 / 270;
	}
	.ks-courses__list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
	.ks-choose__note {
		white-space: normal;
	}
}

/* __________________________________________________________________________
   SP：フッターナビのタップ領域を広げ、隣のリンクの誤タップを防ぐ
   __________________________________________________________________________ */
@media screen and (max-width: 767px) {
	.ks-footer .ks-footer__nav .ks-footer__menu {
		row-gap: 12px;
	}
	.ks-footer .ks-footer__nav .ks-footer__menu a,
	.ks-footer .ks-footer__nav .ks-footer__menu > li > a {
		display: block;
		padding-top: 6px;
		padding-bottom: 6px;
	}
}

/* reCAPTCHAバッジを非表示（visibility で隠すことで reCAPTCHA の動作は維持） */
.grecaptcha-badge {
	visibility: hidden !important;
}