/* ===============================
   Service Detail Pages - Common Styles
   Blue gradient header + unified layout
   v20260206
   =============================== */

/* 隐藏面包屑 */
#service .crumb {
	display: none;
}

/* ページタイトル - 蓝色渐变 header */
#service .page_title {
	position: relative;
	padding: 80px 50px 60px;
	background: linear-gradient(135deg, rgba(10,92,158,0.92) 0%, rgba(27,159,255,0.85) 100%);
	text-align: center;
	overflow: hidden;
}

#service .page_title img {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.55;
	z-index: 0;
}

#service .page_title h1 {
	position: relative;
	z-index: 1;
	display: block;
	margin: 0;
	padding: 0;
	font-size: 36px;
	font-weight: 600;
	letter-spacing: .12em;
	line-height: 1.3em;
	color: #fff;
	text-shadow: 0 2px 20px rgba(0,0,0,0.2);
}

#service .page_title .title-en {
	position: relative;
	z-index: 1;
	display: block;
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.2em;
	color: rgba(255,255,255,0.6);
	text-transform: uppercase;
}

/* セクション共通 */
#service .column {
	padding: 60px 4vw;
	max-width: 1100px;
	margin: 0 auto;
}

#service .column:nth-child(odd) {
	background: #fff;
}

#service .column:nth-child(even) {
	background: #f8fafc;
}

#service .column h2 {
	display: block;
	margin: 0 0 30px;
	padding: 0 0 15px;
	font-size: 26px;
	font-weight: 600;
	color: #1a3a5c;
	letter-spacing: 0.08em;
	line-height: 1.4em;
	border-bottom: 3px solid #1B9FFF;
}

#service .column h3 {
	display: block;
	margin: 30px 0 20px;
	padding: 0;
	font-size: 22px;
	font-weight: 600;
	color: #1a3a5c;
	letter-spacing: 0.05em;
}

#service .column p {
	font-size: 15px;
	line-height: 2em;
	color: #4a5a6a;
	letter-spacing: 0.03em;
}

#service .column img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 30px auto;
	border-radius: 8px;
}

#service .column ul {
	margin: 20px 0;
	padding: 0;
	list-style: none;
}

#service .column ul li {
	position: relative;
	padding: 10px 0 10px 28px;
	font-size: 15px;
	line-height: 1.7em;
	color: #4a5a6a;
	border-bottom: 1px solid #e8ecf0;
}

#service .column ul li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 18px;
	width: 12px;
	height: 12px;
	background: linear-gradient(135deg, #1B9FFF 0%, #0e7ed4 100%);
	border-radius: 50%;
}

#service .column ul li:last-child {
	border-bottom: none;
}

/* 特徴カード */
#service .feature-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 25px;
	margin: 30px 0;
}

#service .feature-card {
	padding: 30px 25px;
	background: #fff;
	border-radius: 12px;
	border: 1px solid #e5eaef;
	box-shadow: 0 2px 15px rgba(0,0,0,0.04);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#service .feature-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 25px rgba(27,159,255,0.1);
}

#service .feature-card h4 {
	margin: 0 0 12px;
	font-size: 20px;
	font-weight: 600;
	color: #1B9FFF;
}

#service .feature-card p {
	margin: 0;
	font-size: 14px;
	line-height: 1.8em;
	color: #5a6a7a;
}

/* 導入事例 */
#service .case-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 25px;
	margin: 30px 0;
}

#service .case-card {
	background: #fff;
	border-radius: 12px;
	border: 1px solid #e5eaef;
	overflow: hidden;
	box-shadow: 0 2px 15px rgba(0,0,0,0.04);
}

#service .case-card img {
	width: 100%;
	height: 180px;
	object-fit: cover;
	margin: 0;
	border-radius: 0;
}

#service .case-card .case-body {
	padding: 20px;
}

#service .case-card h4 {
	margin: 0 0 10px;
	font-size: 19px;
	font-weight: 600;
	color: #1a3a5c;
}

#service .case-card .price {
	margin: 0 0 12px;
	font-size: 14px;
	font-weight: 600;
	color: #1B9FFF;
}

#service .case-card p {
	margin: 0;
	font-size: 14px;
	line-height: 1.7em;
	color: #5a6a7a;
}

/* CTA セクション */
#service .cta-section {
	padding: 60px 4vw;
	background: #f0f2f5;
	text-align: center;
}

#service .cta-section h2 {
	display: block;
	margin: 0 0 15px;
	padding: 0;
	font-size: 26px;
	font-weight: 600;
	color: #1a3a5c;
	letter-spacing: 0.08em;
	border: none;
}

#service .cta-section p {
	margin: 0 auto 30px;
	max-width: 600px;
	font-size: 15px;
	line-height: 1.8em;
	color: #5a6a7a;
}

#service .cta-buttons {
	display: flex;
	justify-content: center;
	gap: 20px;
	flex-wrap: nowrap;
}

#service .cta-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 18px 40px;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.05em;
	border-radius: 30px;
	transition: all 0.3s ease;
	text-decoration: none;
}

#service .cta-btn.primary {
	color: #fff;
	background: linear-gradient(135deg, #1B9FFF 0%, #0e7ed4 100%);
	box-shadow: 0 4px 15px rgba(27,159,255,0.3);
}

#service .cta-btn.primary:hover {
	background: linear-gradient(135deg, #0e7ed4 0%, #0a5c9e 100%);
	box-shadow: 0 6px 20px rgba(27,159,255,0.4);
	transform: translateY(-2px);
}

#service .cta-btn.secondary {
	color: #1a3a5c;
	background: #fff;
	border: 2px solid #d0dbe6;
}

#service .cta-btn.secondary:hover {
	color: #1B9FFF;
	border-color: #1B9FFF;
}

/* スマホ */
@media screen and (max-width: 600px) {

#service .page_title {
	padding: 50px 4vw 40px;
}

#service .page_title h1 {
	font-size: 6vw;
}

#service .page_title .title-en {
	font-size: 11px;
}

#service .column {
	padding: 40px 4vw;
}

#service .column h2 {
	font-size: 5.5vw;
	margin-bottom: 20px;
}

#service .column h3 {
	font-size: 4.5vw;
}

#service .column p {
	font-size: 3.8vw;
	line-height: 1.9em;
}

#service .feature-grid,
#service .case-grid {
	grid-template-columns: 1fr;
}

#service .cta-section {
	padding: 40px 4vw;
}

#service .cta-section h2 {
	font-size: 5vw;
}

#service .cta-buttons {
	flex-direction: column;
	align-items: center;
}

#service .cta-btn {
	width: 120px;
	justify-content: center;
	padding: 15px 30px;
	font-size: 4vw;
}

}

/* ===============================
   Additional Service Detail Styles
   v20260206b
   =============================== */

/* Page Lead in Header */
#service .page_title .page_lead {
	position: relative;
	z-index: 1;
	display: block;
	max-width: 700px;
	margin: 20px auto 0;
	font-size: 15px;
	font-weight: 400;
	letter-spacing: 0.05em;
	line-height: 1.9em;
	color: rgba(255,255,255,0.9);
	text-shadow: 0 1px 10px rgba(0,0,0,0.3);
}

/* Section title with icon */
#service .column h2 i {
	margin-right: 10px;
	color: #1B9FFF;
}

/* Note text */
#service .column .note {
	font-size: 13px;
	color: #7a99b5;
	margin-top: 15px;
}

/* Feature number badge */
#service .feature-card .feature-number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	margin-bottom: 15px;
	font-size: 16px;
	font-weight: 700;
	color: #fff;
	background: linear-gradient(135deg, #1B9FFF 0%, #0e7ed4 100%);
	border-radius: 50%;
}

#service .feature-card h4 i {
	margin-right: 8px;
	color: #1B9FFF;
}

/* Plan tags */
.plan-tags {
	display: flex;
	justify-content: center;
	flex-wrap: nowrap;
	gap: 15px;
	margin: 30px 0;
}

.plan-tag {
	display: inline-block;
	padding: 12px 30px;
	font-size: 16px;
	font-weight: 600;
	color: #1B9FFF;
	background: #e8f4ff;
	border: 2px solid #c8e4ff;
	border-radius: 30px;
	letter-spacing: 0.05em;
}

/* Price grid */
.price-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 25px;
	max-width: 600px;
	margin: 30px auto;
}

.price-card {
	padding: 30px 25px;
	background: #fff;
	border-radius: 12px;
	border: 2px solid #e5eaef;
	text-align: center;
}

.price-card h4 {
	margin: 0 0 15px;
	font-size: 14px;
	font-weight: 600;
	color: #7a99b5;
	letter-spacing: 0.05em;
}

.price-card .price-value {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	color: #1a3a5c;
}

/* Notice list */
.notice-list {
	max-width: 600px;
	margin: 20px auto 0;
	padding: 0;
	list-style: none;
}

.notice-list li {
	position: relative;
	padding: 8px 0 8px 20px;
	font-size: 13px;
	color: #7a99b5;
	border-bottom: none !important;
}

.notice-list li::before {
	content: "※";
	position: absolute;
	left: 0;
	top: 8px;
	width: auto;
	height: auto;
	background: none;
	border-radius: 0;
	color: #7a99b5;
}

/* Mobile */
@media screen and (max-width: 600px) {
	#service .page_title .page_lead {
		font-size: 3.5vw;
		line-height: 1.8em;
	}
	
	.plan-tags {
		gap: 8px;
	}
	
	.plan-tag {
		padding: 10px 20px;
		font-size: 3.5vw;
	}
	
	.price-grid {
		grid-template-columns: 1fr;
		gap: 15px;
	}
	
	.price-card {
		padding: 15px 10px;
	}
	
	.price-card .price-value {
		font-size: 4vw;
	}
}

/* ===============================
   Service Detail v3 - Full Redesign
   =============================== */

/* Section Label */
#service .section-label {
	display: block;
	margin: 0 auto 10px;
	font-size: 13px;
	font-weight: 600;
	color: #1B9FFF;
	letter-spacing: 0.2em;
	text-align: center;
	text-transform: uppercase;
}

/* Centered H2 with gradient underline */
#service .column h2 {
	text-align: center;
	border-bottom: none;
	padding-bottom: 20px;
	margin-bottom: 30px;
	position: relative;
}

#service .column h2::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 80px;
	height: 3px;
	background: linear-gradient(90deg, #1B9FFF 0%, #10b981 100%);
	border-radius: 2px;
}

#service .column h2 i {
	display: none;
}

/* Section description */
#service .section-desc {
	display: block;
	max-width: 700px;
	margin: 0 auto 40px;
	font-size: 15px;
	color: #5a6a7a;
	line-height: 1.9em;
	text-align: center;
}

/* Page nav sticky */
.page-nav {
	background: #0a5c9e;
	padding: 0;
	position: sticky;
	top: 0;
	z-index: 100;
	box-shadow: 0 2px 10px rgba(0,0,0,0.15);
}

.page-nav ul {
	display: flex;
	justify-content: center;
	max-width: 900px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

.page-nav li {
	flex: 1;
}

.page-nav a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 16px 10px;
	color: rgba(255,255,255,0.85);
	font-size: 13px;
	font-weight: 500;
	text-decoration: none;
	border-bottom: 3px solid transparent;
	transition: all 0.2s ease;
}

.page-nav a:hover,
.page-nav a.active {
	color: #fff;
	background: rgba(255,255,255,0.1);
	border-bottom-color: #fff;
}

/* Industry tags */
.industry-tags {
	display: flex;
	justify-content: center;
	flex-wrap: nowrap;
	gap: 8px;
	margin: 0 auto 25px;
}

.industry-tags span {
	display: inline-block;
	padding: 6px 16px;
	font-size: 13px;
	font-weight: 500;
	color: #1B9FFF;
	background: #e8f4ff;
	border: 1px solid #c8e4ff;
	border-radius: 20px;
}

/* Highlight stats */
.highlight-stats {
	display: flex;
	justify-content: center;
	flex-wrap: nowrap;
	gap: 30px;
	margin: 0 auto 40px;
	padding: 25px;
	background: linear-gradient(135deg, #f0f7ff 0%, #e8f4ff 100%);
	border-radius: 12px;
	max-width: 800px;
}

.highlight-stats span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	color: #1a3a5c;
}

.highlight-stats i {
	color: #1B9FFF;
	font-size: 18px;
}

.highlight-stats strong {
	color: #1B9FFF;
	font-weight: 700;
	font-size: 18px;
}

/* About content layout */
.about-content {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	align-items: start;
	margin-top: 30px;
}

.about-text p {
	margin-bottom: 20px;
}

.about-image img {
	width: 100%;
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}

/* Point list */
.point-list {
	margin-top: 25px;
}

.point-item {
	display: flex;
	gap: 15px;
	padding: 20px;
	margin-bottom: 15px;
	background: #f8fafc;
	border-radius: 10px;
	border-left: 4px solid #1B9FFF;
}

.point-item > i {
	font-size: 24px;
	color: #1B9FFF;
	flex-shrink: 0;
}

.point-item h4 {
	margin: 0 0 5px;
	font-size: 16px;
	font-weight: 600;
	color: #1a3a5c;
}

.point-item p {
	margin: 0;
	font-size: 14px;
	color: #5a6a7a;
	line-height: 1.6em;
}

/* System diagram */
.system-diagram {
	max-width: 800px;
	margin: 30px auto;
}

/* Feature grid 4 columns */
.feature-grid.four-col {
	grid-template-columns: repeat(4, 1fr);
}

/* Case grid 3 columns */
.case-grid.three-col {
	grid-template-columns: repeat(3, 1fr);
}

.case-card .case-body.full {
	padding: 40px 20px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	min-height: 200px;
	background: linear-gradient(135deg, #f0f7ff 0%, #e8f4ff 100%);
}

.case-card .case-body.full h4 {
	color: #1B9FFF;
}

.case-card .case-body.full h4 i {
	margin-right: 8px;
}

/* Scene grid */
.scene-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	margin: 30px 0;
}

.scene-card {
	padding: 30px 20px;
	background: #fff;
	border-radius: 12px;
	border: 1px solid #e5eaef;
	text-align: center;
	transition: all 0.2s ease;
}

.scene-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 25px rgba(27,159,255,0.1);
	border-color: #1B9FFF;
}

.scene-card i {
	font-size: 36px;
	color: #1B9FFF;
	margin-bottom: 15px;
}

.scene-card h4 {
	margin: 0 0 10px;
	font-size: 16px;
	font-weight: 600;
	color: #1a3a5c;
}

.scene-card p {
	margin: 0;
	font-size: 13px;
	color: #5a6a7a;
	line-height: 1.7em;
}

/* Plan tag popular */
.plan-tag.popular {
	background: linear-gradient(135deg, #1B9FFF 0%, #0e7ed4 100%);
	color: #fff;
	border-color: #1B9FFF;
	position: relative;
}

.plan-tag.popular small {
	display: block;
	font-size: 10px;
	font-weight: 400;
	margin-top: 2px;
}

/* Mobile */
@media screen and (max-width: 600px) {
	.page-nav ul {
		flex-wrap: nowrap;
	}
	
	.page-nav li {
		flex: 0 0 33.33%;
	}
	
	.page-nav a {
		padding: 12px 5px;
		font-size: 11px;
		flex-direction: column;
		gap: 3px;
	}
	
	.industry-tags {
		gap: 8px;
	}
	
	.industry-tags span {
		padding: 5px 12px;
		font-size: 11px;
	}
	
	.highlight-stats {
		flex-direction: column;
		gap: 15px;
		padding: 20px;
	}
	
	.highlight-stats span {
		font-size: 13px;
	}
	
	.about-content {
		grid-template-columns: 1fr;
	}
	
	.feature-grid.four-col {
		grid-template-columns: repeat(2, 1fr);
	}
	
	.case-grid.three-col {
		grid-template-columns: 1fr;
	}
	
	.scene-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	
	.scene-card {
		padding: 15px 10px;
	}
	
	.scene-card i {
		font-size: 28px;
	}
}

/* Merit list - 1 column layout */
.merit-list {
	max-width: 800px;
	margin: 0 auto;
}

.merit-item {
	display: flex;
	gap: 25px;
	padding: 30px;
	margin-bottom: 20px;
	background: #fff;
	border-radius: 12px;
	border: 1px solid #e5eaef;
	box-shadow: 0 2px 15px rgba(0,0,0,0.04);
	transition: all 0.2s ease;
}

.merit-item:hover {
	border-color: #1B9FFF;
	box-shadow: 0 8px 30px rgba(27,159,255,0.1);
}

.merit-number {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	font-size: 24px;
	font-weight: 700;
	color: #fff;
	background: linear-gradient(135deg, #1B9FFF 0%, #0e7ed4 100%);
	border-radius: 50%;
}

.merit-content {
	flex: 1;
}

.merit-content h4 {
	margin: 0 0 12px;
	font-size: 18px;
	font-weight: 600;
	color: #1a3a5c;
}

.merit-content p {
	margin: 0;
	font-size: 15px;
	line-height: 1.9em;
	color: #5a6a7a;
}

@media screen and (max-width: 600px) {
	.merit-item {
		flex-direction: column;
		align-items: center;
		text-align: center;
		padding: 15px 10px;
		gap: 15px;
	}
	
	.merit-number {
		width: 50px;
		height: 50px;
		font-size: 20px;
	}
	
	.merit-content h4 {
		font-size: 4.5vw;
	}
	
	.merit-content p {
		font-size: 3.5vw;
	}
}

/* Plan Cards - same as long_cloud */
.plan-cards {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	gap: 15px;
	width: 100%;
	max-width: 960px;
	margin: 30px auto 0;
	padding: 0;
	list-style: none;
}

.plan-cards li {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 17%;
	min-width: 150px;
	padding: 30px 15px 25px;
	background: #fff;
	border: 2px solid #e0e0e0;
	border-radius: 12px;
	text-align: center;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.plan-cards li:hover {
	border-color: #1B9FFF;
	box-shadow: 0 4px 16px rgba(27,159,255,0.15);
}

.plan-cards li .plan-icon {
	font-size: 28px;
	color: #1B9FFF;
	margin-bottom: 10px;
}

.plan-cards li .plan-days {
	font-size: 32px;
	font-weight: 700;
	color: #1B9FFF;
	line-height: 1em;
	margin-bottom: 4px;
}

.plan-cards li .plan-unit {
	font-size: 14px;
	color: #666;
}

.plan-cards li .plan-use {
	margin-top: 10px;
	font-size: 11px;
	color: #888;
	line-height: 1.4em;
}

.plan-cards li.popular {
	border-color: #1B9FFF;
	background: linear-gradient(180deg, #f0f8ff 0%, #fff 100%);
	box-shadow: 0 4px 16px rgba(27,159,255,0.15);
}

.plan-cards li.popular::before {
	content: "人気";
	position: absolute;
	top: -12px;
	left: 50%;
	transform: translateX(-50%);
	padding: 4px 16px;
	font-size: 12px;
	font-weight: 600;
	color: #fff;
	background: linear-gradient(135deg, #FF6B35 0%, #e55a2b 100%);
	border-radius: 20px;
	letter-spacing: 0.1em;
}

.plan-cards li.popular .plan-use {
	color: #1B9FFF;
	font-weight: 500;
}

@media screen and (max-width: 600px) {
	.plan-cards {
		gap: 8px;
	}
	
	.plan-cards li {
		width: 45%;
		min-width: 0;
		padding: 20px 10px;
	}
	
	.plan-cards li .plan-icon {
		font-size: 22px;
	}
	
	.plan-cards li .plan-days {
		font-size: 24px;
	}
	
	.plan-cards li .plan-unit {
		font-size: 12px;
	}
	
	.plan-cards li .plan-use {
		font-size: 10px;
	}
}

/* About Description - centered poetic style */
.about-desc {
	display: block;
	max-width: 700px;
	margin: 0 auto 40px;
	font-size: 18px;
	font-weight: 400;
	color: #1a3a5c;
	line-height: 2em;
	text-align: center;
	letter-spacing: 0.05em;
}

/* About Features - 4 icon badges */
.about-features {
	display: flex;
	justify-content: center;
	gap: 40px;
	margin: 0 auto 40px;
	max-width: 800px;
}

.about-feature {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.about-feature-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 80px;
	height: 80px;
	margin-bottom: 12px;
	font-size: 32px;
	color: #1B9FFF;
	background: linear-gradient(135deg, #f0f7ff 0%, #e8f4ff 100%);
	border-radius: 50%;
	box-shadow: 0 4px 15px rgba(27,159,255,0.15);
}

.about-feature-label {
	font-size: 14px;
	font-weight: 600;
	color: #1a3a5c;
	letter-spacing: 0.03em;
}

/* About full width image */
.about-image-full {
	display: block;
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
	border-radius: 12px;
	box-shadow: 0 8px 30px rgba(0,0,0,0.1);
}

/* Notice box with icon */
.notice-box {
	display: flex;
	align-items: flex-start;
	gap: 15px;
	max-width: 600px;
	margin: 30px auto 0;
	padding: 20px 25px;
	background: linear-gradient(135deg, #f0f7ff 0%, #e8f4ff 100%);
	border-radius: 10px;
	border-left: 4px solid #1B9FFF;
}

.notice-box-icon {
	flex-shrink: 0;
	font-size: 20px;
	color: #1B9FFF;
	margin-top: 2px;
}

.notice-box ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.notice-box ul li {
	padding: 5px 0;
	font-size: 13px;
	color: #5a6a7a;
	line-height: 1.6em;
	border-bottom: none !important;
}

.notice-box ul li::before {
	content: "※ ";
	color: #7a99b5;
}

@media screen and (max-width: 600px) {
	.about-desc {
		font-size: 4vw;
		line-height: 1.9em;
	}
	
	.about-features {
		flex-wrap: nowrap;
		gap: 20px;
	}
	
	.about-feature {
		width: 40%;
	}
	
	.about-feature-icon {
		width: 60px;
		height: 60px;
		font-size: 24px;
	}
	
	.about-feature-label {
		font-size: 12px;
	}
	
	.notice-box {
		flex-direction: column;
		gap: 8px;
		padding: 15px 20px;
	}
}

/* Merit Row - horizontal 4 boxes */
.merit-row {
	display: flex;
	justify-content: center;
	gap: 20px;
	max-width: 1000px;
	margin: 30px auto 0;
}

.merit-box {
	flex: 1;
	padding: 15px 10px;
	background: #fff;
	border-radius: 12px;
	border: 1px solid #e5eaef;
	text-align: center;
	transition: all 0.2s ease;
}

.merit-box:hover {
	border-color: #1B9FFF;
	box-shadow: 0 4px 20px rgba(27,159,255,0.1);
}

.merit-box-num {
	display: inline-block;
	width: 36px;
	height: 36px;
	line-height: 36px;
	margin-bottom: 12px;
	font-size: 14px;
	font-weight: 700;
	color: #fff;
	background: linear-gradient(135deg, #1B9FFF 0%, #0e7ed4 100%);
	border-radius: 50%;
}

.merit-box h4 {
	margin: 0 0 8px;
	font-size: 16px;
	font-weight: 600;
	color: #1a3a5c;
}

.merit-box p {
	margin: 0;
	font-size: 13px;
	color: #5a6a7a;
	line-height: 1.6em;
}

/* Scene section - same as long_cloud */
#scene {
	padding: 60px 4vw;
	background: #f8fafc;
}

#scene h2 {
	display: block;
	margin: 0 0 30px;
	font-size: 26px;
	font-weight: 600;
	color: #1a3a5c;
	text-align: center;
}

#scene .scene-grid {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	gap: 20px;
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

#scene .scene-grid li {
	flex-direction: column;
	
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 22%;
	padding: 30px 15px;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 2px 12px rgba(0,0,0,0.06);
	text-align: center;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#scene .scene-grid li:hover {
	transform: translateY(-4px);
	box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}

#scene .scene-grid li .scene-icon {
	font-size: 40px;
	margin-bottom: 12px;
}

#scene .scene-grid li:nth-child(1) .scene-icon { color: #2196F3; }
#scene .scene-grid li:nth-child(2) .scene-icon { color: #9C27B0; }
#scene .scene-grid li:nth-child(3) .scene-icon { color: #4CAF50; }
#scene .scene-grid li:nth-child(4) .scene-icon { color: #FF9800; }

#scene .scene-grid li h3 {
	margin: 0 0 8px;
	font-size: 16px;
	font-weight: 600;
	color: #333;
	line-height: 1.4em;
}

#scene .scene-grid li p {
	margin: 0;
	font-size: 13px;
	color: #666;
	line-height: 1.6em;
}

/* Fee section - same as long_cloud */
#fee .fee-lead {
	display: block;
	max-width: 600px;
	margin: 0 auto 25px;
	font-size: 15px;
	color: #555;
	text-align: center;
	line-height: 1.8em;
}

#fee .price {
	display: flex;
	justify-content: center;
	gap: 30px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

#fee .price li {
	padding: 30px 50px;
	background: #fff;
	border: 2px solid #e5eaef;
	border-radius: 12px;
	text-align: center;
}

#fee .price li h3 {
	margin: 0 0 10px;
	font-size: 14px;
	color: #7a99b5;
}

#fee .price li p {
	margin: 0;
	font-size: 18px;
	font-weight: 600;
	color: #1a3a5c;
}

@media screen and (max-width: 600px) {
	.merit-row {
		flex-wrap: nowrap;
		gap: 15px;
	}
	
	.merit-box {
		flex: 0 0 45%;
		padding: 15px 10px;
	}
	
	.merit-box-num {
		width: 30px;
		height: 30px;
		line-height: 30px;
		font-size: 12px;
	}
	
	.merit-box h4 {
		font-size: 14px;
	}
	
	.merit-box p {
		font-size: 11px;
	}
	
	#scene .scene-grid li {
	flex-direction: column;
	
		width: 45%;
		padding: 20px 10px;
	}
	
	#scene .scene-grid li .scene-icon {
		font-size: 30px;
	}
	
	#scene .scene-grid li h3 {
		font-size: 14px;
	}
	
	#scene .scene-grid li p {
		font-size: 11px;
	}
	
	#fee .price {
		flex-direction: column;
		gap: 15px;
	}
	
	#fee .price li {
		padding: 20px 30px;
	}
}

/* Merit Grid - 4 cards horizontal */
.merit-grid-four {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	max-width: 1100px;
	margin: 30px auto 0;
}

.merit-card {
	padding: 30px 25px;
	background: #fff;
	border-radius: 12px;
	border: 1px solid #e5eaef;
	box-shadow: 0 2px 15px rgba(0,0,0,0.04);
	transition: all 0.2s ease;
}

.merit-card:hover {
	border-color: #1B9FFF;
	box-shadow: 0 8px 25px rgba(27,159,255,0.1);
	transform: translateY(-3px);
}

.merit-card-num {
	display: inline-block;
	width: 40px;
	height: 40px;
	line-height: 40px;
	margin-bottom: 15px;
	font-size: 16px;
	font-weight: 700;
	color: #fff;
	background: linear-gradient(135deg, #1B9FFF 0%, #0e7ed4 100%);
	border-radius: 50%;
	text-align: center;
}

.merit-card h4 {
	margin: 0 0 12px;
	font-size: 18px;
	font-weight: 600;
	color: #1a3a5c;
}

.merit-card p {
	margin: 0;
	font-size: 14px;
	color: #5a6a7a;
	line-height: 1.8em;
}

/* About description improved */
.about-desc strong {
	color: #1B9FFF;
}

@media screen and (max-width: 900px) {
	.merit-grid-four {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media screen and (max-width: 600px) {
	.merit-grid-four {
		grid-template-columns: 1fr;
		gap: 15px;
	}
	
	.merit-card {
		padding: 15px 10px;
	}
	
	.merit-card-num {
		width: 35px;
		height: 35px;
		line-height: 35px;
		font-size: 14px;
	}
	
	.merit-card h4 {
		font-size: 16px;
	}
	
	.merit-card p {
		font-size: 13px;
	}
}

/* About Grid - left text, right image */
.about-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 50px;
	align-items: center;
	max-width: 1000px;
	margin: 30px auto 0;
}

.about-text .about-lead {
	font-size: 18px;
	font-weight: 500;
	color: #1a3a5c;
	line-height: 1.8em;
	margin-bottom: 20px;
}

.about-text .about-lead strong {
	color: #1B9FFF;
}

.about-text p {
	font-size: 15px;
	color: #5a6a7a;
	line-height: 1.9em;
	margin-bottom: 25px;
}

.about-features-inline {
	display: flex;
	flex-wrap: nowrap;
	gap: 15px;
}

.about-features-inline span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	font-size: 14px;
	font-weight: 500;
	color: #1B9FFF;
	background: #f0f7ff;
	border-radius: 25px;
}

.about-features-inline span i {
	font-size: 16px;
}

.about-image img {
	width: 100%;
	border-radius: 12px;
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
}

@media screen and (max-width: 768px) {
	.about-grid {
		grid-template-columns: 1fr;
		gap: 30px;
	}
	
	.about-text .about-lead {
		font-size: 16px;
	}
	
	.about-features-inline {
		justify-content: center;
	}
	
	.about-features-inline span {
		padding: 8px 14px;
		font-size: 12px;
	}
}

/* About section - long_cloud style */
#about {
	position: relative;
	margin: 0;
	padding: 80px 4vw 60px;
	background: linear-gradient(135deg, #e8f4fd 0%, #d0ebff 40%, #e1f0fc 100%);
	overflow: hidden;
}

#about::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background:
		radial-gradient(circle at 20% 50%, rgba(27,159,255,0.1) 0%, transparent 50%),
		radial-gradient(circle at 80% 20%, rgba(100,200,255,0.08) 0%, transparent 40%);
	pointer-events: none;
}

#about .about-inner {
	position: relative;
	z-index: 1;
}

#about h2 {
	margin: 0 0 25px;
	font-size: 28px;
	font-weight: 600;
	line-height: 1.5em;
	letter-spacing: .08em;
	text-align: center;
	color: #1a3a5c;
}

#about .about-desc {
	margin: 0 auto 40px;
	max-width: 700px;
	font-size: 17px;
	font-weight: 400;
	line-height: 2em;
	letter-spacing: .05em;
	text-align: center;
	color: #3a5a7a;
}

#about .about-features {
	display: flex;
	justify-content: center;
	gap: 40px;
	margin: 0 auto;
	max-width: 700px;
}

#about .about-feature {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
}

#about .about-feature-icon {
	width: 70px;
	height: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 30px;
	color: #1B9FFF;
	background: rgba(255,255,255,0.8);
	border: 1px solid rgba(27,159,255,0.25);
	border-radius: 16px;
	box-shadow: 0 4px 15px rgba(27,159,255,0.1);
}

#about .about-feature-label {
	font-size: 14px;
	font-weight: 600;
	color: #1a3a5c;
}

@media screen and (max-width: 600px) {
	#about {
		padding: 50px 4vw 40px;
	}
	
	#about h2 {
		font-size: 5.5vw;
	}
	
	#about .about-desc {
		font-size: 3.8vw;
		line-height: 1.9em;
	}
	
	#about .about-features {
		flex-wrap: nowrap;
		gap: 20px;
	}
	
	#about .about-feature {
		width: 40%;
	}
	
	#about .about-feature-icon {
		width: 55px;
		height: 55px;
		font-size: 24px;
	}
	
	#about .about-feature-label {
		font-size: 12px;
	}
}

/* About hero image */
#about .about-hero-image {
	display: block;
	width: 100%;
	max-width: 900px;
	margin: 50px auto 0;
	border-radius: 16px;
	box-shadow: 0 10px 40px rgba(0,0,0,0.15);
}

@media screen and (max-width: 600px) {
	#about .about-hero-image {
		margin-top: 30px;
		border-radius: 10px;
	}
}

/* About Split Layout - 左文字右图 */
#about.about-split {
	display: flex;
	align-items: center;
	gap: 40px;
	padding: 60px 5%;
}

#about.about-split .about-inner {
	flex: 1.4;
	text-align: left;
}

#about.about-split .about-inner h2 {
	text-align: left;
}

#about.about-split .about-desc {
	text-align: left;
}

#about.about-split .about-features {
	justify-content: flex-start;
}

#about.about-split .about-hero-image {
	flex: 1;
	max-width: 40%;
	height: auto;
	border-radius: 12px;
	box-shadow: 0 8px 30px rgba(0,0,0,0.1);
}

@media (max-width: 900px) {
	#about.about-split {
		flex-direction: column;
	}
	#about.about-split .about-inner {
		text-align: center;
	}
	#about.about-split .about-inner h2,
	#about.about-split .about-desc {
		text-align: center;
	}
	#about.about-split .about-features {
		justify-content: center;
	}
	#about.about-split .about-hero-image {
		max-width: 100%;
	}
}

/* About Split - 标题居中，文字3行 */
#about.about-split .about-inner h2 {
	text-align: center;
	width: 100%;
	position: relative;
	left: 20%;
}

#about.about-split .about-desc {
	max-width: 600px;
}

/* About Split v2 - 标题居中上方，下方左文右图 */
#about.about-split {
	display: block;
	padding: 60px 5%;
}

#about.about-split > h2 {
	text-align: center;
	margin-bottom: 40px;
}

#about.about-split .about-content {
	display: flex;
	align-items: center;
	gap: 50px;
}

#about.about-split .about-content .about-inner {
	flex: 1.5;
}

#about.about-split .about-content .about-hero-image {
	flex: 1;
	max-width: 38%;
	border-radius: 12px;
	box-shadow: 0 8px 30px rgba(0,0,0,0.1);
}

#about.about-split .about-desc {
	text-align: left;
	line-height: 1.9;
	margin-bottom: 30px;
}

#about.about-split .about-features {
	justify-content: flex-start;
}

@media (max-width: 900px) {
	#about.about-split .about-content {
		flex-direction: column;
	}
	#about.about-split .about-content .about-hero-image {
		max-width: 100%;
	}
	#about.about-split .about-desc {
		text-align: center;
	}
	#about.about-split .about-features {
		justify-content: center;
	}
}

/* About Split v3 - 文字居中，图标居中 */
#about.about-split .about-content .about-inner {
	text-align: center;
}

#about.about-split .about-desc {
	text-align: center !important;
	line-height: 2.2;
}

#about.about-split .about-features {
	justify-content: center !important;
}

/* About Split v4 - 左侧更宽 */
#about.about-split .about-content .about-inner {
	flex: 2 !important;
}

#about.about-split .about-content .about-hero-image {
	flex: 0.8 !important;
	max-width: 32% !important;
}

/* About Split v5 - 更激进的宽度 */
#about.about-split .about-content {
	gap: 30px !important;
}

#about.about-split .about-content .about-inner {
	flex: 2.5 !important;
	min-width: 60%;
}

#about.about-split .about-content .about-hero-image {
	flex: 0.6 !important;
	max-width: 28% !important;
}

/* Merit 2x2 网格布局 */
.merit-grid-four {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr) !important;
	gap: 20px !important;
}

.merit-grid-four .merit-card {
	padding: 25px !important;
}

.merit-grid-four .merit-card h4 {
	font-size: 1.1rem !important;
	margin-bottom: 10px !important;
}

.merit-grid-four .merit-card p {
	font-size: 0.9rem !important;
	line-height: 1.6 !important;
}

.merit-grid-four .merit-card-num {
	font-size: 1.2rem !important;
	margin-bottom: 10px !important;
}

@media (max-width: 600px) {
	.merit-grid-four {
		grid-template-columns: 1fr !important;
	}
}

/* Merit 卡片优化 - 蓝色左边框 + 蓝色数字 */
.merit-grid-four .merit-card {
	border-left: 4px solid #1B9FFF !important;
	border-radius: 0 12px 12px 0 !important;
	text-align: left !important;
	position: relative !important;
}

.merit-grid-four .merit-card-num {
	background: linear-gradient(135deg, #1B9FFF, #0066cc) !important;
	color: #fff !important;
	width: 40px !important;
	height: 40px !important;
	border-radius: 50% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-weight: 700 !important;
	font-size: 1rem !important;
	margin-bottom: 15px !important;
}

.merit-grid-four .merit-card h4 {
	color: #1a365d !important;
	font-size: 1.15rem !important;
	margin-bottom: 12px !important;
}

.merit-grid-four .merit-card p {
	color: #555 !important;
}

/* Merit 标题图标样式 */
.merit-grid-four .merit-card h4 i {
	color: #1B9FFF !important;
	margin-right: 8px !important;
}

/* Merit 4种颜色 */
.merit-grid-four .merit-card:nth-child(1) {
	border-left-color: #1B9FFF !important;
}
.merit-grid-four .merit-card:nth-child(1) .merit-card-num {
	background: linear-gradient(135deg, #1B9FFF, #0066cc) !important;
}
.merit-grid-four .merit-card:nth-child(1) h4 i {
	color: #1B9FFF !important;
}

.merit-grid-four .merit-card:nth-child(2) {
	border-left-color: #10b981 !important;
}
.merit-grid-four .merit-card:nth-child(2) .merit-card-num {
	background: linear-gradient(135deg, #10b981, #059669) !important;
}
.merit-grid-four .merit-card:nth-child(2) h4 i {
	color: #10b981 !important;
}

.merit-grid-four .merit-card:nth-child(3) {
	border-left-color: #8b5cf6 !important;
}
.merit-grid-four .merit-card:nth-child(3) .merit-card-num {
	background: linear-gradient(135deg, #8b5cf6, #7c3aed) !important;
}
.merit-grid-four .merit-card:nth-child(3) h4 i {
	color: #8b5cf6 !important;
}

.merit-grid-four .merit-card:nth-child(4) {
	border-left-color: #f59e0b !important;
}
.merit-grid-four .merit-card:nth-child(4) .merit-card-num {
	background: linear-gradient(135deg, #f59e0b, #d97706) !important;
}
.merit-grid-four .merit-card:nth-child(4) h4 i {
	color: #f59e0b !important;
}

/* 去掉小蓝点 - 跟 long_cloud 一致 */
.plan-cards li::before {
	display: none !important;
}

.notice-box ul li::before {
	display: none !important;
}

#fee .price li::before {
	display: none !important;
}

.price li::before {
	display: none !important;
}

/* ===== Plan Cards 样式 (跟 long_cloud 一致) ===== */
#plan .plan-cards {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	gap: 15px;
	width: 100%;
	max-width: 960px;
	margin: 20px auto 0;
	padding: 0;
	list-style: none;
}
#plan .plan-cards li {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 17%;
	padding: 30px 10px 25px;
	background: #fff;
	border: 2px solid #e0e0e0;
	border-radius: 12px;
	text-align: center;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
#plan .plan-cards li::before {
	display: none !important;
}
#plan .plan-cards li:hover {
	border-color: #1B9FFF;
	box-shadow: 0 4px 16px rgba(27,159,255,0.15);
}
#plan .plan-cards li .plan-icon {
	font-size: 28px;
	margin-bottom: 10px;
	color: #1B9FFF;
}
#plan .plan-cards li .plan-days {
	font-size: 28px;
	font-weight: 700;
	color: #1B9FFF;
	line-height: 1em;
	margin-bottom: 4px;
}
#plan .plan-cards li .plan-unit {
	font-size: 14px;
	color: #666;
}
#plan .plan-cards li .plan-use {
	margin-top: 8px;
	font-size: 11px;
	color: #888;
	line-height: 1.4em;
}
#plan .plan-cards li.popular {
	border-color: #1B9FFF;
	background: linear-gradient(180deg, #f0f8ff 0%, #fff 100%);
	box-shadow: 0 4px 16px rgba(27,159,255,0.15);
}
#plan .plan-cards li.popular::before {
	content: "人気" !important;
	display: block !important;
	position: absolute;
	top: -12px;
	left: 50%;
	transform: translateX(-50%);
	padding: 3px 14px;
	font-size: 12px;
	font-weight: 600;
	color: #fff;
	background: #FF6B35;
	border-radius: 20px;
}
#plan .plan-cards li.popular .plan-use {
	color: #1B9FFF;
}

/* ===== 料金区样式 (跟 long_cloud 一致) ===== */
#fee {
	background: #f8f9fa;
	padding: 60px 5%;
}
#fee .fee-lead {
	max-width: 600px;
	margin: 0 auto 25px;
	font-size: 15px;
	color: #555;
	text-align: center;
	line-height: 1.8em;
}
#fee .price {
	display: flex;
	justify-content: center;
	gap: 20px;
	list-style: none;
	padding: 0;
	margin: 0 auto;
	max-width: 600px;
}
#fee .price li {
	flex: 1;
	background: #fff;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}
#fee .price li::before {
	display: none !important;
}
#fee .price li h3 {
	background: linear-gradient(135deg, #1B9FFF, #0066cc);
	color: #fff;
	padding: 12px;
	font-size: 16px;
	text-align: center;
	margin: 0;
}
#fee .price li p {
	padding: 20px;
	text-align: center;
	font-size: 15px;
	color: #333;
	margin: 0;
}

/* ===== Notice Box (跟 long_cloud 一致) ===== */
#fee .notice-box {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	max-width: 600px;
	margin: 25px auto 0;
	padding: 18px 24px;
	background: #f0f6fc;
	border: 1px solid #d4e5f7;
	border-radius: 10px;
}
#fee .notice-box-icon {
	font-size: 18px;
	color: #1B9FFF;
	margin-top: 2px;
	flex-shrink: 0;
}
#fee .notice-box ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
#fee .notice-box li {
	padding: 3px 0;
	font-size: 12px;
	color: #5a7a9a;
	line-height: 1.6em;
}
#fee .notice-box li::before {
	display: none !important;
}

/* ===== CTA Button ===== */
.bt_cv {
	text-align: center;
	padding: 50px 5%;
}
.bt_cv-lead {
	margin: 0 0 20px;
	font-size: 16px;
	color: #555;
}
.bt_cv a {
	display: inline-block;
	padding: 18px 50px;
	background: linear-gradient(135deg, #FF6B35, #e55a2b);
	color: #fff;
	font-size: 18px;
	font-weight: 600;
	border-radius: 50px;
	text-decoration: none;
	transition: transform 0.2s, box-shadow 0.2s;
}
.bt_cv a:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(255,107,53,0.4);
}

@media (max-width: 768px) {
	#plan .plan-cards li {
		width: 45%;
	}
	#fee .price {
		flex-direction: column;
	}
}

/* ===== 强制覆盖 - 橙色CTA按钮 ===== */
.bt_cv a {
	background: linear-gradient(135deg, #FF6B35, #e55a2b) !important;
	border: none !important;
	border-radius: 50px !important;
}
.bt_cv a:hover {
	background: linear-gradient(135deg, #e55a2b, #d04a1b) !important;
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(255,107,53,0.4) !important;
}

/* ===== Plan图标颜色 ===== */
#plan .plan-cards li .plan-icon i {
	color: #1B9FFF !important;
}

/* ===== 确保人気徽章显示 ===== */
#plan .plan-cards li.popular::before {
	content: "人気" !important;
	display: block !important;
	position: absolute !important;
	top: -12px !important;
	left: 50% !important;
	transform: translateX(-50%) !important;
	padding: 3px 14px !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	color: #fff !important;
	background: #FF6B35 !important;
	border-radius: 20px !important;
	letter-spacing: 0.1em !important;
	z-index: 10 !important;
}

/* ===== 修复人気徽章显示文字 ===== */
#plan .plan-cards li.popular::before {
	content: "人気" !important;
	display: block !important;
	position: absolute !important;
	top: -12px !important;
	left: 50% !important;
	transform: translateX(-50%) !important;
	padding: 4px 16px !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	color: #fff !important;
	background: #FF6B35 !important;
	border-radius: 20px !important;
	letter-spacing: 0.1em !important;
	z-index: 10 !important;
	white-space: nowrap !important;
	min-width: auto !important;
	width: auto !important;
	height: auto !important;
	line-height: 1.2 !important;
}

/* ===== 最终修复：只隐藏非popular的蓝点 ===== */
#plan .plan-cards li:not(.popular)::before {
	display: none !important;
}
#plan .plan-cards li.popular::before {
	content: "人気" !important;
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
	position: absolute !important;
	top: -12px !important;
	left: 50% !important;
	transform: translateX(-50%) !important;
	padding: 4px 18px !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	color: #fff !important;
	background: #FF6B35 !important;
	border-radius: 20px !important;
	letter-spacing: 0.1em !important;
	z-index: 100 !important;
	white-space: nowrap !important;
	width: auto !important;
	height: auto !important;
	line-height: 1.3 !important;
}

/* ===== 料金卡片 - 跟 long_cloud 完全一致 ===== */
#fee ul.price {
	display: flex !important;
	flex-wrap: wrap !important;
	justify-content: center !important;
	gap: 20px !important;
	width: 100% !important;
	max-width: 600px !important;
	margin: 0 auto !important;
	padding: 0 !important;
	list-style: none !important;
}
#fee ul.price li {
	display: block !important;
	width: 46% !important;
	background: #fff !important;
	border: none !important;
	border-radius: 8px !important;
	overflow: hidden !important;
	box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
}
#fee ul.price li h3 {
	display: block !important;
	margin: 0 !important;
	padding: 14px 0 !important;
	color: #fff !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	text-align: center !important;
	background: linear-gradient(135deg, #1B9FFF, #0077e6) !important;
	border: none !important;
}
#fee ul.price li p {
	display: block !important;
	margin: 0 !important;
	padding: 20px 0 !important;
	font-size: 15px !important;
	text-align: center !important;
	background: #fff !important;
	border: none !important;
	color: #333 !important;
}

/* ===== CTA按钮 - 蓝色 ===== */
.bt_cv a {
	background: linear-gradient(135deg, #1B9FFF, #0077e6) !important;
	border: none !important;
}
.bt_cv a:hover {
	background: linear-gradient(135deg, #0077e6, #005bb5) !important;
	box-shadow: 0 6px 20px rgba(27,159,255,0.4) !important;
}

/* ===== 官公庁向けバッジ ===== */
.gov-badge {
	display: inline-block;
	padding: 6px 18px;
	margin-bottom: 15px;
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	background: linear-gradient(135deg, #1B9FFF, #0066cc);
	border-radius: 30px;
	letter-spacing: 0.1em;
}

/* ===== Plan卡片内容居中 ===== */
#plan .plan-cards li {
	display: flex !important;
	
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
}
#plan .plan-cards li .plan-icon {
	text-align: center !important;
}
#plan .plan-cards li .plan-days {
	text-align: center !important;
}
#plan .plan-cards li .plan-unit {
	text-align: center !important;
}
#plan .plan-cards li .plan-use {
	text-align: center !important;
	width: 100% !important;
}

/* ===== Plan区域整体居中 ===== */
#plan {
	text-align: center !important;
}
#plan .plan-cards {
	display: flex !important;
	justify-content: center !important;
	margin: 20px auto 0 !important;
	padding: 0 !important;
	width: 100% !important;
	max-width: none !important;
}

/* ===== 移动端响应式优化 ===== */
@media (max-width: 768px) {
	/* About区 */
	#about.about-split .about-content {
		
	}
	#about.about-split .about-content .about-hero-image {
		max-width: 100% !important;
		margin-top: 30px;
	}
	#about.about-split .about-desc {
		text-align: center !important;
	}
	#about.about-split .about-features {
		justify-content: center !important;
		flex-wrap: wrap !important;
		gap: 15px !important;
	}
	
	/* Merit区 */
	.merit-grid-four {
		grid-template-columns: 1fr !important;
	}
	
	/* Function区 */
	.case-grid.three-col {
		grid-template-columns: 1fr !important;
	}
	
	/* Scene区 */
	.scene-grid {
		grid-template-columns: repeat(2, 1fr) !important;
	}
	
	/* Plan区 */
	#plan .plan-cards {
		flex-wrap: wrap !important;
	}
	#plan .plan-cards li {
		width: 45% !important;
		margin-bottom: 15px;
	}
	
	/* 料金区 */
	#fee .price {
		
	}
	#fee .price li {
		width: 100% !important;
	}
}

@media (max-width: 480px) {
	/* 超小屏幕 */
	.scene-grid {
		grid-template-columns: 1fr !important;
	}
	#plan .plan-cards li {
		width: 100% !important;
	}
	.gov-badge {
		font-size: 12px !important;
		padding: 4px 12px !important;
	}
}

/* Flow Steps - 導入の流れ */
.flow-steps {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: 8px;
	margin: 40px 0;
	flex-wrap: nowrap;
}
.flow-step {
	background: #fff;
	border-radius: 12px;
	padding: 15px 10px;
	text-align: center;
	width: 120px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.08);
	position: relative;
}
.flow-step-num {
	position: absolute;
	top: -12px;
	left: 50%;
	transform: translateX(-50%);
	background: #1B9FFF;
	color: #fff;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	font-size: 0.8rem;
	font-weight: bold;
	line-height: 24px;
}
.flow-step-icon {
	font-size: 1.5rem;
	color: #1B9FFF;
	margin-bottom: 15px;
}
.flow-step h4 {
	font-size: 0.9rem;
	margin-bottom: 10px;
	color: #333;
}
.flow-step p {
	font-size: 0.85rem;
	color: #666;
	line-height: 1.5;
}
.flow-arrow {
	display: flex;
	align-items: center;
	color: #1B9FFF;
	font-size: 1.2rem;
}
.flow-note {
	text-align: center;
	background: linear-gradient(135deg, #e8f4fd 0%, #f0f8ff 100%);
	padding: 15px 30px;
	border-radius: 8px;
	display: inline-block;
	margin: 0 auto;
	color: #1B9FFF;
}
.flow-note strong {
	color: #0d6efd;
	font-size: 1.1rem;
}
#flow {
	text-align: center;
}
@media (max-width: 768px) {
	.flow-steps {
		flex-direction: column;
		align-items: center;
	}
	.flow-arrow {
		transform: rotate(90deg);
		margin: 10px 0;
	}
	.flow-step {
		width: 120px;
		max-width: 280px;
	}
}

/* Flow Line - 簡潔な導入フロー */
.flow-line {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 15px;
	margin: 30px 0;
	padding: 20px 40px;
	background: #f8f9fa;
	border-radius: 8px;
	font-size: 1.1rem;
	flex-wrap: wrap;
}
.flow-line span {
	color: #333;
	font-weight: 500;
}
.flow-arrow-simple {
	color: #1B9FFF;
	font-weight: bold;
}
.flow-time {
	text-align: center;
	color: #1B9FFF;
	font-weight: bold;
	margin-top: 10px;
}
.flow-time i {
	margin-right: 5px;
}

/* Flow with numbers */
.flow-item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.flow-num {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 22px;
	height: 22px;
	background: #1B9FFF;
	color: #fff;
	border-radius: 50%;
	font-size: 0.75rem;
	font-weight: bold;
}
#scene .scene-grid li:nth-child(5) .scene-icon { color: #FFC107; }
#scene .scene-grid li:nth-child(6) .scene-icon { color: #795548; }

/* GPS Cloud - Merit Grid Five */
.merit-grid-five {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
	max-width: 1200px;
	margin: 30px auto 0;
}
@media (max-width: 1024px) {
	.merit-grid-five {
		grid-template-columns: repeat(3, 1fr);
	}
}
@media (max-width: 768px) {
	.merit-grid-five {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 480px) {
	.merit-grid-five {
		grid-template-columns: 1fr;
	}
}
.merit-grid-five .merit-card {
	padding: 25px 20px;
	background: #fff;
	border-radius: 12px;
	border: 1px solid #e5eaef;
	box-shadow: 0 2px 15px rgba(0,0,0,0.04);
	transition: all 0.2s ease;
	text-align: center;
}
.merit-grid-five .merit-card:hover {
	border-color: #1B9FFF;
	box-shadow: 0 8px 25px rgba(27,159,255,0.1);
	transform: translateY(-3px);
}
.merit-grid-five .merit-card-num {
	font-size: 0.9rem;
	color: #1B9FFF;
	font-weight: bold;
	margin-bottom: 10px;
}
.merit-grid-five .merit-card h4 {
	font-size: 1rem;
	margin: 10px 0 8px;
	color: #333;
}
.merit-grid-five .merit-card p {
	font-size: 0.85rem;
	color: #666;
	line-height: 1.5;
}
.merit-icon-img {
	width: 60px;
	height: 60px;
	object-fit: contain;
	margin: 0 auto 10px;
	display: block;
}

/* GPS Cloud function/products list - no bullets */
#function ul.list,
#products ul.list {
	list-style: none;
	padding: 0;
	margin: 0 auto;
	max-width: 900px;
}

#function ul.list li,
#products ul.list li {
	list-style: none;
	padding-left: 0;
}

#function ul.list li::before,
#products ul.list li::before {
	display: none !important;
}

#products ul.list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
}

#products ul.list li {
	width: 220px;
	padding: 20px;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.1);
	text-align: center;
}

#products ul.list li h3 {
	color: #fff;
	background: #1B9FFF;
	padding: 10px;
	margin: -20px -20px 15px;
	border-radius: 8px 8px 0 0;
	font-size: 14px;
}

#products ul.list li h4 {
	color: #1B9FFF;
	font-size: 18px;
	margin-bottom: 10px;
}

#products ul.list li p {
	font-size: 13px;
	color: #666;
	line-height: 1.6;
	min-height: 80px;
}

#products ul.list li img {
	max-width: 150px;
	height: auto;
	margin: 15px auto;
}

#products ul.list li .bt {
	display: inline-block;
	padding: 8px 15px;
	background: #1B9FFF;
	color: #fff;
	border-radius: 5px;
	text-decoration: none;
	font-size: 13px;
}

#function ul.list li {
	margin-bottom: 40px;
}

#function ul.list li img {
	background: #ffffff;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}

/* Override blue bullets for function/products lists */
#service .column #function ul.list li::before,
#service .column #products ul.list li::before,
#service #function ul.list li::before,
#service #products ul.list li::before,
body#service .column ul.list li::before {
	display: none !important;
	content: none !important;
}

/* Function item full width */
#function ul.list li.full-width {
	width: 100%;
	max-width: 680px;
	margin-left: auto;
	margin-right: auto;
}

/* Function section 2-column grid */
#function ul.list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
	max-width: 1000px;
}

#function ul.list li {
	margin-bottom: 0;
}

#function ul.list li.full-width {
	grid-column: 1 / -1;
	max-width: 100%;
}

#function ul.list li h3 {
	background: linear-gradient(135deg, #1B9FFF 0%, #0e7ed4 100%);
	color: #fff;
	padding: 12px 20px;
	border-radius: 8px 8px 0 0;
	font-size: 16px;
	margin: 0;
}

#function ul.list li p {
	padding: 15px 20px;
	background: #fff;
	margin: 0;
	font-size: 14px;
	line-height: 1.8;
}

#function ul.list li img {
	width: 100%;
	border-radius: 0 0 8px 8px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

@media (max-width: 768px) {
	#function ul.list {
		grid-template-columns: 1fr;
	}
}

/* Camera list single column */
#products ul.list.camera-list {
	flex-direction: column;
	align-items: center;
	max-width: 300px;
	margin: 0 auto;
}

#products ul.list.camera-list li {
	width: 100%;
	max-width: 280px;
}

/* Function two-column layout (1,2,3 left / 4,5 right) */
.function-two-col {
	display: flex;
	gap: 30px;
	max-width: 1100px;
	margin: 0 auto;
}

.function-col-left,
.function-col-right {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 30px;
}

.function-item {
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.1);
	overflow: hidden;
}

.function-item h3 {
	background: linear-gradient(135deg, #1B9FFF 0%, #0e7ed4 100%);
	color: #fff;
	padding: 12px 20px;
	font-size: 15px;
	margin: 0;
}

.function-item p {
	padding: 15px 20px;
	margin: 0;
	font-size: 14px;
	line-height: 1.8;
	color: #444;
}

.function-item img {
	width: 100%;
	display: block;
}

@media (max-width: 768px) {
	.function-two-col {
		flex-direction: column;
	}
}

/* Camera list single row (4 items horizontal) */
#products ul.list.camera-list {
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	max-width: 1000px;
	gap: 15px;
}

#products ul.list.camera-list li {
	width: 220px;
	flex-shrink: 0;
}

/* Camera list alignment fix */
#products ul.list.camera-list li {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-height: 380px;
}

#products ul.list.camera-list li p {
	flex-grow: 1;
	min-height: 80px;
}

#products ul.list.camera-list li img {
	margin-top: auto;
}

#products ul.list.camera-list li .bt {
	margin-top: auto;
}

/* Function rows layout */
.function-row {
	display: flex;
	justify-content: center;
	gap: 20px;
	margin-bottom: 25px;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
}

.function-row.row-3 .function-item {
	flex: 1;
	max-width: 320px;
}

.function-row.row-2 .function-item {
	flex: 1;
	max-width: 400px;
}

.function-row .function-item {
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.1);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.function-row .function-item h3 {
	background: linear-gradient(135deg, #1B9FFF 0%, #0e7ed4 100%);
	color: #fff;
	padding: 12px 15px;
	font-size: 14px;
	margin: 0;
	text-align: center;
}

.function-row .function-item p {
	padding: 12px 15px;
	margin: 0;
	font-size: 13px;
	line-height: 1.7;
	color: #444;
	flex-grow: 1;
}

.function-row .function-item img {
	width: 100%;
	display: block;
	margin-top: auto;
}

@media (max-width: 900px) {
	.function-row {
		flex-wrap: wrap;
	}
	.function-row .function-item {
		min-width: 280px;
	}
}

/* Router list alignment fix */
#products ul.list li {
	display: flex;
	flex-direction: column;
	align-items: center;
}

#products ul.list li p {
	flex-grow: 1;
}

#products ul.list li img {
	margin-top: auto;
	margin-bottom: 15px;
}

#products ul.list li .bt {
	margin-top: auto;
}

/* Product card header same width */
#products ul.list li h3 {
	width: 100%;
	box-sizing: border-box;
	white-space: nowrap;
}

#products ul.list li {
	width: 240px;
}

/* Price cards same width */
#fee ul.price {
	display: flex;
	justify-content: center;
	gap: 20px;
}

#fee ul.price li {
	width: 250px;
	text-align: center;
}

#fee ul.price li h3 {
	width: 100%;
	box-sizing: border-box;
}

/* Product & Price headers fill card width */
#products ul.list li h3,
#fee ul.price li h3 {
	display: block;
	width: calc(100% + 40px);
	margin-left: -20px;
	margin-right: -20px;
	margin-top: -20px;
	border-radius: 8px 8px 0 0;
}

/* Price card headers fill width */
.column#fee ul.price li {
	position: relative;
	padding: 0;
	overflow: hidden;
	border-radius: 8px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.column#fee ul.price li h3 {
	display: block;
	width: 100%;
	margin: 0;
	padding: 15px 20px;
	background: linear-gradient(135deg, #1B9FFF 0%, #0e7ed4 100%);
	color: #fff;
	border-radius: 8px 8px 0 0;
	box-sizing: border-box;
}

.column#fee ul.price li p {
	padding: 20px;
	margin: 0;
}

/* Compact merit cards */
.merit-grid-four {
	gap: 15px;
	max-width: 900px;
}

.merit-grid-four .merit-card {
	padding: 20px 15px;
}

.merit-grid-four .merit-card h4 {
	font-size: 15px;
	margin-bottom: 8px;
}

.merit-grid-four .merit-card p {
	font-size: 13px;
	line-height: 1.6;
}

.merit-grid-four .merit-card-num {
	font-size: 20px;
}

/* Compact function cards */
.function-row {
	gap: 15px;
	margin-bottom: 15px;
}

.function-row.row-3 .function-item {
	max-width: 280px;
}

.function-row.row-2 .function-item {
	max-width: 350px;
}

.function-row .function-item h3 {
	padding: 10px 12px;
	font-size: 13px;
}

.function-row .function-item p {
	padding: 10px 12px;
	font-size: 12px;
	line-height: 1.6;
}

/* Function row-2 equal height */
.function-row.row-2 {
	align-items: stretch;
}

.function-row.row-2 .function-item {
	display: flex;
	flex-direction: column;
}

.function-row.row-2 .function-item img {
	height: 200px;
	object-fit: cover;
	object-position: top;
}

/* Product text alignment */
#products ul.list li p {
	min-height: 65px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

/* Compact product cards */
#products ul.list li {
	width: 200px;
	padding: 15px;
}

#products ul.list li h3 {
	padding: 8px 10px;
	font-size: 12px;
	margin: -15px -15px 12px;
}

#products ul.list li h4 {
	font-size: 16px;
	margin-bottom: 8px;
}

#products ul.list li p {
	font-size: 11px;
	line-height: 1.5;
	min-height: 50px;
}

#products ul.list li img {
	max-width: 120px;
	margin: 10px auto;
}

#products ul.list li .bt {
	padding: 6px 12px;
	font-size: 12px;
}

/* Mobile responsive fixes */
@media (max-width: 768px) {
	/* Function rows stack vertically */
	.function-row {
		flex-direction: column;
		align-items: center;
	}
	
	.function-row .function-item {
		width: 100%;
		max-width: 350px;
	}
	
	.function-row.row-2 .function-item img {
		height: auto;
		max-height: 200px;
	}
	
	/* Product cards wrap */
	#products ul.list {
		flex-wrap: wrap;
	}
	
	#products ul.list li {
		width: 45%;
		min-width: 150px;
	}
	
	#products ul.list.camera-list {
		flex-wrap: wrap;
	}
	
	#products ul.list.camera-list li {
		width: 45%;
		min-width: 150px;
	}
	
	/* Merit cards */
	.merit-grid-four {
		grid-template-columns: 1fr;
		gap: 15px;
	}
	
	/* Scene grid */
	.scene-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	
	/* Plan cards scroll */
	.plan-cards {
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		padding-bottom: 10px;
	}
	
	.plan-cards li {
		min-width: 120px;
		flex-shrink: 0;
	}
}

/* AI Cloud detect cards mobile - 2 columns */
@media (max-width: 768px) {
	#plan .plan-cards {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
		overflow-x: visible;
	}
	
	#plan .plan-cards li {
		min-width: auto;
		width: 100%;
	}
	
	#plan .plan-cards li.popular {
		grid-column: span 1;
	}
}

/* AI Cloud detect cards - force 2 columns on mobile */
@media (max-width: 768px) {
	.column#plan .plan-cards,
	section#plan .plan-cards,
	#plan ul.plan-cards {
		display: grid !important;
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 10px !important;
		overflow-x: visible !important;
		flex-wrap: wrap !important;
	}
	
	.column#plan .plan-cards li,
	section#plan .plan-cards li,
	#plan ul.plan-cards li {
		min-width: auto !important;
		width: 100% !important;
	}
}

/* Scene grid mobile 2 columns */
@media (max-width: 768px) {
	.scene-grid,
	#scene .scene-grid,
	section#scene .scene-grid {
		display: grid !important;
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 15px !important;
	}
	
	.scene-grid li,
	#scene .scene-grid li {
		width: 100% !important;
	}
}
