/* ================== ベース ================== */
body {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: #333;
  margin: 0;
  padding: 0;
}
.admin-bar{
　padding-top:0!important;
}

/* ================== 色 ================== */
.bg-gray-300 { background-color: #D1D5DB; }
.bg-lightblue { background-color: #F5F7FB; }
.bg-blue { background-color: #1565C0; }
.bg-dodgerblue { background-color: #1E88E5; }
.bg-white { background-color: #fff; }
.bg-gray-100 {background-color: #f3f4f6;}
.bg-blue\/10 {background-color: rgb(59 130 246 / 0.1);}
.bg-red-100 {background-color: #fee2e2;}
.bg-green-100 {background-color: #dcfce7;}
.text-blue { color: #1565C0; }
.text-dodgerblue { color: #1E88E5; }
.text-gray { color: #555; }
.text-white { color: #fff; }
.text-white\/90 { color: rgba(255,255,255,0.9); }
@media (max-width: 767px) {
	.sp-only {display: inline;}/* 改行 */
}
/* ================== レイアウト ================== */
.p-2 {padding: 0.5rem; }
.p-4 {padding: 1rem; }
.p-6 {padding: 1.5rem;}
.p-8 {padding: 2rem; }
.py-2 {padding-top: 0.5rem; padding-bottom: 0.5rem;}
.py-4 {padding-top: 1rem; padding-bottom: 1rem;}
.py-20 {padding-top: 5rem; padding-bottom: 5rem;}
.py-24 {padding-top: 6rem; padding-bottom: 6rem;}
.px-5 {padding-left: 1.25rem; padding-right: 1.25rem;}
.px-6 {padding-left: 1.5rem; padding-right: 1.5rem;}
.px-8 {padding-left: 2rem; padding-right: 2rem;}
.px-10 {padding-left: 2.5rem; padding-right: 2.5rem;}
.pl-3 {padding-left: 0.75rem;}
.mb-1 {margin-bottom: 0.25rem;}
.mb-2 {margin-bottom: 0.5rem;}
.mb-4 {margin-bottom: 1rem; }
.mb-6 {margin-bottom: 1.5rem;}
.mb-8 {margin-bottom: 2rem;}
.mb-10 {margin-bottom: 2.5rem;}
.mb-12 {margin-bottom: 3rem;}
.ml-4 {margin-left: 1rem;}
.mt-3 {margin-top: 0.75rem;}
.mt-6 {margin-top: 1.5rem;}
.mt-8 {margin-top: 2rem;}
.space-y-6{ margin-top: 1.5rem;}
.max-w-2xl {max-width: 42rem; margin-left: auto; margin-right: auto;}
.max-w-4xl {max-width: 56rem; margin-left: auto; margin-right: auto;}
.max-w-5xl {max-width: 64rem; margin-left: auto; margin-right: auto;}
.max-w-6xl {max-width: 72rem; margin-left: auto; margin-right: auto;}
.mx-auto {margin-left: auto; margin-right: auto;}
.w-full {width: 100%;}
.h-full {height: 100%;}
.w-16 {width: 4rem;}
.w-48 {width: 12rem;}
.h-16 {height: 4rem;}
.h-40 {height: 10rem;}
.h-64 {height: 16rem;}
.grid {display: grid;}
.grid-cols-1 { grid-template-columns: repeat(1, 1fr); }
.grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
.grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
@media (min-width: 768px) {.md-grid-cols-2 {grid-template-columns: repeat(2, minmax(0, 1fr));}}
@media (min-width: 768px) {.md-grid-cols-3 {grid-template-columns: repeat(3, minmax(0, 1fr));}}
.items-start {align-items: flex-start;}
.items-center { align-items: center; }
.flex {display: flex;}
.justify-center {justify-content: center;}
.text-center {text-align: center;}
.gap-4 { gap: 1rem; }
.gap-6 { gap: 1.5rem; }
.gap-8 { gap: 2rem; }
.gap-10 { gap: 2.5rem; }
/* ================== ボックス/角丸 ================== */
.rounded { border-radius: 0.25rem; }
.rounded-md { border-radius: 0.375rem; }
.rounded-lg { border-radius: 0.5rem; }
.rounded-xl { border-radius: 0.75rem; }
.rounded-2xl { border-radius: 1rem; }
.rounded-full { border-radius: 9999px; }
.shadow { box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
.shadow-sm { box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
.shadow-md { box-shadow: 0 6px 10px rgba(0,0,0,0.12); }
.overflow-hidden { overflow: hidden;}
.object-contain{object-fit: contain;}
/* ================== テキスト ================== */
.text-sm { font-size: 0.875rem; }
.text-base { font-size: 1rem; }
.text-lg { font-size: 1.125rem; }
.text-xl { font-size: 1.25rem; }
.text-2xl { font-size: 1.5rem; }
.text-3xl { font-size: 1.875rem; }
.text-4xl { font-size: 2.25rem; }
.text-5xl { font-size: 2.5rem; }
.font-bold { font-weight: 700; }
.font-semibold { font-weight: 600; }
.font-serif {font-family:serif;}
.leading-snug { line-height: 1.25; }
.hover-opacity-90:hover { opacity: 0.9;}
.hover-bg-blue-600:hover {background-color:#2563eb;}
.sp-only {display: none;}/* 改行 */
@media (max-width: 767px) {
	.sp-only {display: inline;}/* 改行 */
}
/* ================== ボタン ================== */
button {
	cursor: pointer;
	border: none;
	outline: none;
	transition: all 0.3s;
}
button:hover { opacity: 0.9; }
.hover\:underline:hover { text-decoration: underline; }
.hover\:opacity-90:hover { opacity: 0.9; }
.hover\:bg-blue-600:hover { background-color: #2563EB; }
/* ================== アニメーション ================== */
.transition {
	transition-property: background-color, border-color, color, opacity, box-shadow, transform;
	transition-duration: 150ms;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
}
/* ================== ヘッダー調整 ================== */
.lp-header{
	display: flex;
	justify-content: space-between; /* 左：ロゴ / 右：電話 */
	align-items: center;   
}
.lp-header-logo {
  display: flex;
  flex-direction: column; /* ← これが肝 */
  align-items: flex-start; /* 左揃え（中央なら center） */
  gap: 4px;
}
.lp-header-logo p{
	font-size:10px;
}
.lp-header-logo img {
	height: 60px;   /* 高さは好みで調整 */
	width: auto;
}
@media screen and (max-width: 768px) {
.l-header-phone {display:none;}
}
.l-header-phone {
	text-align: right;
}
.l-header-phone a {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
	text-decoration: none;
}
.phone-icon {
	width: 25px;
	height: auto;
}
.l-navigationPhone__text {
  font-size: 26px;   /* ← 好みで 28px とかもOK */
  font-weight: 700;
  line-height: 1;
}
/* ================== MV調整 ================== */
.section-padding-20{padding-top: 5rem; padding-bottom: 5rem;}
.section-padding-24{padding-top: 6rem; padding-bottom: 6rem;}

/* ================== 制作事例一覧 ================== */
.cases-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 24px;
}
.case-card {
	background: #fff;
	border-radius: 12px;
	padding: 20px;
	box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.case-image img,
.no-image {
	width: 100%;
	height: 180px;
	object-fit: cover;
	background: #eee;
	border-radius: 8px;
}
.case-meta {
	font-size: 14px;
	color: #666;
	margin: 8px 0 12px;
}
/* ================== 課題解決 ================== */
.card {
	background-color: #fff;
	border-radius: 0.5rem; /* 角丸8px */
	box-shadow: 0 4px 10px rgba(0,0,0,0.1);
	padding: 1.5rem;
}
.card-icon {
	font-size: 2rem;
	margin-right: 1rem;
}
.card-problem {
	background-color: #FFE5E5; /* 薄赤 */
	font-weight: 600;
	padding: 0.5rem;
	border-radius: 0.375rem;
	margin-bottom: 0.5rem;
}
.card-solution {
	background-color: #E5FFE5; /* 薄緑 */
	padding: 0.5rem;
	border-radius: 0.375rem;
}
@media screen and (max-width: 768px) {
	.card {
		padding: 1rem;
	}
}
/* ================== フォーム共通 ================== */
.mw_wp_form{
	border: 1px solid #e5e5e5;
	padding: 1em;
	background-color: white;
}
.form-item {
	display: flex;
	padding: 20px 0;
	border-bottom: 1px solid #e5e5e5; /* ★ 項目間の境界線 */
	align-items: center;
}
.form-item:last-child {
	border-bottom: none;
}
.form-label {
	width: 200px; /* 左ラベル幅（PC） */
	font-weight: bold;
}
.required {
	background: #e60033;
	color: #fff;
	padding: 8px 10px;
	border-radius: 6px;
	font-size: 12px;
	margin-right: 6px;
}
.form-field {
	flex: 1;
}
.mwf_input,
.mwf_textarea,
select {
	width: 100%;
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 4px;
	background-color: #eaedf2;
}
.note {
	margin-top: 6px;
	font-size: 14px;
	color: #666;
}
/* MW WP Form の余計な <br> を無効化 */
.form-item.size br { display: none; }
/* ========== サイズ欄（3つ横並び） =========== */
.form-item.size .form-field {
	display: flex;
	gap: 15px;
	flex-wrap: wrap;
}
.form-item.size .mwf_input {
	flex: 1;
//	min-width: 150px;
}
.form-item.size .note {
	flex-basis: 100%;
	margin-top: 10px;
}
/* ================== スマホ対応 ================== */
@media screen and (max-width: 768px) {
	.form-item {
		flex-direction: column;
		align-items: flex-start;
	}
	.form-label {
		width: 100%;
	}
	.form-item.size .form-field {
		flex-direction: column;
	}
	.form-item.size .mwf_input {
		width: 100%;
	}
	.section-padding-20{padding-top: 3rem; padding-bottom: 3rem;}
	.section-padding-24{padding-top: 4rem; padding-bottom: 4rem;}
}

/* ================== 電話番号フィールド ================== */
span.mwform-tel-field {
	display: inline-flex;
	gap: 5px;
	justify-content: center;
}
.sticky-footer {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 14px 16px;
	background: #ffffff;
	border-top: 1px solid #ddd;
	text-align: center;
	z-index: 9999;
	transition: transform 0.3s ease;
}

/* ================== 送信ボタン（中央配置） ================== */
.mwf_button_wrap {
	text-align: center;
}
.mwf_button {
	margin:20px auto!important;
	background-color: rgba(242,155,55,1)!important;
	color: #ffffff!important;
	font-weight: 600;
	font-size: 1.125rem!important;
	border-radius: 0.75rem;
	box-shadow: 0 4px 12px rgba(0,0,0,0.1);
	border: none;
}

.mwf_button:hover { opacity: 0.9; }
/* ==================  追従ボタン ==================  */
.sticky-footer-btn {
	display:block;
	background: #0066cc; 
	color: #fff;
	padding: 14px 32px;
	border-radius: 8px;
	text-decoration: none;
	font-size: 16px;
	font-weight: bold;
	width: 100%!important;
}
@media (min-width: 769px) {
	.sticky-footer {
		display: none;/* ← スマホのみ表示 */
		color: #fff;
	}
}

#js-footer-bar{display:none;}

/* ================== その他 ================== */
.p-footer-nav { display: none; }
@media (min-width: 768px) {
	.md\:grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
	.md\:grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
	.md\:text-left { text-align: left; }
	.md\:text-center { text-align: center; }
}