@charset "UTF-8";
/* ============================================
   AIセキュリティ部長 LP（/ai-services/security/）
   design: ALION AI Security.dc.html

   この LP ではサイト共通 CSS（reset / component / post / page / ai-navigation）を
   読み込まないため、リセットもこのファイルで持つ。
   設計の inline style をそのままクラスに置き換えている（値は設計どおり）。
   リセットは :where() で詳細度 0 にしてあるので、各クラスの指定が必ず勝つ
   （設計で inline style がリセットに勝っていたのと同じ優先関係）。
============================================ */

@font-face {
	font-family: 'Chillax-local';
	src: url('../font/Chillax-Medium.woff2') format('woff2'), url('../font/Chillax-Medium.woff') format('woff');
	font-weight: 500;
	font-style: normal;
}

/* ---- リセット（設計の helmet 内 style を LP 内に限定） ---- */
html {
	scroll-behavior: smooth;
}

body.secBody {
	margin: 0;
	padding: 0;
	background: #fff;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

:where(.secPage, .secPage *) {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

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

:where(.secPage img) {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

:where(.secPage a) {
	color: inherit;
	text-decoration: none;
}

:where(.secPage a:hover) {
	color: #005FFF;
}

:where(.secPage summary) {
	list-style: none;
	cursor: pointer;
}

.secPage summary::-webkit-details-marker {
	display: none;
}

/* メニュー・フォーム・送信完了の切り替えは hidden 属性で行う */
.secPage [hidden] {
	display: none !important;
}

/* svg は width/height 属性で寸法を持つ（すべて正方形）。
   全体 CSS の svg{width:100%;height:100%} が万一読み込まれても崩れないよう、属性値で固定しておく */
.secPage svg[width="12"] { width: 12px; height: 12px; }
.secPage svg[width="13"] { width: 13px; height: 13px; }
.secPage svg[width="14"] { width: 14px; height: 14px; }
.secPage svg[width="15"] { width: 15px; height: 15px; }
.secPage svg[width="16"] { width: 16px; height: 16px; }
.secPage svg[width="18"] { width: 18px; height: 18px; }
.secPage svg[width="22"] { width: 22px; height: 22px; }
.secPage svg[width="24"] { width: 24px; height: 24px; }
.secPage svg[width="28"] { width: 28px; height: 28px; }
.secPage svg[width="30"] { width: 30px; height: 30px; }
.secPage svg[width="120"] { width: 120px; height: 120px; }

/* ---- ページ全体（設計の最上位 div） ---- */
.secPage {
	font-family: 'Satoshi', 'Chillax-local', '游ゴシック Medium', 'Yu Gothic Medium', YuGothic, 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
	font-size: 16px;
	line-height: 2;
	letter-spacing: 0.06em;
	color: #172033;
	font-weight: 400;
	background: #fff;
	font-feature-settings: 'palt';
}

/* ---- 共通 ---- */
.secInner {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
}

/* 英字見出し・数字（Chillax） */
.secEyebrow,
.secHero-priceNum,
.secScore-num,
.secScore-label,
.secProblems-num,
.secSolution-num,
.secFeatures-num,
.secDash-kpiNum,
.secWhyAlion-num,
.secCert-label,
.secFlow-label,
.secPlan-name span,
.secPlan-priceNum,
.secFaq-qNum {
	font-family: 'Chillax', 'Chillax-local', sans-serif;
}

/* セクション見出し行（左：英字ラベル＋見出し / 右：リード文） */
.secHead {
	display: flex;
	flex-wrap: wrap;
	gap: 16px 60px;
	align-items: flex-end;
	justify-content: space-between;
}

.secHead-lead {
	flex: 1 1 380px;
	max-width: 560px;
	font-size: 15px;
	line-height: 1.95;
	color: #64748B;
	letter-spacing: normal;
}

.secHead-lead--narrow {
	flex: 1 1 360px;
	max-width: 520px;
}

.secHead-lead p + p {
	margin-top: 8px;
}

.secEyebrow {
	font-size: 14px;
	font-weight: 600;
	color: #005FFF;
	letter-spacing: .16em;
	line-height: 1.4;
}

.secEyebrow--light {
	color: #5ECEE5;
}

.secTitle {
	font-size: min(38px, 6.6vw);
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: .02em;
	color: #172033;
	margin-top: 10px;
}

.secTitle--white {
	color: #fff;
}

.secTitle--sm {
	font-size: min(36px, 6.4vw);
	line-height: 1.55;
}

/* 小見出し（18px）と説明文（14px）の共通値 */
.secFeatures-title,
.secWhyAlion-pointTitle,
.secCert-title,
.secFlow-title {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.5;
}

.secProblems-text,
.secFeatures-text,
.secWhyAlion-pointText,
.secCert-text,
.secFlow-text {
	font-size: 14px;
	line-height: 1.9;
	color: #64748B;
	letter-spacing: normal;
}

/* 角丸ボタン（基本は青。サイズ・色は修飾クラスで） */
.secBtn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: #005FFF;
	color: #fff;
	font-weight: 700;
	border-radius: 100px;
	letter-spacing: normal;
	transition: all .3s;
}

.secBtn:hover {
	background: #1F74FF;
	color: #fff;
}

.secBtn-hero {
	padding: 16px 28px;
	font-size: 15px;
	box-shadow: 0 12px 28px rgba(0, 95, 255, .4);
}

.secBtn-hero:hover {
	transform: translateY(-2px);
}

.secBtn-ghost {
	background: transparent;
	padding: 16px 26px;
	font-size: 15px;
	border: 1px solid rgba(255, 255, 255, .42);
}

.secBtn-ghost:hover {
	background: rgba(255, 255, 255, .1);
	color: #fff;
}

.secBtn-sm {
	padding: 14px 26px;
	font-size: 14px;
}

.secBtn-dark {
	background: #172033;
	padding: 15px 30px;
	font-size: 15px;
}

.secBtn-dark:hover {
	background: #005FFF;
	color: #fff;
}

.secBtn-plan {
	margin-top: auto;
	display: flex;
	justify-content: center;
	padding: 16px 20px;
	font-size: 15px;
	box-shadow: 0 12px 26px rgba(0, 95, 255, .3);
}

/* ---- ヘッダー ---- */
.secHeader {
	padding: 12px min(28px, 2.2vw);
	position: fixed;
	top: 20px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 92%;
	max-width: 1440px;
	z-index: 10000;
	background: rgba(255, 255, 255, .92);
	-webkit-backdrop-filter: blur(80px);
	backdrop-filter: blur(80px);
	box-shadow: 3px 3px 10px rgba(0, 0, 0, .06);
	border-radius: 10px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	column-gap: 18px;
}

/* ログイン中の管理バー（32px / 782px 以下は 46px）の分だけ下げる */
.admin-bar .secHeader {
	top: 52px;
}

.secHeader-left {
	display: flex;
	align-items: center;
	gap: min(36px, 2.6vw);
	min-width: 0;
}

.secHeader-logos {
	display: flex;
	align-items: center;
	gap: 14px;
	flex: 0 0 auto;
}

.secHeader-alion,
.secHeader-product {
	display: block;
}

.secHeader-alionImg {
	width: 70px;
	display: block;
}

.secHeader-sep {
	width: 1px;
	height: 24px;
	background: #CFD5D8;
}

.secHeader-productImg {
	height: 30px;
	width: auto;
	display: block;
}

.secHeader-navList {
	display: flex;
	align-items: center;
	gap: min(26px, 1.8vw);
}

.secHeader-navLink {
	display: block;
	padding: 10px 0;
	font-size: 14px;
	color: #0D0D0D;
	white-space: nowrap;
	line-height: 1;
	letter-spacing: normal;
	transition: color .3s;
}

.secHeader-navLink:hover {
	color: #005FFF;
}

.secHeader-right {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 0 0 auto;
}

.secHeader-cta {
	font-size: 14px;
	color: #fff;
	padding: 12px 20px;
	border-radius: 5px;
	line-height: 1;
	font-weight: 700;
	letter-spacing: normal;
	white-space: nowrap;
	border: 1px solid #005FFF;
	background: #005FFF;
	transition: all .3s;
}

.secHeader-cta:hover {
	background: #fff;
	color: #005FFF;
}

.secHeader-burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 10px;
	border: 1px solid #E4E8EE;
	background: #fff;
	cursor: pointer;
	flex: 0 0 auto;
}

/* ---- メニュー（右から出るパネル） ---- */
.secMenu {
	position: fixed;
	inset: 0;
	z-index: 15000;
	background: rgba(10, 20, 40, .45);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}

.secMenu-panel {
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	width: min(330px, 86vw);
	background: #fff;
	box-shadow: -12px 0 44px rgba(0, 0, 0, .22);
	padding: 22px 22px 40px;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

/* 管理バーに閉じるボタンが隠れないように */
.admin-bar .secMenu-panel {
	padding-top: 54px;
}

.secMenu-closeRow {
	display: flex;
	justify-content: flex-end;
}

.secMenu-close {
	background: #F1F3F6;
	border: none;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.secMenu-label {
	font-size: 11px;
	font-weight: 700;
	color: #8A94A3;
	letter-spacing: .1em;
	margin: 6px 8px 4px;
}

.secMenu-link {
	display: block;
	padding: 12px;
	border-radius: 9px;
	font-size: 15px;
	color: #1A212F;
	letter-spacing: normal;
}

.secMenu-link:hover {
	background: #F1F5FF;
	color: #005FFF;
}

.secMenu-divider {
	height: 1px;
	background: #EEF1F5;
	margin: 10px 8px;
}

.secMenu-cta {
	margin-top: 16px;
	display: block;
	text-align: center;
	font-size: 15px;
	color: #fff;
	padding: 15px;
	border-radius: 10px;
	font-weight: 700;
	background: #005FFF;
	letter-spacing: normal;
}

.secMenu-cta:hover {
	color: #fff;
	opacity: .9;
}

.secMain {
	overflow: hidden;
}

/* ---- Hero ---- */
.secHero {
	position: relative;
	overflow: hidden;
	background: #0B1425;
	padding: 148px 0 96px;
	color: #fff;
}

.secHero-grid {
	position: absolute;
	inset: 0;
	background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
	background-size: 56px 56px;
	-webkit-mask-image: radial-gradient(ellipse at 72% 38%, #000 20%, transparent 72%);
	mask-image: radial-gradient(ellipse at 72% 38%, #000 20%, transparent 72%);
	pointer-events: none;
}

.secHero-glow {
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
}

.secHero-glow--blue {
	width: 680px;
	height: 680px;
	right: -140px;
	top: -160px;
	background: radial-gradient(circle, rgba(0, 95, 255, .34) 0%, rgba(0, 95, 255, 0) 65%);
}

.secHero-glow--cyan {
	width: 520px;
	height: 520px;
	left: -200px;
	bottom: -240px;
	background: radial-gradient(circle, rgba(94, 206, 229, .16) 0%, rgba(94, 206, 229, 0) 65%);
}

.secHero-inner {
	position: relative;
	z-index: 1;
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 56px min(56px, 5vw);
	align-items: center;
}

.secHero-copy {
	flex: 1 1 520px;
	min-width: 290px;
}

.secHero-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}

.secHero-tag {
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	letter-spacing: .04em;
	padding: 6px 14px;
	border-radius: 100px;
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .2);
	line-height: 1.4;
}

.secHero-status {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 12px;
	font-weight: 700;
	color: #1A212F;
	background: #FABE00;
	border-radius: 100px;
	padding: 6px 12px;
	line-height: 1.4;
	letter-spacing: normal;
	white-space: nowrap;
}

.secHero-statusDot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #1A212F;
}

.secHero-title {
	font-size: min(54px, 8.4vw);
	font-weight: 700;
	line-height: 1.38;
	letter-spacing: .02em;
	margin-top: 22px;
	color: #fff;
}

.secHero-lead {
	font-size: min(20px, 4.6vw);
	font-weight: 700;
	line-height: 1.7;
	letter-spacing: normal;
	margin-top: 18px;
	color: #fff;
}

.secHero-text {
	font-size: 14px;
	line-height: 1.95;
	color: rgba(255, 255, 255, .78);
	letter-spacing: normal;
	margin-top: 16px;
	max-width: 580px;
}

.secHero-text p + p {
	margin-top: 8px;
}

.secHero-price {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 22px;
	margin-top: 24px;
	padding-top: 22px;
	border-top: 1px solid rgba(255, 255, 255, .14);
}

.secHero-priceMain {
	display: flex;
	align-items: baseline;
	gap: 6px;
	letter-spacing: normal;
	line-height: 1;
	flex: 0 0 auto;
}

.secHero-priceUnit {
	font-size: 15px;
	font-weight: 700;
}

.secHero-priceNum {
	font-size: min(52px, 11vw);
	font-weight: 600;
	color: #fff;
}

.secHero-priceYen {
	font-size: 18px;
	font-weight: 700;
}

.secHero-priceTax {
	font-size: 13px;
	color: rgba(255, 255, 255, .72);
}

.secHero-priceNote {
	font-size: 13px;
	color: rgba(255, 255, 255, .76);
	letter-spacing: normal;
	line-height: 1.75;
	flex: 1 1 220px;
}

.secHero-ctas {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 22px;
}

.secHero-checks {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 20px;
	margin-top: 20px;
}

.secHero-checks li {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 13px;
	color: rgba(255, 255, 255, .86);
	letter-spacing: normal;
	line-height: 1.5;
}

.secHero-visual {
	flex: 1 1 400px;
	min-width: 290px;
	max-width: 520px;
	margin: 0 auto;
}

/* Hero：セキュリティ概要カード（デモ） */
.secScore {
	background: #fff;
	border-radius: 18px;
	box-shadow: 0 30px 80px rgba(0, 0, 0, .45);
	color: #172033;
	overflow: hidden;
}

.secScore-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 14px 18px;
	border-bottom: 1px solid #EEF1F5;
}

.secScore-title {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.4;
}

.secScore-demo {
	font-size: 10px;
	font-weight: 700;
	color: #64748B;
	background: #F1F3F6;
	border-radius: 100px;
	padding: 4px 10px;
	letter-spacing: normal;
	white-space: nowrap;
	line-height: 1.4;
}

.secScore-body {
	display: flex;
	flex-wrap: wrap;
	gap: 18px 22px;
	padding: 20px 18px 16px;
	align-items: center;
}

.secScore-ring {
	position: relative;
	width: 120px;
	height: 120px;
	flex: 0 0 auto;
	margin: 0 auto;
}

.secScore-ringVal {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.secScore-num {
	font-size: 36px;
	font-weight: 600;
	color: #172033;
	letter-spacing: normal;
}

.secScore-max {
	font-size: 11px;
	color: #64748B;
	margin-top: 4px;
	letter-spacing: normal;
}

.secScore-list {
	flex: 1 1 180px;
	display: grid;
	gap: 8px;
}

.secScore-label {
	font-size: 11px;
	font-weight: 600;
	color: #64748B;
	letter-spacing: .12em;
	line-height: 1.4;
}

.secScore-row {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 12px;
	border-radius: 10px;
	background: #FFF8EB;
}

.secScore-row--high {
	background: #FFF4F4;
}

.secScore-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #F5A524;
	flex: 0 0 auto;
}

.secScore-row--high .secScore-dot {
	background: #E5484D;
}

.secScore-name {
	flex: 1;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: normal;
	line-height: 1.4;
}

.secScore-count {
	font-size: 13px;
	font-weight: 700;
	color: #A15C00;
	letter-spacing: normal;
	line-height: 1.4;
}

.secScore-row--high .secScore-count {
	color: #C62828;
}

.secScore-trend {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin: 0 18px 34px;
	padding: 12px 14px;
	border-radius: 12px;
	background: #EFFAF8;
}

.secScore-trendLabel {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.4;
}

.secScore-bars {
	display: flex;
	align-items: flex-end;
	gap: 4px;
	height: 24px;
	flex: 1;
	max-width: 96px;
}

.secScore-bars span {
	flex: 1;
	border-radius: 2px;
	background: #B5E8E1;
}

.secScore-bars span:nth-child(1) { height: 40%; }
.secScore-bars span:nth-child(2) { height: 52%; }
.secScore-bars span:nth-child(3) { height: 48%; }
.secScore-bars span:nth-child(4) { height: 64%; background: #7DD8CC; }
.secScore-bars span:nth-child(5) { height: 76%; background: #3FC2B2; }
.secScore-bars span:nth-child(6) { height: 100%; background: #0B8A7C; }

.secScore-trendVal {
	font-size: 12px;
	font-weight: 700;
	color: #0B7A6E;
	letter-spacing: normal;
	line-height: 1.4;
	white-space: nowrap;
}

/* Hero：AI のおすすめ対策（カードに重ねる） */
.secAdvice {
	position: relative;
	z-index: 2;
	margin: -22px 0 0 9%;
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 24px 60px rgba(0, 0, 0, .42);
	padding: 16px 18px;
	color: #172033;
	border: 1px solid #E4E8EE;
}

.secAdvice-head {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.4;
}

.secAdvice-sort {
	margin-left: auto;
	font-size: 10px;
	color: #64748B;
	font-weight: 600;
}

.secAdvice-list {
	display: grid;
	gap: 8px;
	margin-top: 10px;
}

.secAdvice-list li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 12px;
	letter-spacing: normal;
	line-height: 1.5;
}

.secAdvice-num {
	width: 20px;
	height: 20px;
	border-radius: 6px;
	background: #0B1425;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
}

.secAdvice-text {
	flex: 1;
}

.secAdvice-pri {
	font-size: 10px;
	font-weight: 700;
	color: #A15C00;
	background: #FFF2DB;
	border-radius: 100px;
	padding: 2px 9px;
	white-space: nowrap;
}

.secAdvice-pri--high {
	color: #C62828;
	background: #FDECEC;
}

/* ---- こんなお悩み ---- */
.secProblems {
	background: #F7F9FC;
	padding: 96px 0 0;
	scroll-margin-top: 96px;
}

.secProblems-list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 16px;
	margin-top: 40px;
}

.secProblems-item {
	display: flex;
	gap: 18px;
	align-items: flex-start;
	background: #fff;
	border: 1px solid #E4E8EE;
	border-radius: 16px;
	padding: 26px 28px;
}

.secProblems-icon {
	flex: 0 0 auto;
	width: 48px;
	height: 48px;
	border-radius: 12px;
	background: #F1F5FF;
	display: flex;
	align-items: center;
	justify-content: center;
}

.secProblems-num {
	font-size: 13px;
	font-weight: 600;
	color: #94A3B8;
	letter-spacing: .08em;
	line-height: 1.4;
}

.secProblems-title {
	font-size: 17px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: normal;
	margin-top: 2px;
}

.secProblems-text {
	margin-top: 6px;
}

/* 課題 → 解決へのつなぎ（濃紺の帯） */
.secProblems-bridge {
	margin-top: 64px;
	background: #0B1425;
	color: #fff;
	padding: 52px 0;
}

.secProblems-bridgeInner {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 20px 60px;
	align-items: center;
	justify-content: space-between;
}

.secProblems-bridgeCopy {
	flex: 1 1 520px;
}

.secProblems-bridgeLead {
	font-size: min(22px, 4.8vw);
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: normal;
}

.secProblems-bridgeSub {
	font-size: 15px;
	color: rgba(255, 255, 255, .76);
	letter-spacing: normal;
	line-height: 1.9;
	margin-top: 6px;
}

.secProblems-bridgeCatch {
	flex: 0 0 auto;
	font-size: min(26px, 5.6vw);
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.5;
}

.secProblems-bridgeCatch span {
	color: #FABE00;
}

/* ---- 解決策（3ステップ） ---- */
.secSolution {
	background: #fff;
	padding: 96px 0;
	scroll-margin-top: 96px;
}

.secSolution-steps {
	display: flex;
	flex-wrap: wrap;
	gap: 36px 0;
	margin-top: 52px;
}

.secSolution-step {
	flex: 1 1 280px;
	min-width: 260px;
	padding-right: min(28px, 3vw);
}

.secSolution-step:last-child {
	padding-right: 0;
}

.secSolution-stepHead {
	display: flex;
	align-items: center;
	gap: 12px;
}

.secSolution-icon {
	flex: 0 0 auto;
	width: 58px;
	height: 58px;
	border-radius: 16px;
	background: linear-gradient(135deg, #5ECEE5, #005FFF);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 10px 22px rgba(0, 95, 255, .26);
}

.secSolution-icon--dark {
	background: #0B1425;
	box-shadow: 0 10px 22px rgba(11, 20, 37, .25);
}

.secSolution-line {
	flex: 1;
	height: 2px;
	background: repeating-linear-gradient(90deg, #B8CCF5 0 8px, transparent 8px 14px);
}

.secSolution-arrow {
	flex: 0 0 auto;
}

.secSolution-num {
	font-size: 14px;
	font-weight: 600;
	color: #005FFF;
	letter-spacing: .06em;
	margin-top: 18px;
	line-height: 1.4;
}

.secSolution-title {
	font-size: 20px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.5;
	margin-top: 4px;
}

.secSolution-text {
	font-size: 14px;
	line-height: 1.95;
	color: #64748B;
	letter-spacing: normal;
	margin-top: 8px;
}

.secSolution-catch {
	margin-top: 44px;
	padding: 22px 26px;
	border-radius: 14px;
	background: #F1F5FF;
	text-align: center;
	font-size: min(20px, 4.6vw);
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.7;
	color: #172033;
}

.secSolution-catch span {
	color: #005FFF;
}

/* ---- 主な機能 ---- */
.secFeatures {
	background: #F7F9FC;
	padding: 96px 0;
	scroll-margin-top: 96px;
}

/* gap:1px と背景色で罫線を引く */
.secFeatures-list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 1px;
	background: #E4E8EE;
	border: 1px solid #E4E8EE;
	border-radius: 20px;
	overflow: hidden;
	margin-top: 40px;
}

.secFeatures-item {
	background: #fff;
	padding: 30px min(30px, 4vw);
}

.secFeatures-head {
	display: flex;
	align-items: center;
	gap: 12px;
}

.secFeatures-icon {
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: #F1F5FF;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
}

.secFeatures-num {
	font-size: 12px;
	font-weight: 600;
	color: #94A3B8;
	letter-spacing: .12em;
}

.secFeatures-title {
	margin-top: 16px;
}

.secFeatures-text {
	margin-top: 8px;
}

.secFeatures-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 14px;
}

.secFeatures-tags li {
	font-size: 11px;
	font-weight: 600;
	color: #005FFF;
	background: #F1F5FF;
	border-radius: 6px;
	padding: 4px 9px;
	letter-spacing: normal;
	line-height: 1.4;
}

.secFeatures-note {
	font-size: 11px;
	line-height: 1.75;
	color: #64748B;
	letter-spacing: normal;
	margin-top: 12px;
}

.secFeatures-cta {
	margin-top: 24px;
	display: flex;
	flex-wrap: wrap;
	gap: 16px 28px;
	align-items: center;
	justify-content: space-between;
	background: #0B1425;
	border-radius: 16px;
	padding: 22px min(30px, 4vw);
	color: #fff;
}

.secFeatures-ctaText {
	font-size: min(18px, 4.2vw);
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.6;
}

/* ---- ダッシュボード（デモ画面） ---- */
.secDashboard {
	background: #fff;
	padding: 96px 0;
	scroll-margin-top: 96px;
}

.secDashboard-head {
	text-align: center;
	max-width: 720px;
	margin: 0 auto;
}

.secDashboard-lead {
	font-size: 15px;
	line-height: 1.95;
	color: #64748B;
	letter-spacing: normal;
	margin-top: 14px;
}

.secDash {
	margin-top: 44px;
	border-radius: 20px;
	overflow: hidden;
	border: 1px solid #DCE3EC;
	box-shadow: 0 40px 90px rgba(11, 20, 37, .16);
	background: #fff;
}

/* ブラウザ枠 */
.secDash-bar {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 11px 16px;
	background: #F1F3F6;
	border-bottom: 1px solid #E1E6EC;
}

.secDash-dots {
	display: flex;
	gap: 6px;
	flex: 0 0 auto;
}

.secDash-dots span {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #FF5F57;
}

.secDash-dots span:nth-child(2) {
	background: #FEBC2E;
}

.secDash-dots span:nth-child(3) {
	background: #28C840;
}

.secDash-url {
	flex: 1;
	max-width: 380px;
	background: #fff;
	border: 1px solid #E1E6EC;
	border-radius: 6px;
	padding: 4px 12px;
	font-size: 11px;
	color: #94A3B8;
	letter-spacing: normal;
	line-height: 1.6;
	white-space: nowrap;
	overflow: hidden;
}

.secDash-body {
	display: flex;
}

/* サイドメニュー */
.secDash-side {
	flex: 0 0 212px;
	background: #0B1425;
	color: #fff;
	padding: 22px 14px;
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.secDash-logo {
	width: 148px;
	height: auto;
	margin: 2px 8px 20px;
	display: block;
}

.secDash-nav {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	border-radius: 9px;
	font-size: 13px;
	color: rgba(255, 255, 255, .66);
	letter-spacing: normal;
	line-height: 1.4;
}

.secDash-nav--active {
	background: rgba(79, 140, 255, .2);
	font-weight: 700;
	color: #fff;
}

.secDash-navDot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .25);
}

.secDash-nav--active .secDash-navDot {
	background: #FABE00;
}

/* メイン領域 */
.secDash-main {
	flex: 1 1 auto;
	min-width: 0;
	padding: min(26px, 3.4vw);
	background: #F7F9FC;
}

.secDash-top {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.secDash-title {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.4;
}

.secDash-demo {
	font-size: 11px;
	font-weight: 600;
	color: #64748B;
	background: #fff;
	border: 1px solid #E4E8EE;
	border-radius: 100px;
	padding: 4px 12px;
	letter-spacing: normal;
	line-height: 1.5;
}

.secDash-kpis {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 12px;
	margin-top: 16px;
}

.secDash-kpi {
	background: #fff;
	border: 1px solid #E4E8EE;
	border-radius: 12px;
	padding: 14px 16px;
}

.secDash-kpiLabel {
	font-size: 12px;
	color: #64748B;
	letter-spacing: normal;
	line-height: 1.4;
}

.secDash-kpiVal {
	display: flex;
	align-items: baseline;
	gap: 4px;
	margin-top: 6px;
	line-height: 1;
}

.secDash-kpiNum {
	font-size: 30px;
	font-weight: 600;
}

.secDash-kpiUnit {
	font-size: 12px;
	color: #64748B;
}

.secDash-kpiNote {
	font-size: 11px;
	margin-top: 10px;
	letter-spacing: normal;
	line-height: 1.4;
}

.secDash-kpiNum--blue {
	color: #005FFF;
}

.secDash-kpiNum--red,
.secDash-kpiNote--red {
	color: #C62828;
}

.secDash-kpiNum--amber,
.secDash-kpiNote--amber {
	color: #A15C00;
}

.secDash-kpiNum--green,
.secDash-kpiNote--green {
	color: #0B7A6E;
}

.secDash-meter {
	height: 5px;
	border-radius: 5px;
	background: #EEF1F5;
	margin-top: 10px;
	overflow: hidden;
}

.secDash-meterFill {
	width: 72%;
	height: 100%;
	background: linear-gradient(90deg, #5ECEE5, #005FFF);
}

.secDash-panels {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 12px;
	margin-top: 12px;
}

.secDash-panel {
	background: #fff;
	border: 1px solid #E4E8EE;
	border-radius: 12px;
	padding: 18px;
}

.secDash-panelTitle {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.4;
}

.secDash-panelTitle--icon {
	display: flex;
	align-items: center;
	gap: 8px;
}

.secDash-advice {
	display: grid;
	gap: 10px;
	margin-top: 12px;
}

.secDash-adviceItem {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	padding: 12px;
	border-radius: 10px;
	background: #FFFBF2;
	border: 1px solid #F6E6C4;
}

.secDash-adviceItem--high {
	background: #FFF7F7;
	border-color: #F8DADA;
}

.secDash-adviceTag {
	font-size: 11px;
	font-weight: 700;
	color: #A15C00;
	background: #FFF2DB;
	border-radius: 6px;
	padding: 3px 8px;
	white-space: nowrap;
	line-height: 1.5;
	flex: 0 0 auto;
}

.secDash-adviceItem--high .secDash-adviceTag {
	color: #C62828;
	background: #FDECEC;
}

.secDash-adviceText {
	font-size: 13px;
	line-height: 1.75;
	letter-spacing: normal;
}

.secDash-taskHead {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.secDash-progress {
	font-size: 11px;
	color: #64748B;
	letter-spacing: normal;
}

.secDash-taskBar {
	height: 6px;
	border-radius: 6px;
	background: #EEF1F5;
	margin-top: 10px;
	overflow: hidden;
}

.secDash-taskFill {
	width: 57%;
	height: 100%;
	background: #0B8A7C;
}

.secDash-tasks {
	display: grid;
	margin-top: 8px;
}

.secDash-tasks li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 11px 0;
	border-bottom: 1px solid #EEF1F5;
	font-size: 13px;
	letter-spacing: normal;
	line-height: 1.5;
}

.secDash-tasks li:last-child {
	border-bottom: none;
}

.secDash-status {
	font-size: 11px;
	font-weight: 700;
	border-radius: 100px;
	padding: 2px 10px;
	white-space: nowrap;
}

.secDash-status--doing {
	color: #A15C00;
	background: #FFF2DB;
}

.secDash-status--todo {
	color: #64748B;
	background: #F1F3F6;
}

.secDash-status--done {
	color: #0B7A6E;
	background: #E3F6F3;
}

.secDashboard-note {
	font-size: 12px;
	line-height: 1.8;
	color: #64748B;
	letter-spacing: normal;
	margin-top: 16px;
	text-align: center;
}

/* ---- WHY NOW ---- */
.secWhyNow {
	position: relative;
	overflow: hidden;
	background: #0B1425;
	color: #fff;
	padding: 96px 0;
	scroll-margin-top: 96px;
}

.secWhyNow-glow {
	position: absolute;
	width: 620px;
	height: 620px;
	left: -180px;
	top: -220px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(0, 95, 255, .26) 0%, rgba(0, 95, 255, 0) 65%);
	pointer-events: none;
}

.secWhyNow-inner {
	position: relative;
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 44px min(64px, 6vw);
	align-items: flex-start;
}

.secWhyNow-copy {
	flex: 1 1 520px;
	min-width: 290px;
}

.secWhyNow-text {
	font-size: 15px;
	line-height: 2;
	color: rgba(255, 255, 255, .78);
	letter-spacing: normal;
	margin-top: 20px;
}

.secWhyNow-text p + p {
	margin-top: 10px;
}

.secWhyNow-key {
	font-size: min(20px, 4.6vw);
	font-weight: 700;
	color: #fff;
	letter-spacing: normal;
	line-height: 1.7;
	margin-top: 18px;
}

/* 黄色のマーカー線 */
.secWhyNow-key span {
	background: linear-gradient(transparent 62%, rgba(250, 190, 0, .42) 62%);
}

.secWhyNow-after {
	font-size: 15px;
	line-height: 2;
	color: rgba(255, 255, 255, .78);
	letter-spacing: normal;
	margin-top: 6px;
}

.secWhyNow-refs {
	flex: 1 1 380px;
	min-width: 290px;
}

.secWhyNow-refLabel {
	font-size: 12px;
	font-weight: 700;
	color: rgba(255, 255, 255, .6);
	letter-spacing: .12em;
	line-height: 1.4;
}

/* 参考情報（外部リンクカード） */
.secRef {
	display: block;
	margin-top: 12px;
	padding: 22px 24px;
	border-radius: 16px;
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(255, 255, 255, .14);
	color: #fff;
	transition: all .3s;
}

.secRef:hover {
	background: rgba(255, 255, 255, .09);
	color: #fff;
}

.secRef-title {
	font-size: 16px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.6;
}

.secRef-text {
	font-size: 13px;
	line-height: 1.85;
	color: rgba(255, 255, 255, .72);
	letter-spacing: normal;
	margin-top: 6px;
}

.secRef-domain {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 700;
	color: #5ECEE5;
	letter-spacing: normal;
	margin-top: 10px;
}

.secWhyNow-disclaimer {
	font-size: 11px;
	line-height: 1.85;
	color: rgba(255, 255, 255, .62);
	letter-spacing: normal;
	margin-top: 14px;
}

/* ---- WHY ALION ---- */
.secWhyAlion {
	background: #fff;
	padding: 96px 0;
	scroll-margin-top: 96px;
}

.secWhyAlion-inner {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 40px min(72px, 6vw);
	align-items: flex-start;
}

.secWhyAlion-copy {
	flex: 1 1 420px;
	min-width: 290px;
}

.secWhyAlion-text {
	font-size: 15px;
	line-height: 2;
	color: #64748B;
	letter-spacing: normal;
	margin-top: 18px;
}

.secWhyAlion-text p + p {
	margin-top: 8px;
}

.secWhyAlion-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 20px;
	font-size: 14px;
	font-weight: 700;
	color: #005FFF;
	letter-spacing: normal;
	border-bottom: 1px solid #005FFF;
	padding-bottom: 2px;
}

.secWhyAlion-link:hover {
	opacity: .75;
}

.secWhyAlion-points {
	flex: 1 1 460px;
	min-width: 290px;
	border-top: 1px solid #E4E8EE;
}

.secWhyAlion-points li {
	display: flex;
	gap: 22px;
	align-items: flex-start;
	padding: 26px 0;
	border-bottom: 1px solid #E4E8EE;
}

.secWhyAlion-num {
	font-size: 30px;
	font-weight: 600;
	color: #005FFF;
	line-height: 1;
	letter-spacing: normal;
	flex: 0 0 auto;
	width: 44px;
}

.secWhyAlion-pointText {
	margin-top: 6px;
}

/* ISO/IEC 27001 認証 */
.secCert {
	flex: 1 1 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px 32px;
	padding: 24px min(32px, 4vw);
	border: 1px solid #E4E8EE;
	border-radius: 18px;
	background: #fff;
}

.secCert-img {
	height: 84px;
	width: auto;
	display: block;
	flex: 0 0 auto;
}

.secCert-body {
	flex: 1 1 320px;
}

.secCert-label {
	font-size: 12px;
	font-weight: 600;
	color: #005FFF;
	letter-spacing: .14em;
	line-height: 1.4;
}

.secCert-title {
	margin-top: 6px;
}

.secCert-text {
	margin-top: 6px;
}

/* ---- 導入の流れ ---- */
.secFlow {
	background: #F7F9FC;
	padding: 96px 0;
	scroll-margin-top: 96px;
}

.secFlow-head {
	text-align: center;
}

.secFlow-steps {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 28px 8px;
	margin-top: 44px;
}

/* 矢羽根形の STEP ラベル */
.secFlow-label {
	padding: 15px 18px 15px 28px;
	-webkit-clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 50%, calc(100% - 18px) 100%, 0 100%, 18px 50%);
	clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 50%, calc(100% - 18px) 100%, 0 100%, 18px 50%);
	font-weight: 600;
	font-size: 15px;
	letter-spacing: .08em;
	line-height: 1.4;
}

.secFlow-label--1 {
	background: #DCE7FF;
	color: #0B3FA8;
}

.secFlow-label--2 {
	background: #8FB2FF;
	color: #0B1425;
}

.secFlow-label--3 {
	background: #005FFF;
	color: #fff;
}

.secFlow-body {
	padding: 20px 22px 0 10px;
}

.secFlow-text {
	margin-top: 8px;
}

.secFlow-cta {
	text-align: center;
	margin-top: 40px;
}

/* ---- 料金プラン ---- */
.secPricing {
	position: relative;
	overflow: hidden;
	background: #0B1425;
	color: #fff;
	padding: 96px 0;
	scroll-margin-top: 96px;
}

.secPricing-glow {
	position: absolute;
	width: 760px;
	height: 760px;
	left: 50%;
	top: -260px;
	transform: translateX(-50%);
	border-radius: 50%;
	background: radial-gradient(circle, rgba(0, 95, 255, .28) 0%, rgba(0, 95, 255, 0) 62%);
	pointer-events: none;
}

.secPricing-inner {
	position: relative;
	width: 90%;
	max-width: 1040px;
	margin: 0 auto;
}

.secPricing-head {
	text-align: center;
}

.secPlan {
	margin-top: 44px;
	background: #fff;
	color: #172033;
	border-radius: 24px;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
	box-shadow: 0 40px 100px rgba(0, 0, 0, .4);
}

.secPlan-main {
	flex: 1 1 360px;
	padding: min(40px, 5vw);
	background: linear-gradient(180deg, #F5F9FF, #EAF1FF);
	display: flex;
	flex-direction: column;
}

.secPlan-nameRow {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.secPlan-name {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.5;
}

.secPlan-name span {
	color: #005FFF;
	letter-spacing: .06em;
}

.secPlan-badge {
	font-size: 11px;
	font-weight: 700;
	color: #1A212F;
	background: #FABE00;
	border-radius: 100px;
	padding: 3px 10px;
	letter-spacing: normal;
	line-height: 1.5;
	white-space: nowrap;
}

.secPlan-price {
	display: flex;
	align-items: baseline;
	gap: 6px;
	margin-top: 20px;
	line-height: 1;
	letter-spacing: normal;
}

.secPlan-priceUnit {
	font-size: 16px;
	font-weight: 700;
}

.secPlan-priceNum {
	font-size: min(60px, 13vw);
	font-weight: 600;
	color: #0B1425;
}

.secPlan-priceYen {
	font-size: 20px;
	font-weight: 700;
}

.secPlan-tax {
	font-size: 13px;
	color: #64748B;
	letter-spacing: normal;
	margin-top: 8px;
	line-height: 1.5;
}

.secPlan-cert {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 18px 0 22px;
	padding-top: 16px;
	border-top: 1px solid #D6E1F5;
}

.secPlan-certImg {
	height: 40px;
	width: auto;
	display: block;
	flex: 0 0 auto;
}

.secPlan-certText {
	font-size: 12px;
	line-height: 1.7;
	color: #3A4558;
	letter-spacing: normal;
}

.secPlan-detail {
	flex: 1 1 440px;
	padding: min(40px, 5vw);
}

.secPlan-detailLabel {
	font-size: 13px;
	font-weight: 700;
	color: #005FFF;
	letter-spacing: .08em;
	line-height: 1.4;
}

.secPlan-list {
	display: grid;
	gap: 9px;
	margin-top: 14px;
}

.secPlan-list li {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 14px;
	line-height: 1.7;
	letter-spacing: normal;
}

.secPlan-check {
	flex: 0 0 auto;
	margin-top: 3px;
}

.secPricing-notes {
	margin-top: 22px;
	display: grid;
	gap: 4px;
	font-size: 12px;
	line-height: 1.85;
	color: rgba(255, 255, 255, .66);
	letter-spacing: normal;
}

/* ---- よくあるご質問 ---- */
.secFaq {
	background: #fff;
	padding: 96px 0;
	scroll-margin-top: 96px;
}

.secFaq-inner {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 32px min(72px, 6vw);
	align-items: flex-start;
}

.secFaq-head {
	flex: 1 1 280px;
	min-width: 260px;
}

.secFaq-list {
	flex: 3 1 560px;
	min-width: 290px;
	border-top: 1px solid #E4E8EE;
}

.secFaq-item {
	border-bottom: 1px solid #E4E8EE;
}

.secFaq-q {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	padding: 22px 4px;
}

.secFaq-qNum {
	font-size: 16px;
	font-weight: 600;
	color: #005FFF;
	line-height: 1.6;
	flex: 0 0 auto;
}

.secFaq-qText {
	flex: 1;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.6;
}

.secFaq-icon {
	flex: 0 0 auto;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #F1F5FF;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform .25s;
}

/* 開いているときは＋を×に */
.secFaq-item[open] .secFaq-icon {
	transform: rotate(45deg);
}

.secFaq-a {
	padding: 0 46px 24px 44px;
	font-size: 14px;
	line-height: 1.95;
	color: #64748B;
	letter-spacing: normal;
}

/* ---- 無料相談 ---- */
.secContact {
	background: #F7F9FC;
	padding: 96px 0;
	scroll-margin-top: 96px;
}

.secContact-inner {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 40px min(64px, 6vw);
	align-items: flex-start;
}

.secContact-copy {
	flex: 1 1 380px;
	min-width: 290px;
}

.secContact-text {
	font-size: 15px;
	line-height: 2;
	color: #64748B;
	letter-spacing: normal;
	margin-top: 18px;
}

.secContact-text p + p {
	margin-top: 8px;
}

.secContact-jump {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: 22px;
	font-size: 17px;
	font-weight: 700;
	color: #005FFF;
	letter-spacing: normal;
}

.secContact-jump:hover {
	opacity: .8;
}

.secContact-card {
	flex: 1 1 480px;
	min-width: 290px;
	background: #fff;
	border: 1px solid #E4E8EE;
	border-radius: 20px;
	padding: min(34px, 5vw);
	box-shadow: 0 24px 60px rgba(11, 20, 37, .08);
	scroll-margin-top: 110px;
}

/* フォーム */
.secForm-title {
	font-size: 20px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.5;
}

.secForm-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 16px;
	margin-top: 20px;
}

.secForm-field {
	display: block;
}

.secForm-field--full {
	grid-column: 1/-1;
}

.secForm-label {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.5;
	margin-bottom: 6px;
}

.secForm-label--group {
	margin-bottom: 8px;
}

.secForm-req,
.secForm-opt {
	font-size: 10px;
	font-weight: 700;
	border-radius: 4px;
	padding: 1px 6px;
}

.secForm-req {
	color: #fff;
	background: #E5484D;
}

.secForm-opt {
	color: #64748B;
	background: #F1F3F6;
}

.secForm-req--inline {
	margin-left: 8px;
}

.secForm-input {
	width: 100%;
	padding: 13px 15px;
	border: 1px solid #DFE4EA;
	border-radius: 10px;
	font-size: 15px;
	font-family: inherit;
	background: #fff;
	color: #172033;
}

.secForm-input:focus {
	border-color: #005FFF;
	/* 透明の outline：通常は見えず、Windows のハイコントラスト（forced-colors）ではシステム色の枠になる */
	outline: 2px solid transparent;
	outline-offset: -2px;
}

.secForm-select {
	cursor: pointer;
}

.secForm-textarea {
	min-height: 110px;
	line-height: 1.8;
	resize: vertical;
}

/* クラウドサービスの選択チップ（単一選択。選択中は aria-pressed="true"） */
.secForm-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.secChip {
	padding: 10px 16px;
	border-radius: 100px;
	font-size: 13px;
	font-family: inherit;
	letter-spacing: normal;
	cursor: pointer;
	transition: all .2s;
	line-height: 1.3;
	border: 1px solid #DFE4EA;
	background: #fff;
	color: #172033;
	font-weight: 600;
}

.secChip[aria-pressed="true"] {
	border: 1px solid #005FFF;
	background: #005FFF;
	color: #fff;
	font-weight: 700;
}

.secForm-agree {
	grid-column: 1/-1;
	display: flex;
	align-items: flex-start;
	gap: 10px;
	cursor: pointer;
}

.secForm-check {
	width: 18px;
	height: 18px;
	margin-top: 4px;
	accent-color: #005FFF;
	flex: 0 0 auto;
	cursor: pointer;
}

.secForm-agreeText {
	font-size: 13px;
	line-height: 1.8;
	letter-spacing: normal;
}

.secForm-privacy {
	color: #005FFF;
	text-decoration: underline;
}

/* スパム対策の入力欄（画面外に置く） */
.secForm-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.secForm-error {
	margin-top: 16px;
	font-size: 13px;
	font-weight: 600;
	color: #C62828;
	background: #FDECEC;
	border-radius: 10px;
	padding: 10px 14px;
	letter-spacing: normal;
	line-height: 1.6;
}

.secForm-submit {
	width: 100%;
	margin-top: 20px;
	padding: 17px;
	border-radius: 100px;
	background: #005FFF;
	color: #fff;
	font-weight: 700;
	border: none;
	cursor: pointer;
	font-family: inherit;
	font-size: 16px;
	letter-spacing: normal;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	box-shadow: 0 12px 26px rgba(0, 95, 255, .3);
	transition: all .3s;
}

.secForm-submit:hover {
	background: #1F74FF;
}

/* 送信中（JS が disabled + aria-busy にする。設計には無い状態なので控えめに）。
   JS が動くまでの disabled は見た目を変えない（読み込みの一瞬だけ薄くなるのを避ける） */
.secForm-submit:disabled {
	cursor: default;
}

.secForm-submit[aria-busy="true"] {
	opacity: .7;
}

/* JS が無効なときだけ出る案内 */
.secForm-noscript {
	margin-top: 12px;
	padding: 10px 14px;
	border-radius: 10px;
	background: #FDECEC;
	color: #C62828;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.6;
	letter-spacing: normal;
}

.secForm-noscript a {
	text-decoration: underline;
}

.secForm-note {
	font-size: 12px;
	color: #64748B;
	text-align: center;
	margin-top: 12px;
	line-height: 1.7;
	letter-spacing: normal;
}

/* 送信完了 */
.secForm-done {
	text-align: center;
	padding: 36px 8px;
}

/* JS がフォーカスを移すだけなので枠は出さない */
.secForm-done:focus {
	outline: none;
}

.secForm-doneIcon {
	display: inline-flex;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: linear-gradient(135deg, #5ECEE5, #005FFF);
	align-items: center;
	justify-content: center;
	box-shadow: 0 12px 26px rgba(0, 95, 255, .3);
}

.secForm-doneText {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.8;
	margin-top: 20px;
}

.secForm-reset {
	margin-top: 22px;
	padding: 11px 22px;
	border-radius: 100px;
	background: transparent;
	color: #64748B;
	border: 1px solid #CFD5D8;
	cursor: pointer;
	font-family: inherit;
	font-size: 13px;
	letter-spacing: normal;
}

.secForm-reset:hover {
	border-color: #005FFF;
	color: #005FFF;
}

/* ---- フッター ---- */
.secFooter {
	background: #1A212F;
	color: #fff;
	padding: 64px 0 28px;
}

.secFooter-inner {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 36px 60px;
	justify-content: space-between;
	align-items: flex-start;
}

.secFooter-brand {
	flex: 1 1 300px;
}

.secFooter-logo {
	height: 40px;
	width: auto;
	display: block;
}

.secFooter-tagline {
	font-size: 14px;
	color: rgba(255, 255, 255, .78);
	letter-spacing: normal;
	line-height: 1.8;
	margin-top: 16px;
}

.secFooter-by {
	font-size: 13px;
	color: rgba(255, 255, 255, .62);
	letter-spacing: normal;
	line-height: 1.8;
	margin-top: 4px;
}

.secFooter-company {
	color: #fff;
	text-decoration: underline;
}

.secFooter-company:hover {
	color: #5ECEE5;
}

.secFooter-links {
	display: grid;
	grid-template-columns: repeat(2, auto);
	gap: 14px 48px;
}

.secFooter-link {
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	letter-spacing: normal;
	white-space: nowrap;
}

.secFooter-link:hover {
	opacity: .7;
	color: #fff;
}

.secFooter-bottom {
	width: 90%;
	max-width: 1200px;
	margin: 44px auto 0;
	padding-top: 20px;
	border-top: 1px solid rgba(255, 255, 255, .12);
}

.secFooter-copy {
	font-size: 12px;
	color: rgba(255, 255, 255, .6);
	letter-spacing: normal;
}

/* ---- スマホ用の追従 CTA ---- */
.secMobileCta {
	display: none;
	position: fixed;
	left: 16px;
	right: 16px;
	bottom: 16px;
	z-index: 9000;
	align-items: center;
	justify-content: center;
	gap: 10px;
	background: #005FFF;
	color: #fff;
	font-weight: 700;
	font-size: 15px;
	padding: 16px;
	border-radius: 100px;
	box-shadow: 0 14px 34px rgba(0, 40, 120, .4);
	letter-spacing: normal;
}

.secMobileCta:hover {
	color: #fff;
}

/* ============================================
   レスポンシブ（設計の data-rwd）
============================================ */
@media (max-width: 1180px) {
	/* PC ナビを隠してハンバーガーを出す */
	.secHeader-nav {
		display: none !important;
	}

	.secHeader-burger {
		display: inline-flex !important;
	}
}

@media (max-width: 782px) {
	.admin-bar .secHeader {
		top: 66px;
	}

	.admin-bar .secMenu-panel {
		padding-top: 68px;
	}
}

@media (max-width: 768px) {
	/* ヘッダーの CTA は追従 CTA に置き換える */
	.secHeader-cta {
		display: none !important;
	}

	.secMobileCta {
		display: flex !important;
	}

	/* 追従 CTA にコピーライトが隠れないよう余白を足す */
	.secFooter {
		padding-bottom: 104px !important;
	}
}

@media (max-width: 760px) {
	/* デモ画面のサイドメニューを隠す */
	.secDash-side {
		display: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	.secPage,
	.secPage * {
		transition: none !important;
		animation: none !important;
	}
}

/* iOS Safari は 16px 未満の入力欄にフォーカスすると画面を拡大してしまうので、iOS のみ 16px にする
   （-webkit-touch-callout は iOS の WebKit だけが対応。PC・Android の見た目は設計どおり 15px のまま） */
@supports (-webkit-touch-callout: none) {
	.secForm-input {
		font-size: 16px;
	}
}

/* Windows のハイコントラスト表示：背景色が消えるので、選択中のチップを枠で示す */
@media (forced-colors: active) {
	.secChip[aria-pressed="true"] {
		outline: 2px solid ButtonText;
		outline-offset: 2px;
	}
}

/* 印刷・PDF 保存：固定ヘッダーと追従 CTA が本文に重ならないようにする */
@media print {
	.secHeader,
	.secMenu,
	.secMobileCta {
		display: none !important;
	}

	.secFooter {
		padding-bottom: 28px !important;
	}

	[data-reveal] {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}