/* ========== エリア対策4ページ共通CSS ========== */

/* ========== 基本（このページのar-page内のみ） ========== */
.ar-page { color:#333; line-height:1.8; font-size:15px; }
.ar-page *, .ar-page *::before, .ar-page *::after { box-sizing:border-box; }
.ar-page img { max-width:100%; height:auto; }
.ar-page a { color:#2b7a9e; }
.ar-page p { margin:0 0 1em; }
.ar-page ul { margin:0; padding-left:1.4em; }
.ar-page li { margin-bottom:.4em; }

.ar-inner { max-width:1320px; margin:0 auto; padding:0 16px; }

/* ========== ページバナー ========== */

.ar-banner-title { font-size:45px; font-weight:bold; margin:0; letter-spacing:.05em; color:#fff; }
.ar-banner-sub { font-size:15px;; letter-spacing:.2em; margin-top:8px; opacity:.85; color:#fff; }
.ar-banner {
  background:
 
    url('/business-cleaning/assets/img/banner-uniform-cleaning.jpg') center center / cover no-repeat;
  color: #fff;
  text-align: center;
  padding: 48px 16px;
  min-height: 300px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* ========== パンくず ========== */
.ar-breadcrumb { font-size:13px; padding:12px 0; color:#666; }
.ar-breadcrumb a { color:#2b7a9e; text-decoration:none; }
.ar-breadcrumb span { margin:0 6px; color:#aaa; }

/* ========== セクション共通 ========== */
.ar-section { padding:48px 0; }
.ar-section-gray { background:#f5f8fa; }
.ar-h2 {
	font-size:25px; font-weight:bold; color:#1F5C8B;
	margin:0 0 24px; padding-bottom:10px;
	border-bottom:1px solid #1F5C8B;
}
.ar-lead { font-size:20px; margin-bottom:16px; }

/* ========== グリッド（flexbox） ========== */
.ar-grid { display:flex; flex-wrap:wrap; margin:0 -8px; }
.ar-col { padding:0 8px; margin-bottom:16px; width:100%; }
@media (min-width:640px) {
	.ar-col-2 { width:50%; }
	.ar-col-3 { width:33.333%; }
	.ar-col-4 { width:25%; }
	.ar-col-6 { width:16.6666%; }
}

/* ========== カード ========== */
.ar-card {
	background:#fff; border:1px solid #e2e8ee; border-radius:6px;
	padding:20px; height:100%;
}
.ar-card h3 { font-size:20px; font-weight:bold; margin:0 0 10px; color:#1F5C8B; }
.ar-card-head {
	background:#1F5C8B; color:#fff; font-weight:bold; font-size:15px;
	margin:-20px -20px 14px; padding:12px 20px;
	border-radius:6px 6px 0 0;
}
.ar-card p { font-size:16px margin:0; }

/* ========== 理由リスト（番号付き） ========== */
.ar-reason { display:flex; gap:14px; margin-bottom:22px; }
.ar-reason-num {
	flex:0 0 40px; height:40px; border-radius:50%;
	background:#1F5C8B; color:#fff;
	display:flex; align-items:center; justify-content:center;
	font-weight:bold; font-size:20px;
}
.ar-reason-body h3 { font-size:20px; font-weight:bold; margin:0 0 6px; color:#222; }
.ar-reason-body p { font-size:16px margin:0; }

/* ========== 都市タグ ========== */
.ar-city {
	display:block; text-align:center;
	background:#fff; border:1px solid #d7e3ec; border-radius:6px;
	padding:12px 8px; font-weight:bold; font-size:14px
}
.ar-city small { display:block; font-weight:normal; font-size:11px; color:#777; margin-top:4px; }

/* ========== 業種タグ ========== */
.ar-tag {
	display:block; text-align:center;
	background:#fff; border:1px solid #d7e3ec; border-radius:6px;
	padding:14px 8px; font-weight:bold; font-size:16px
}
.ar-tag small { display:block; font-weight:normal; font-size:12px; color:#777; margin-top:4px; }

/* ========== ステップ ========== */
.ar-step { background:#fff; border:1px solid #e2e8ee; border-radius:6px; padding:20px; height:100%; }
.ar-step-num { color:#4fa6c6; font-weight:bold; font-size:13px; letter-spacing:.1em; margin-bottom:6px; }
.ar-step h3 { font-size:20px; font-weight:bold; margin:0 0 8px; }
.ar-step p { font-size:16px margin:0; }

/* ========== FAQ（開閉式） ========== */
.ar-faq details {
	background:#fff; border:1px solid #e2e8ee; border-radius:6px;
	margin-bottom:12px; overflow:hidden;
}
.ar-faq summary {
	cursor:pointer; padding:16px 20px;
	font-weight:bold; font-size:18px; list-style:none;
	display:flex; align-items:center; gap:10px;
}
.ar-faq summary::-webkit-details-marker { display:none; }
.ar-faq summary::before {
	content:"Q"; flex:0 0 26px; height:26px; border-radius:50%;
	background:#1F5C8B; color:#fff;
	display:flex; align-items:center; justify-content:center; font-size:13px;
}
.ar-faq summary::after { content:"＋"; margin-left:auto; color:#999; font-weight:normal; }
.ar-faq details[open] summary::after { content:"－"; }
.ar-faq .ar-faq-a { padding:0 20px 18px 56px; font-size:16px margin:0; }

/* ========== CTA ========== */
.ar-cta { background: linear-gradient(90deg, #6ec7e8 0%, #0d3e80 25%, #0d3e80 100%) !important; color:#fff; text-align:center; padding:56px 16px; }
.ar-cta h2 { font-size:36px; font-weight:bold; margin:0 0 14px; color:#fff; }
.ar-cta p { margin:0 0 26px; font-size:16px opacity:.92; color:#fff;}
.ar-btn {
	display:inline-block; text-decoration:none; font-weight:bold;
	padding:15px 32px; border-radius:6px; font-size:20px; margin:6px;
}
.ar-btn-primary { background:#fff; color:#1F5C8B; }
.ar-btn-outline { background:#fff; color:#1F5C8B; }
@media (max-width: 767.98px) {
  .ar-cta h2 {
    font-size: 1.5rem;
    line-height: 1.5;
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
}
/* ========== 拠点リスト ========== */
.ar-office { background:#fff; border:1px solid #e2e8ee; border-radius:6px; padding:20px; }
.ar-office dl { margin:0; }
.ar-office dt { font-weight:bold; font-size:16px margin-top:12px; }
.ar-office dt:first-child { margin-top:0; }
.ar-office dd { margin:2px 0 0; font-size:16px color:#444; }

/* ========== 関連リンク ========== */
.ar-links { display:flex; flex-wrap:wrap; gap:10px; padding:0; margin:0; list-style:none; }
.ar-links li { margin:0; }
.ar-links a {
	display:block; text-decoration:none; font-size:14px;
	background:#fff; border:1px solid #d7e3ec; border-radius:6px;
	padding:10px 14px; color:#1F5C8B; font-weight:bold;
}

/* ========== 対応サービス表 ========== */
.ar-table { width:100%; border-collapse:collapse; background:#fff; font-size:16px }
.ar-table th, .ar-table td { border:1px solid #e2e8ee; padding:12px 14px; text-align:left; vertical-align:top; }
.ar-table th { background:#1F5C8B; color:#fff; font-weight:bold; white-space:nowrap; }

@media (max-width:639px) {
	.ar-banner { padding:36px 16px; }
	.ar-banner-title { font-size:22px; }
	.ar-h2 { font-size:19px; }
	.ar-section { padding:36px 0; }
	.ar-btn { display:block; width:100%; max-width:320px; margin:8px auto; }
}