/* ============================================================
   みやざき洗染 / エムスタイル — 下層ページ用 メニュー装飾 v11
   ------------------------------------------------------------
   ※ このファイルは会話履歴から再構築した復元版です。
   ※ 原本のバイナリは sandbox に残っていません。
   ------------------------------------------------------------
   v11 変更:
     スマホ時のドロワーメニュー (.stellarnav.mobile > ul) の
     上部と右の隙間を除去する。
   -------
   ・ margin-top / margin-left / margin-right を 0 に
     → ヘッダー下端と完全ドッキング、左と窓端はフルブリード。
   ・ 上辺 2 隅はヘッダーと直線接合で角丸 0。
   ・ 下部 2 隅は 14px 角丸を維持（浮遊カード感）。
   ・ ドロワー背景は #1e50a2 (明るめの若干落ち着いたブルー、
     v10 の #4a90e2 変更は適用しない)。
   ・ パソコン側セクション2 の 8px 角丸ドロップダウンは
     v8 据置 (frame + 内側角丸)。
   ・ バーガーボタンはセクション4 を維持 (v7 のデフォルト復帰)。
   ============================================================ */

/* ============================================================
   0. 共通（HOME アイコン色）
   ============================================================ */
nav[aria-label="Global Navigation"] .stellarnav ul li a i.color-blue,
nav[aria-label="Global Navigation"] .stellarnav ul li a i.fa-home {
	color: #1e50a2 !important;
}
nav[aria-label="Global Navigation"] .stellarnav ul li.current-menu-item > a i,
nav[aria-label="Global Navigation"] .stellarnav ul li.current-menu-ancestor > a i,
nav[aria-label="Global Navigation"] .stellarnav ul li.active > a i {
	color: #ffffff !important;
}

/* ============================================================
   1. デスクトップ — ホバー時の下線（ブルー）
   ============================================================ */
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul > li > a {
	border-bottom: 1px solid transparent;
}
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul > li:hover > a,
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul > li:focus-within > a {
	border-bottom-color: #1e50a2;
}

/* ============================================================
   2. デスクトップ — ドロップダウン外枠＋仕切り線＋ v8 角丸
   ============================================================ */
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul ul {
	background-color: #ffffff !important;
	border: 1px solid #1e50a2 !important;
	border-radius: 8px !important;
	overflow: hidden !important;
	box-shadow: 0 4px 12px rgba(13, 62, 128, 0.08) !important;
}
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul ul li {
	border-left: 1px solid rgba(30, 80, 162, 0.15) !important;
	border-bottom: 1px solid rgba(30, 80, 162, 0.10);
}
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul ul li:first-child > a {
	border-top-left-radius: 7px !important;
	border-top-right-radius: 7px !important;
}
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul ul li:last-child {
	border-right: 1px solid rgba(30, 80, 162, 0.15) !important;
	border-bottom: none !important;
}
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul ul li:last-child > a {
	border-bottom-left-radius: 7px !important;
	border-bottom-right-radius: 7px !important;
}
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul ul li a {
	color: #1e50a2 !important;
}
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul ul li a:hover {
	background-color: #1e50a2 !important;
	color: #ffffff !important;
}

/* ============================================================
   3. デスクトップ — 現ページのハイライト
   ============================================================ */
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul > li.current-menu-item > a,
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul > li.current-menu-ancestor > a,
nav[aria-label="Global Navigation"] .stellarnav:not(.mobile) ul > li.active > a {
	background-color: #1e50a2 !important;
	color: #ffffff !important;
	border-bottom-color: #0d3e80 !important;
}

/* ============================================================
   4. モバイル — ハンバーガー（v7 ライブ状態を維持）
   ============================================================ */
nav[aria-label="Global Navigation"] .stellarnav.mobile a.menu-toggle {
	color: #1e50a2 !important;
}

/* ============================================================
   5. モバイル — ドロワー全体（v11：上部/右隙間除去＋底2隅14px角丸）
   ============================================================ */
nav[aria-label="Global Navigation"] .stellarnav.mobile > ul {
	background-color: #1e50a2 !important;
	border-top: 3px solid #0d3e80 !important;
	border-top-left-radius: 0 !important;
	border-top-right-radius: 0 !important;
	border-bottom-left-radius: 14px !important;
	border-bottom-right-radius: 14px !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	margin-top: 0 !important;
	overflow: hidden !important;
	box-shadow: 0 6px 18px rgba(13, 62, 128, 0.20) !important;
}
nav[aria-label="Global Navigation"] .stellarnav.mobile > ul > li:first-child > a {
	border-top-left-radius: 0 !important;
	border-top-right-radius: 0 !important;
}
nav[aria-label="Global Navigation"] .stellarnav.mobile > ul > li:last-child > a,
nav[aria-label="Global Navigation"] .stellarnav.mobile > ul > li:last-child {
	border-bottom-left-radius: 11px !important;
	border-bottom-right-radius: 11px !important;
}
nav[aria-label="Global Navigation"] .stellarnav.mobile ul li {
	border-bottom: 1px solid rgba(255, 255, 255, 0.22) !important;
}
nav[aria-label="Global Navigation"] .stellarnav.mobile ul li:last-child {
	border-bottom: 1px solid rgba(255, 255, 255, 0.32) !important;
}
nav[aria-label="Global Navigation"] .stellarnav.mobile ul li a:not(.dd-toggle) {
	color: #ffffff !important;
	font-weight: 600 !important;
}

/* ============================================================
   6. モバイル — 2階層目（深さを出すため濃紺＋左インデント）
   ============================================================ */
nav[aria-label="Global Navigation"] .stellarnav.mobile ul ul {
	background-color: #0d3e80 !important;
	border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.18) !important;
}
nav[aria-label="Global Navigation"] .stellarnav.mobile ul ul li {
	border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
}
nav[aria-label="Global Navigation"] .stellarnav.mobile ul ul li a:not(.dd-toggle) {
	color: #ffffff !important;
	border-left: 3px solid #1e50a2 !important;
}

/* ============================================================
   7. モバイル — ＋トグル（dd-toggle）→ 白線維持
   ============================================================ */
nav[aria-label="Global Navigation"] .stellarnav.mobile li a.dd-toggle .icon-plus::before,
nav[aria-label="Global Navigation"] .stellarnav.mobile li a.dd-toggle .icon-plus::after {
	border-bottom-color: #ffffff !important;
	background-color: #ffffff !important;
}

/* ============================================================
   8. モバイル — 現ページのハイライト
   ============================================================ */
nav[aria-label="Global Navigation"] .stellarnav.mobile ul li.current-menu-item,
nav[aria-label="Global Navigation"] .stellarnav.mobile ul li.current-menu-ancestor,
nav[aria-label="Global Navigation"] .stellarnav.mobile ul li.active {
	background-color: #0d3e80 !important;
}
nav[aria-label="Global Navigation"] .stellarnav.mobile > ul > li.current-menu-item,
nav[aria-label="Global Navigation"] .stellarnav.mobile > ul > li.current-menu-ancestor,
nav[aria-label="Global Navigation"] .stellarnav.mobile > ul > li.active {
	background-color: #0d3e80 !important;
	border-left: 4px solid #ffffff !important;
}
/* ============================================================
   スライダー1枚目 / SEO コピー — iPhone Safari対応版 (v5, 2026-08-14)
   ------------------------------------------------------------
   旧版(v4)では `inset` ショートハンドを使用していたが、
   古いiOS Safariや一部Safariビルドでは `inset` が解釈されず、
   position:absolute 要素が 静的位置(=左上) でレンダリングされ、
   テキストが左上・左端で切れる症状が発生していました。
   v5 は inset を完全排除し、top/left/right/bottom を
   明示指定 (Safari全バージョン対応) + bottom基準で配置。
   ※ Swiper 構造・画像幅はv4継承 (1枚表示・SP画像100%)
   ============================================================ */
.swiper-01 .swiper-slide.slide_img-01 .swiper-slide-text.is-seo {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
	align-items: flex-start !important;
	padding: 0 6% !important;
	z-index: 10 !important;
	opacity: 0;
}
.swiper-01 .swiper-slide.slide_img-01.swiper-slide-active .swiper-slide-text.is-seo,
.swiper-01 .swiper-slide.slide_img-01.swiper-slide-visible .swiper-slide-text.is-seo {
	opacity: 1 !important;
}

/* 主見出し (h1) */
.swiper-01 .slide-headline {
	color: #ffffff !important;
	font-size: clamp(20px, 2.8vw, 42px) !important;
	font-weight: 800 !important;
	line-height: 1.4 !important;
	letter-spacing: 0.01em !important;
	margin: 0 0 14px 0 !important;
	text-shadow:
		0 2px 8px rgba(0, 30, 70, 0.95),
		0 0 20px rgba(0, 30, 70, 0.65),
		0 0 2px rgba(0, 0, 0, 0.85) !important;
}
.swiper-01 .slide-headline .line-1,
.swiper-01 .slide-headline .line-2,
.swiper-01 .slide-headline .line-3 { display: block !important; }
.swiper-01 .slide-headline strong {
	color: #ffd64d !important;
	font-weight: 800 !important;
	text-shadow:
		0 2px 6px rgba(0, 30, 70, 1),
		0 0 24px rgba(13, 62, 128, 0.85) !important;
}

/* サブコピー (p) */
.swiper-01 .slide-subcopy {
	color: #ffffff !important;
	font-size: clamp(13px, 1.35vw, 19px) !important;
	font-weight: 600 !important;
	line-height: 1.75 !important;
	margin: 0 0 18px 0 !important;
	max-width: 640px !important;
	text-shadow:
		0 1px 4px rgba(0, 30, 70, 0.95),
		0 0 14px rgba(0, 30, 70, 0.6),
		0 0 2px rgba(0, 0, 0, 0.7) !important;
}

/* 業種タグ (ul / li) */
.swiper-01 .slide-tags {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	margin: 0 !important; padding: 0 !important;
	list-style: none !important;
}
.swiper-01 .slide-tags li {
	display: inline-block !important;
	color: #ffffff !important;
	background: rgba(13, 62, 128, 0.55) !important;
	border: 1px solid rgba(255, 255, 255, 0.4) !important;
	padding: 5px 12px !important;
	border-radius: 999px !important;
	font-size: clamp(11px, 0.95vw, 14px) !important;
	font-weight: 600 !important;
	text-shadow: 0 1px 3px rgba(0, 30, 70, 0.7) !important;
}

/* 768px 以下 — スマホ時はスライダー1枚目のコピーを非表示
   (2026-08-14: 位置調整が無限に続いたため、要件どおり非表示に)
   ※ コピーは .is-seo(SEO用HTML) のため DOM には残り、
     検索エンジンの評価は維持される。PC(769px以上)は従来どおり表示。 */
@media (max-width: 768px) {
	/* SP画像は画面幅いっぱいに表示（スライダー全体の整列用） */
	.swiper-01 .swiper-slide img.d-md-none {
		width: 100% !important;
		height: auto !important;
		display: block !important;
	}
	/* スライダー1枚目のコピー（見出し・タグ）を非表示 */
	.swiper-01 .swiper-slide.slide_img-01 .swiper-slide-text.is-seo {
		display: none !important;
		opacity: 0 !important;
	}
	/* ドロワーメニューはハンバーガー操作で開かれるまで描画しない
	   （遷移時に一瞬でもメニュー文字が現れないよう CSS 側でも最終防衛。
	   ※ !important を付けないことで、stellarnav の .active による
	   開閉動作は従来どおり有効） */
	.stellarnav.mobile > ul { display: none; }
}

/* ============================================================
   スマホ（768px以下）: ページ遷移直後の文字チラつき対策 (2026-08-14)
   ------------------------------------------------------------
   遷移先ページで wow.js のフェードイン演出（visibility:hidden から
   アニメーション表示）が走るため、遷移直後に文字が一瞬消えて
   再表示される＝「文字がチラつく」状態になっていた。
   SPでは wow アニメーション自体を無効化し、初めから表示する。
   ※ PC(769px以上)の演出は従来どおり維持。
   ============================================================ */
@media (max-width: 768px) {
	.wow {
		visibility: visible !important;
		opacity: 1 !important;
		animation: none !important;
		animation-delay: 0s !important;
	}
}

/* ============================================================
   帯バナー (lp_cap_bg/balloon): 水色→青 グラデーション背景 (2026-08-14)
   元の指定 (common.css: .lp_cap_bg #ff9914 / .balloon #1e50a2) を
   水色(左) → 青(右) の横グラデーションに変更。
   下部の波型装飾 (.balloon::after) はそのまま維持。
   ============================================================ */
.lp_cap_bg,
.lp_cap_bg.balloon {
	background: linear-gradient(90deg, #6ec7e8 0%, #0d3e80 15%, #0d3e80 100%) !important;
}

/* 帯バナー: テキスト上下の余白 (2026-08-14) */
.lp_cap_bg .container {
	padding-top: 2rem !important;
	padding-bottom: 2rem !important;
}
@media (max-width: 768px) {
	.lp_cap_bg .container {
		padding-top: 1.5rem !important;
		padding-bottom: 1.5rem !important;
	}
}

/* ============================================================
   法人向けユニフォームサービス・対応エリア カードデザイン (2026-08-14)
   + 見出し揃え(What's New / 下層ページの subtitle h2 と同系)
   ============================================================ */

/* 見出し揃え */
.lp-section-title {
	margin-top: 3rem !important;
	margin-bottom: 1.5rem !important;
	font-size: clamp(1.8rem, 4.2vw, 2.6rem) !important;
	letter-spacing: 0.08em !important;
	color: #0d3e80 !important;
	font-weight: 800 !important;
	text-align: left !important;
}
@media (max-width: 767px) {
	.lp-section-title {
		margin-top: 1.5rem !important;
		margin-bottom: 1rem !important;
		font-size: 1.5rem !important;
	}
}

/* カード共通デザイン */
.lp-section-title,
.lp_section .card {
	border: 0 !important;
	border-radius: 10px !important;
	background: #ffffff !important;
	box-shadow: 0 2px 10px rgba(13, 62, 128, 0.10);
	transition: box-shadow .2s ease, transform .2s ease;
	overflow: hidden;
}
.lp_section .card:hover {
	box-shadow: 0 6px 18px rgba(13, 62, 128, 0.18);
	transform: translateY(-2px);
}
.lp_section .card-body {
	padding: 1.25rem 1.25rem 1.5rem !important;
}

/* タイトルとコピーの間に挿入する画像 */
.lp-card-image {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 16 / 9 !important;
	object-fit: cover !important;
	margin: 0.75rem 0 1rem !important;
	border-radius: 6px !important;
	background: #e9f2f7;
}
@media (max-width: 767px) {
	.lp-card-image {
		aspect-ratio: 4 / 3 !important;
		margin: 0.5rem 0 0.75rem !important;
	}
}
.lp_section .mt-3.mb-0,
.lp_section p.mb-0 {
	text-align: right !important;
}
@media (min-width: 769px) {
	.sp-br { display: none; }
}
/* 見出し揃え（下層ページのsubtitleと同系） */
.lp-section-title {
	margin-top: 3rem !important;
	margin-bottom: 1.5rem !important;
	font-size: clamp(1.8rem, 4.2vw, 2.6rem) !important;
	letter-spacing: 0.08em !important;
	color: #0d3e80 !important;
	font-weight: 800 !important;
	text-align: left !important;
}
@media (max-width: 767px) {
	.lp-section-title {
		margin-top: 1.5rem !important;
		margin-bottom: 1rem !important;
		font-size: 1.5rem !important;
	}
}

/* カードデザイン */
.card {
	border: 0 !important;
	border-radius: 10px !important;
	background: #ffffff !important;
	box-shadow: 0 2px 10px rgba(13, 62, 128, 0.10);
	transition: box-shadow .2s ease, transform .2s ease;
	overflow: hidden;
}
.card:hover {
	box-shadow: 0 6px 18px rgba(13, 62, 128, 0.18);
	transform: translateY(-2px);
}

/* タイトルとコピーの間の画像 */
.lp-card-image {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 16 / 9 !important;
	object-fit: cover !important;
	margin: 0.75rem 0 1rem !important;
	border-radius: 6px !important;
}
@media (max-width: 767px) {
	.lp-card-image {
		aspect-ratio: 4 / 3 !important;
		margin: 0.5rem 0 0.75rem !important;
	}
}

/* 「詳しく見る →」: 青線・角丸ボタン化 + 70%縮小 */
.card p.mt-3.mb-0 a {
	display: inline-block !important;
	padding: 0.55em 1.5em !important;
	border: 2px solid #0d3e80 !important;   /* 青線 */
	border-radius: 999px !important;        /* 角丸（カプセル型） */
	background: #ffffff !important;
	color: #0d3e80 !important;
	font-size: 0.95rem !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	transform: scale(0.8) !important;       /* 70%縮小 */
	transform-origin: left center !important;
	transition: background .2s ease, color .2s ease;
}
.card p.mt-3.mb-0 a:hover {
	background: #0d3e80 !important;         /* ホバーで青背景+白文字 */
	color: #ffffff !important;
}

/* 対応エリア4ボタン: 水色背景ピル + 小さな英語表記 */
.col-6 .card-body.text-center a,
[class*="col-md-3"] .card-body.text-center a {
	display: inline-block !important;
	background: #2f86c4 !important;          /* 水色背景 */
	color: #ffffff !important;
	padding: 0.55em 1.5em !important;
	border-radius: 999px !important;  
	font-size: 1.20em !important;    /* 角丸ピル */
	font-weight: 700 !important;
	text-decoration: none !important;
	box-shadow: 0 2px 6px rgba(13,62,128,.15);
	transition: background .2s ease, transform .2s ease;
}
.col-6 .card-body.text-center a:hover {
	background: #1e50a2 !important;          /* ホバーで濃い青 */
	transform: translateY(-1px);
}
.area-en {
	display: block !important;
	font-size: 0.80em !important;            /* 小さく */
	letter-spacing: 0.12em !important;
	opacity: 0.9 !important;
	margin-top: 1px !important;
}
/* 対応エリア: 白色カード枠を削除 + ボタンを列いっぱい幅に */
.col-6 .card,
[class*="col-md-3"] .card {
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;   /* 白背景を除去 */
	box-shadow: none !important;          /* 影を除去 */
	overflow: visible !important;
	transition: none !important;
	transform: none !important;           /* ホバー浮きも無効 */
}
.col-6 .card .card-body,
[class*="col-md-3"] .card .card-body {
	padding: 0 !important;                /* 余白も除去 */
}
.col-6 .card-body.text-center a,
[class*="col-md-3"] .card-body.text-center a {
	width: 100% !important;               /* 横幅いっぱい */
	box-sizing: border-box !important;
	max-width: none !important;
}