@charset "utf-8";
/* アイコン用 FontAwesome 6.5.2（採用サイトと同じライブラリ）。@charsetの直後に置く */
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css");
/*============================================================
  リニューアル用スタイル（ヘッダー＆グローバルナビ）
  ※既存 style.css を上書きする形で読み込みます
============================================================*/

:root{
	--ichigo-red:#e85a7a;        /* いちごのメインカラー（赤みピンク） */
	--ichigo-red-d:#d8456a;      /* 濃いめ（ホバー用） */
	--ichigo-pink:#f4a0b4;       /* やわらかピンク（採用ボタン） */
	--ichigo-pink-l:#fbe4ea;     /* 薄ピンク（境界・背景） */
	--ichigo-cream:#fff3cf;      /* クリーム（問い合わせボタン） */
	--ichigo-cream-b:#ecd489;    /* クリーム枠線 */
	--ichigo-cream-t:#7a6326;    /* クリーム上の文字 */
	--ichigo-text:#4a3b3f;       /* 基本の濃い文字色 */
	--ichigo-sub:#9b8a8e;        /* 補足テキスト */
}

/* 上部アクセントライン（緑→いちご色） */
#container{ border-top:4px solid var(--ichigo-red); }

/*------------------------------------------------------------
  ヘッダー
------------------------------------------------------------*/
.site-header{
	height:auto;                 /* 旧 header{height:140px} を解除 */
	background:#fff;
	border-bottom:1px solid var(--ichigo-pink-l);
}
.header-inner{
	display:flex;
	align-items:center;
	gap:28px;
	max-width:1180px;
	margin:0 auto;
	padding:16px 24px;
	flex-wrap:wrap;
}

/* ブランド（ロゴ＋その下のキャッチ） */
.header-brand{ flex-shrink:0; }
.header-brand .catch{
	font-size:14.5px;
	color:var(--ichigo-sub);
	letter-spacing:.14em;
	margin:2px 0 0;
	text-align:center;
}
.site-header #logo{ margin:0; }
.site-header #logo img{
	position:static;            /* 旧 absolute を解除 */
	display:block;              /* 画像下のインライン隙間を除去（キャッチとの間を詰める） */
	width:390px;
	max-width:100%;
	height:auto;
	left:auto; top:auto;
}

/* 連絡先（TEL / FAX / 受付） */
.header-contact{ text-align:right; line-height:1.5; }
.header-contact p{ margin:0; }
.hc-tel{
	font-size:28px;
	font-weight:700;
	color:var(--ichigo-text);
	letter-spacing:.02em;
}
.hc-tel a{
	display:inline-flex;
	align-items:center;
	color:inherit;
	text-decoration:none;
	transition:.2s;
}
.hc-tel a:hover{ color:var(--ichigo-red); }
.hc-tel .hc-ico{                  /* 電話アイコンをピンクの円に入れる */
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:36px;
	height:36px;
	margin-right:13px;
	border:2px solid var(--ichigo-pink);
	border-radius:50%;
	color:var(--ichigo-red);
	font-size:15px;
}
.hc-fax{                          /* FAXは控えめに（小さくグレー） */
	font-size:15px;
	font-weight:600;
	color:var(--ichigo-sub);
	letter-spacing:.02em;
	margin-top:2px !important;
}
.hc-fax span{
	font-size:13px;
	font-weight:700;
	color:var(--ichigo-sub);
	letter-spacing:.08em;
	margin-right:7px;
}
.hc-reception{                    /* FAXとの間に区切り線 */
	font-size:12px;
	color:var(--ichigo-sub);
	border-top:1px solid #ece2e4;
	margin-top:9px !important;
	padding-top:9px;
}

/* ボタン（お問い合わせ＝白アウトライン／採用情報＝ピンクのピル）。縦に2つ並べる */
.header-buttons{ display:flex; flex-direction:column; align-items:flex-end; gap:11px; }
.hbtn{
	display:inline-flex;
	align-items:center;
	gap:8px;
	min-width:176px;
	box-sizing:border-box;        /* width:100%時に padding/border を含めて親をはみ出さない */
	text-decoration:none;
	font-size:13.5px;
	font-weight:700;
	letter-spacing:.04em;
	white-space:nowrap;
	transition:.2s;
}
.hbtn .hbtn-tx{ flex:1; text-align:center; }   /* 文字を中央寄せ（アイコン左・矢印右はそのまま） */
.hbtn .hbtn-arrow{ font-size:12px; opacity:.7; }
.hbtn-contact{
	background:#fff;
	border:1.5px solid var(--ichigo-pink);
	color:var(--ichigo-text);
	padding:9px 15px;
	border-radius:10px;
}
.hbtn-contact .fa-envelope{ color:var(--ichigo-red); }
.hbtn-contact .hbtn-arrow{ color:var(--ichigo-sub); }
.hbtn-contact:hover{ background:var(--ichigo-pink-l); border-color:var(--ichigo-red); }
.hbtn-recruit{
	background:linear-gradient(135deg,#f7a8bd 0%,#ec6e90 100%);
	color:#fff;
	padding:10px 19px;
	border-radius:999px;
}
.hbtn-recruit:hover{ filter:brightness(1.05); }

/*------------------------------------------------------------
  グローバルナビ（EN＋JP 2段）
------------------------------------------------------------*/
.gnav{
	border-top:1px solid var(--ichigo-pink-l);
	background:#fff;
}
.gnav ul{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	max-width:1180px;
	margin:0 auto;
}
.gnav li{ flex:0 0 auto; }
.gnav li a{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	text-decoration:none;
	padding:15px 30px;
	min-width:128px;
	transition:.2s;
	border-bottom:3px solid transparent;
}
.gnav li + li a{ border-left:1px dotted var(--ichigo-pink-l); }
.gnav li a .en{
	font-size:11px;
	font-weight:700;
	letter-spacing:.18em;
	color:var(--ichigo-pink);
}
.gnav li a .jp{
	font-size:16px;
	font-weight:700;
	color:var(--ichigo-text);
	margin-top:4px;
}
.gnav li a:hover{ background:var(--ichigo-pink-l); }
.gnav li a:hover .en,
.gnav li a:hover .jp,
.gnav li.current a .en,
.gnav li.current a .jp{ color:var(--ichigo-red); }
.gnav li.current a{ border-bottom-color:var(--ichigo-red); }

/* SP用ハンバーガーのトグル本体／ボタンはPCでは非表示（SPのみ表示） */
.gnav-toggle{ position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.gnav-btn{ display:none; }

/*------------------------------------------------------------
  スライドショー／サブ画像を通常フローに（旧 absolute を解除）
------------------------------------------------------------*/
#mainimg, #subimg,
body.home #mainimg{
	position:relative;
	margin:0 auto;
}
#mainimg img,
#mainimg video{
	width:100%;
	height:auto;
	display:block;
}

/*------------------------------------------------------------
  レスポンシブ
------------------------------------------------------------*/
@media screen and (max-width:900px){
	.header-inner{ flex-direction:column; align-items:center; text-align:center; gap:16px; padding:16px; }
	.header-brand{ margin-right:0; }
	.header-contact{ text-align:center; }
	.header-buttons{ align-items:center; }
	.gnav li a{ min-width:0; padding:12px 18px; }
}
@media screen and (max-width:600px){
	.site-header #logo img{ width:240px; }   /* ハンバーガーボタンと干渉しないよう少し小さく */
	.hc-tel{ font-size:22px; }
	.hc-tel .hc-ico{ width:30px; height:30px; font-size:13px; margin-right:9px; }
	.hc-fax{ font-size:14px; }
	.header-buttons{ width:100%; align-items:stretch; }
	.hbtn{ min-width:0; width:100%; padding:13px 18px; }
}

/*------------------------------------------------------------
  SP（768px以下）：グローバルナビをハンバーガーメニューに
------------------------------------------------------------*/
@media screen and (max-width:768px){
	/* ハンバーガーボタン：画面に固定（追従）＝流れから外すのでヘッダーを押し下げない。
	   position:fixed はビューポート基準のため、旧style.cssの header{position:relative} による
	   絶対配置の包含ブロック問題（rightが画面外に飛ぶ）を受けない */
	.gnav-btn{
		display:flex; align-items:center; justify-content:center;
		position:fixed; top:12px; right:12px; z-index:1100;
		width:48px; height:48px;
		background:#fff;
		border:1px solid var(--ichigo-pink);
		border-radius:10px;
		color:var(--ichigo-red);
		font-size:21px;
		cursor:pointer;
		box-shadow:0 2px 8px rgba(0,0,0,.12);
		transition:background .2s, color .2s, border-color .2s;
	}
	.gnav-close{ display:none; }
	.gnav-toggle:checked ~ .gnav-btn{ background:var(--ichigo-red); border-color:var(--ichigo-red); color:#fff; }
	.gnav-toggle:checked ~ .gnav-btn .gnav-bars{ display:none; }
	.gnav-toggle:checked ~ .gnav-btn .gnav-close{ display:inline-block; }

	/* メニュー：全画面オーバーレイ（display:noneだとアニメ不可→opacity/visibilityで開閉） */
	.gnav{ border-top:none; }
	.gnav ul{
		display:flex;
		position:fixed; inset:0; z-index:1000;
		box-sizing:border-box;
		flex-direction:column; justify-content:center; gap:0;
		max-width:none; margin:0;
		padding:76px 22px 40px;
		background:linear-gradient(160deg,#ffffff 0%,#fff4f6 100%);
		overflow-y:auto;
		opacity:0;
		visibility:hidden;
		pointer-events:none;
		transition:opacity .32s ease, visibility 0s .32s;   /* 閉時はフェード後にvisibility切替 */
	}
	.gnav-toggle:checked ~ .gnav ul{
		opacity:1;
		visibility:visible;
		pointer-events:auto;
		transition:opacity .32s ease, visibility 0s 0s;     /* 開時は即visible＋フェードイン */
	}
	/* 各項目：下からふわっと（チェック時に時間差で立ち上がる） */
	.gnav li{
		flex:none; width:100%; max-width:380px; margin:0 auto;
		opacity:0;
		transform:translateY(14px);
		transition:opacity .4s ease, transform .4s ease;
	}
	.gnav-toggle:checked ~ .gnav ul li{ opacity:1; transform:none; }
	.gnav-toggle:checked ~ .gnav ul li:nth-child(1){ transition-delay:.10s; }
	.gnav-toggle:checked ~ .gnav ul li:nth-child(2){ transition-delay:.16s; }
	.gnav-toggle:checked ~ .gnav ul li:nth-child(3){ transition-delay:.22s; }
	.gnav-toggle:checked ~ .gnav ul li:nth-child(4){ transition-delay:.28s; }
	.gnav-toggle:checked ~ .gnav ul li:nth-child(5){ transition-delay:.34s; }
	.gnav-toggle:checked ~ .gnav ul li:nth-child(6){ transition-delay:.40s; }
	.gnav li a{
		flex-direction:row; justify-content:center; align-items:baseline; gap:12px;
		min-width:0; padding:20px 12px;
		border-left:none !important;
		border-bottom:1px solid var(--ichigo-pink-l);
	}
	.gnav li a .en{ font-size:11px; letter-spacing:.18em; color:var(--ichigo-pink); margin:0; }
	.gnav li a .jp{ margin-top:0; font-size:18px; }
	.gnav li.current a .en,
	.gnav li.current a .jp{ color:var(--ichigo-red); }
}

/* 動きを減らす設定の人にはアニメを無効化（項目は即表示） */
@media (prefers-reduced-motion: reduce){
	.gnav ul, .gnav li, .gnav-btn{ transition:none !important; }
	.gnav-toggle:checked ~ .gnav ul li{ transition-delay:0s !important; }
}

/* 案B確定：ロゴ｜連絡先｜ボタンを左中右に均等配置 */
.header-inner{ justify-content:space-between; }


/*------------------------------------------------------------
  ドキュメントページ（個人情報保護方針 等）の見出し
------------------------------------------------------------*/
body.doc #contents h3{
	clear:both;
	text-align:left;
	border:none;
	border-bottom:1px solid #e6d9dd;
	border-radius:0;
	font-size:122%;
	font-weight:700;
	color:#5f5560;
	line-height:1.5;
	position:relative;
	margin:50px 0 18px;
	padding:0 0 12px 4px;
}
body.doc #contents p{
	color:#555;
	padding:0 4px 16px;
	line-height:1.9;
}

/* ドキュメントページの本文幅を読みやすく絞る */
body.doc #contents section{
	max-width:820px;
	margin-left:auto;
	margin-right:auto;
}
/* 会社概要：代表挨拶ブロックの幅を運営方針(.steps_ul)に揃える */
.about_greeting{
	width:65%;
	margin:0 auto;
}
@media screen and (max-width:1040px){
	.about_greeting{ width:80%; }
}
/* SP(≤600px)：代表の想い・運営方針もスタッフから一言(90%)に幅を揃える（依頼主指示） */
@media screen and (max-width:600px){
	.about_greeting{ width:90%; }
	.steps_ul{ width:90%; }
}
/*------------------------------------------------------------
  公開情報：PDF書類リスト
------------------------------------------------------------*/
.doc_list{
	list-style:none;
	max-width:760px;
	margin:16px auto 50px;
	padding:0;
}
.doc_list li{ margin:0 0 12px; }
.doc_list a{
	display:flex;
	align-items:center;
	gap:14px;
	padding:16px 22px;
	background:#fff;
	border:1px solid var(--ichigo-pink-l);
	border-left:5px solid var(--ichigo-red);
	border-radius:10px;
	text-decoration:none;
	color:var(--ichigo-text);
	font-weight:700;
	font-size:16px;
	box-shadow:0 1px 3px rgba(0,0,0,.05);
	transition:.2s;
}
.doc_list a:hover{
	background:var(--ichigo-pink-l);
	border-color:var(--ichigo-red);
	transform:translateY(-1px);
	box-shadow:0 3px 8px rgba(232,90,122,.18);
}
.doc_ic{
	flex-shrink:0;
	font-size:11px;
	font-weight:700;
	letter-spacing:.05em;
	color:#fff;
	background:var(--ichigo-red);
	padding:4px 8px;
	border-radius:4px;
}
.doc_tt{ flex:1; }
.doc_list a::after{
	content:"\203a";
	color:var(--ichigo-red);
	font-size:22px;
	font-weight:700;
	line-height:1;
}
@media screen and (max-width:600px){
	.doc_list a{ padding:14px 16px; font-size:14px; gap:10px; }
}
/* 運営方針：段落を読みやすく */
.steps_ul li{
	line-height:1.9;
	margin-bottom:1.1em;
}


/* ===== 概要テーブル（みる様サイト風：白背景・細い罫線・縦区切り線） ===== */
.gaiyo_contents{
	max-width:880px;
	margin:0 auto 70px;
}
.gaiyo{
	display:flex;
	width:100%;
	margin:0;
	font-size:1.02rem;
	border-bottom:1px solid #d9d9d9;
	box-sizing:border-box;
}
.gaiyo:last-child{
	border-bottom:none;
}
.gaiyo_th{
	width:30%;
	box-sizing:border-box;
	background:none;
	color:#6a6a6a;
	font-weight:500;
	letter-spacing:.04em;
	display:flex;
	align-items:center;
	justify-content:center;
	text-align:center;
	padding:24px 12px;
	margin:0;
}
.gaiyo_td{
	width:70%;
	box-sizing:border-box;
	background:none;
	color:#333;
	display:flex;
	align-items:center;
	padding:24px 14px 24px 36px;
	margin:0;
	border-left:1px solid #d9d9d9;
	line-height:1.85;
}
.gaiyo_td a{
	color:var(--ichigo-red);
	text-decoration:underline;
	word-break:break-all;
}
@media screen and (max-width:768px){
	.gaiyo_contents{ max-width:100%; }
	.gaiyo{ font-size:.95rem; }
	.gaiyo_th{ width:34%; padding:16px 6px; }
	.gaiyo_td{ width:66%; padding:16px 8px 16px 18px; }
}


/* ===== アクセスページ（1カラム：大きな地図＋アイコン情報） ===== */
.access{
	max-width:880px;
	margin:0 auto 70px;
}
.access-map{
	width:100%;
	height:440px;
	border-radius:16px;
	overflow:hidden;
	box-shadow:0 8px 24px rgba(0,0,0,.10);
}
.access-map iframe{
	width:100%;
	height:100%;
	border:0;
	display:block;
}
.access-mapbtn{
	text-align:center;
	margin:22px 0 48px;
}
.access-mapbtn a{
	display:inline-block;
	padding:10px 26px;
	font-size:.92rem;
	border-radius:999px;
	background:var(--ichigo-red);
	color:#fff;
	text-decoration:none;
	font-weight:600;
	letter-spacing:.03em;
	box-shadow:0 4px 12px rgba(232,90,122,.35);
	transition:background .2s, transform .2s;
}
.access-mapbtn a:hover{
	background:var(--ichigo-red-d);
	transform:translateY(-2px);
}
.access-mapbtn a::before{
	content:"📍 ";
}
.access-info{
	margin:0;
}
.access-item{
	padding:22px 6px;
	border-bottom:1px solid var(--ichigo-pink-l);
}
.access-item:last-child{
	border-bottom:none;
}
.access-item dt{
	display:flex;
	align-items:center;
	font-weight:700;
	color:var(--ichigo-red);
	font-size:1.06rem;
	letter-spacing:.04em;
	margin-bottom:8px;
}
.access-ic{
	font-size:1.3rem;
	line-height:1;
	margin-right:10px;
}
.access-item dd{
	margin:0;
	padding-left:36px;
	color:var(--ichigo-text);
	line-height:1.95;
	font-size:1.02rem;
}
.access-item dd a{
	color:var(--ichigo-red);
	text-decoration:underline;
	word-break:break-all;
}
@media screen and (max-width:768px){
	.access-map{ height:300px; border-radius:12px; }
	.access-item dd{ padding-left:0; }
}


/*------------------------------------------------------------
  PC時の全体幅を helpermiru.com（本文ラッパー .inner = 1150px）に合わせる
  外箱 #container を 1500px → 1150px に。中のヘッダー/ナビ/メイン画像も1150に統一。
------------------------------------------------------------*/
#container{
	max-width:1200px;
}
.header-inner,
.gnav ul,
#mainimg, #subimg{
	max-width:1200px;
}

/*------------------------------------------------------------
  フッター（PCはヘッダーを丸ごと再現：ロゴ｜連絡先｜ボタン＋横ナビ）
  ※連絡先(.header-contact)・ボタン(.hbtn)はヘッダーのクラスを再利用＝完全一致
------------------------------------------------------------*/
footer{
	background:#fff;
	color:var(--ichigo-text);
	font-size:100%;
	border-top:1px solid var(--ichigo-pink-l);
}
footer a{ color:var(--ichigo-text); }
footer a:hover{ color:var(--ichigo-red); }

/* 上段：ロゴ｜連絡先｜ボタン（.header-innerと同じ3ゾーン） */
.footer_top_inner{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:28px;
	flex-wrap:wrap;
	max-width:1200px;
	margin:0 auto;
	padding:30px 24px;
	box-sizing:border-box;
}
.footer_brand{ flex-shrink:0; }
.footer_logo_link img{ display:block; width:340px; max-width:100%; height:auto; }
.footer_brand .catch{
	font-size:14px;
	color:var(--ichigo-sub);
	letter-spacing:.14em;
	margin:2px 0 0;
	text-align:center;
}

/* 下段：横並びナビ（ヘッダー .gnav と同じ見た目） */
.footer_gnav{ border-top:1px solid var(--ichigo-pink-l); }
.footer_gnav ul{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	max-width:1200px;
	margin:0 auto;
	list-style:none;
	padding:0;
}
.footer_gnav li{ flex:0 0 auto; }
.footer_gnav li a{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	text-decoration:none;
	padding:15px 30px;
	min-width:128px;
	border-bottom:3px solid transparent;
	transition:.2s;
}
.footer_gnav li + li a{ border-left:1px dotted var(--ichigo-pink-l); }
.footer_gnav .en{ font-size:11px; font-weight:700; letter-spacing:.18em; color:var(--ichigo-pink); }
.footer_gnav .jp{ font-size:16px; font-weight:700; color:var(--ichigo-text); margin-top:4px; }
.footer_gnav li a:hover{ background:var(--ichigo-pink-l); }
.footer_gnav li a:hover .en,
.footer_gnav li a:hover .jp{ color:var(--ichigo-red); }

/* コピーライト（明るく・住所も併記） */
#copyright{ background:var(--ichigo-pink-l); color:var(--ichigo-sub); padding:12px; line-height:1.7; }
#copyright a{ color:var(--ichigo-sub); }
#copyright a:hover{ color:var(--ichigo-red); }

@media screen and (max-width:900px){
	.footer_top_inner{ flex-direction:column; align-items:center; text-align:center; gap:16px; padding:26px 16px; }
	.footer_gnav li a{ min-width:0; padding:12px 18px; }
}
@media screen and (max-width:600px){
	.footer_logo_link img{ width:270px; }
	.footer_gnav ul{ flex-direction:column; }
	.footer_gnav li{ width:100%; }
	.footer_gnav li a{ flex-direction:row; justify-content:center; gap:10px; padding:14px; border-left:none !important; border-bottom:1px solid var(--ichigo-pink-l); }
	.footer_gnav li:last-child a{ border-bottom:none; }
}

/*------------------------------------------------------------
  スタッフから一言（about.html・他セクションに合わせた基本サイズ）
  ※運営方針(.steps_ul)に合わせ width65%(1040px以下80%)/基本18px/
    中央寄せ/margin-bottom35px。横線区切りは除去（他セクションと同様プレーン）。
------------------------------------------------------------*/
.voice_list{
	width:65%;
	margin:0 auto 35px;
	padding:0;
	box-sizing:border-box;
}
.voice_msg{
	margin:0;
	padding:18px 0;
	text-align:center;
	line-height:2;
	font-size:18px;
	color:var(--ichigo-text);
}
@media screen and (max-width:1040px){
	.voice_list{ width:80%; }
}
@media screen and (max-width:600px){
	.voice_list{ width:90%; }
	.voice_msg{ font-size:16px; padding:14px 0; }
}

/*------------------------------------------------------------
  トップ：各ページへの導線カード（index.html .home_cards）
------------------------------------------------------------*/
.home_cards{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:18px;
	max-width:960px;
	margin:30px auto 10px;
	padding:0 16px;
	box-sizing:border-box;
}
.home_card{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:8px;
	padding:28px 12px;
	background:#fff;
	border:1.5px solid var(--ichigo-pink-l);
	border-radius:14px;
	text-decoration:none;
	color:var(--ichigo-text);
	box-shadow:0 3px 10px rgba(232,90,122,.08);
	transition:.2s;
}
.home_card:hover{
	background:var(--ichigo-pink-l);
	border-color:var(--ichigo-red);
	transform:translateY(-3px);
}
.home_card i{ font-size:30px; color:var(--ichigo-red); }
.home_card .ttl{ font-size:16px; font-weight:700; }
.home_card .sub{ font-size:11px; letter-spacing:.16em; color:var(--ichigo-pink); }
@media screen and (max-width:780px){
	.home_cards{ grid-template-columns:repeat(2,1fr); gap:14px; }
}
@media screen and (max-width:430px){
	.home_cards{ grid-template-columns:1fr; }
}

/*------------------------------------------------------------
  ページ見出し h2（センターライン型＋ロゴのハート飾り）
  ※中央寄せ。タイトルと英語サブの間に、ロゴと同じハート飾り
    (images/title_heart.png) を配置（左右の渦巻きが区切り線代わり）。
    英語サブは緑→イチゴ色・大文字に変更。🍓絵文字は各HTMLから除去済み。
    span が無いページ（お申し込み等）はタイトル＋ハートのみ表示。
------------------------------------------------------------*/
#contents h2{
	display:flex;
	flex-direction:column;
	align-items:center;		/*各要素を中央に積む*/
	clear:both;
	margin-bottom:46px;		/*下の余白*/
	font-size:2.5rem;		/*文字サイズ（旧250%相当）*/
	line-height:1.4;
	letter-spacing:.12em;	/*字間を少し広く*/
	color:var(--ichigo-text);
}
/* ロゴと同じハート飾り（タイトルと英語の間に表示） */
#contents h2::after{
	content:"";
	order:1;				/*タイトル(0)と英語span(2)の間に挟む*/
	width:116px;
	height:50px;
	margin:16px 0 4px;
	background:url(../images/title_heart.png) no-repeat center center;
	background-size:contain;
}
/* 英語サブテキスト（ハートの下） */
#contents h2 span{
	order:2;
	display:block;
	font-size:.95rem;
	font-weight:700;
	letter-spacing:.34em;
	text-transform:uppercase;	/*英語ラベル風に大文字化*/
	color:var(--ichigo-red);	/*旧:緑 → イチゴ色*/
}
@media screen and (max-width:600px){
	#contents h2{ font-size:1.8rem; margin-bottom:34px; }
	#contents h2::after{ width:96px; height:41px; margin:12px 0 4px; }
	#contents h2 span{ font-size:.82rem; letter-spacing:.28em; }
}

/*------------------------------------------------------------
  トップ：3つのサービス紹介カード（index.html「ようこそ」下の新セクション）
  ※高齢者の介護／障害福祉サービス／お手伝いサービスの3枚。
    手描きイラスト(images/service_*.png)＋タイトルのシンプルカード。
------------------------------------------------------------*/
.service3{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:24px;
	max-width:980px;
	margin:6px auto 0;
	padding:0 8px;
	box-sizing:border-box;
}
.service3_card{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:flex-start;
	text-align:center;
	gap:16px;
	padding:32px 22px 28px;
	background:#fff;
	border:1.5px solid var(--ichigo-pink-l);
	border-radius:24px;
	text-decoration:none;
	color:var(--ichigo-text);
	box-shadow:0 3px 12px rgba(232,90,122,.08);
	transition:.2s;
}
.service3_card:hover{
	border-color:var(--ichigo-red);
	transform:translateY(-3px);
	box-shadow:0 6px 18px rgba(232,90,122,.16);
}
/* 手描きイラスト：高さを揃える（縦横比はcontainで維持） */
.service3_card .s3_img{
	width:auto;
	height:170px;
	max-width:94%;
	object-fit:contain;
}
.service3_card .s3_ttl{ font-size:20px; font-weight:700; letter-spacing:.04em; }
@media screen and (max-width:780px){
	.service3{ grid-template-columns:1fr; max-width:440px; }
	.service3_card{ padding:28px 22px 24px; }
	.service3_card .s3_img{ height:190px; }
}
/* 「私たちのサービス」セクション上の余白を広めに（既定の section+section 40px を上書き） */
#contents .home_service{ margin-top:110px; }
@media screen and (max-width:600px){
	#contents .home_service{ margin-top:70px; }
}
/* 「私たちのサービス」見出し：中央＋イチゴ色の下線（既定のグレー枠ピルを解除）。
   #contents h3(id)に勝つよう #contents .home_service h3 で上書き */
#contents .home_service h3{
	border:none;
	border-radius:0;
	padding:0 0 14px;
	margin:0 auto 28px;
	font-size:1.6rem;
	font-weight:700;
	text-align:center;
	letter-spacing:.08em;
	color:var(--ichigo-text);
	position:relative;
}
#contents .home_service h3::after{
	content:"";
	position:absolute;
	left:50%;
	bottom:0;
	transform:translateX(-50%);
	width:46px;
	height:3px;
	border-radius:2px;
	background:var(--ichigo-red);	/*イチゴ赤の下線アクセント*/
}
@media screen and (max-width:600px){
	#contents .home_service h3{ font-size:1.35rem; margin-bottom:22px; }
}
/* 私たちのサービス：タイトル下のリード文／3枚下のメッセージ／詳細を見るボタン */
.home_service .hs_lead{
	max-width:680px;
	margin:0 auto 36px;
	text-align:center;
	font-size:15.5px;
	line-height:1.95;
	color:#6a5d61;
}
.home_service .hs_msg{
	margin:34px auto 0;
	text-align:center;
	font-size:15.5px;
	line-height:2;
	color:var(--ichigo-text);
}
.home_service .hs_more{
	text-align:center;
	margin-top:26px;
}
.home_service .hs_btn{
	display:inline-flex;
	align-items:center;
	gap:9px;
	padding:14px 40px;
	border-radius:999px;
	background:linear-gradient(135deg,#f7a8bd 0%,#ec6e90 100%);
	color:#fff;
	text-decoration:none;
	font-size:15px;
	font-weight:700;
	letter-spacing:.04em;
	box-shadow:0 4px 12px rgba(232,90,122,.30);
	transition:.2s;
}
.home_service .hs_btn:hover{
	filter:brightness(1.05);
	transform:translateY(-2px);
	box-shadow:0 6px 16px rgba(232,90,122,.38);
}
.home_service .hs_btn i{ font-size:13px; }
@media screen and (max-width:600px){
	.home_service .hs_lead,
	.home_service .hs_msg{ font-size:14px; padding:0 6px; }
	.home_service .hs_btn{ padding:13px 32px; font-size:14px; }
}

/*------------------------------------------------------------
  サービスページ（info.html）：カテゴリ別3グループ
  ※各グループ＝SERVICE.N＋見出し＋説明＋3カード（イラスト＋タイトル＋説明）。
    背景パネルは廃止し余白で区切る（依頼主指示：みる様との差別化）。
    幅はコンテンツ幅いっぱいまで。リンクなし・このページで完結。
------------------------------------------------------------*/
.svc_group{
	margin:0 auto 120px;
	box-sizing:border-box;
}
.svc_g1{ margin-top:120px; }	/*最初のグループの上もグループ間と同じ余白に（バランス）*/
.svc_label{
	text-align:center;
	font-size:12px;
	font-weight:700;
	letter-spacing:.22em;
	color:var(--ichigo-pink);
	margin-bottom:6px;
}
#contents .svc_group .svc_gttl{
	border:none;
	border-radius:0;
	padding:0 0 12px;
	margin:0 auto 16px;
	font-size:1.5rem;
	font-weight:700;
	text-align:center;
	letter-spacing:.06em;
	color:var(--ichigo-text);
	position:relative;
}
#contents .svc_group .svc_gttl::after{
	content:"";
	position:absolute;
	left:50%;
	bottom:0;
	transform:translateX(-50%);
	width:42px;
	height:3px;
	border-radius:2px;
	background:var(--ichigo-red);
}
.svc_gdesc{
	text-align:center;
	font-size:14.5px;
	line-height:1.9;
	color:#6a5d61;
	margin-bottom:30px;
}
.svc_cards{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:20px;
}
.svc_card{
	display:flex;
	flex-direction:column;
	align-items:center;
	text-align:center;
	gap:18px;
	padding:48px 26px 44px;
	background:#fff;
	border-radius:18px;
	box-shadow:0 2px 10px rgba(0,0,0,.05);
}
.svc_card .svc_img{
	width:auto;
	height:170px;
	max-width:88%;
	object-fit:contain;
}
.svc_card .svc_card_ttl{
	font-size:20px;
	font-weight:700;
	color:var(--ichigo-text);
}
.svc_card .svc_card_desc{
	font-size:14.5px;
	line-height:1.8;
	color:#7a6d70;
}
@media screen and (max-width:820px){
	.svc_group{ margin-bottom:84px; }
	.svc_g1{ margin-top:84px; }
	.svc_cards{ grid-template-columns:1fr; max-width:420px; margin:0 auto; }
}

/*------------------------------------------------------------
  フッター直上の装飾帯（緑の草＋黄花＋蝶＝background.jpg）を非表示に
  （依頼主指示。全17ページ共通。HTMLの #footer_image はそのまま残置）
------------------------------------------------------------*/
#footer_image{ display:none; }

/*------------------------------------------------------------
  会社概要ページ（about.html）の h3 見出しを、ホームと同じ
  「中央＋イチゴ赤の下線」スタイルに（旧グレー枠ピルから変更）
------------------------------------------------------------*/
body.about #contents h3{
	border:none;
	border-radius:0;
	padding:0 0 12px;
	margin:0 auto 28px;
	font-size:1.5rem;
	font-weight:700;
	text-align:center;
	letter-spacing:.06em;
	color:var(--ichigo-text);
	position:relative;
}
body.about #contents h3::after{
	content:"";
	position:absolute;
	left:50%;
	bottom:0;
	transform:translateX(-50%);
	width:42px;
	height:3px;
	border-radius:2px;
	background:var(--ichigo-red);
}

/*------------------------------------------------------------
  スクロールで「下からふわっと表示」（採用サイトの.up同系・依存ライブラリ無し）
  ※js/inview.js が描画前に <html>.inview-ready を付与し、対象を初期非表示に。
    画面に入ると .is-inview が付いて表示。prefers-reduced-motion時は常時表示。
------------------------------------------------------------*/
@media (prefers-reduced-motion: no-preference){
	html.inview-ready #contents h2,
	html.inview-ready #contents h3,
	html.inview-ready .h2_desc,
	html.inview-ready .hs_lead,
	html.inview-ready .hs_msg,
	html.inview-ready .hs_more,
	html.inview-ready .home_card,
	html.inview-ready .service3_card,
	html.inview-ready .svc_label,
	html.inview-ready .svc_gdesc,
	html.inview-ready .svc_card,
	html.inview-ready .voice_msg,
	html.inview-ready .about_greeting,
	html.inview-ready .steps_ul,
	html.inview-ready .rinen,
	html.inview-ready .gaiyo,
	html.inview-ready .doc_list > li,
	html.inview-ready .access-map,
	html.inview-ready .access-item{
		opacity:0;
		transform:translateY(26px);
		transition:opacity .7s ease, transform .7s ease;
		will-change:opacity, transform;
	}
	html.inview-ready .is-inview{
		opacity:1 !important;
		transform:none !important;
	}
	/* 横並びカードは少し時間差でふわっと立ち上がる */
	html.inview-ready .home_cards .home_card:nth-child(2),
	html.inview-ready .service3 .service3_card:nth-child(2),
	html.inview-ready .svc_cards .svc_card:nth-child(2){ transition-delay:.12s; }
	html.inview-ready .home_cards .home_card:nth-child(3),
	html.inview-ready .service3 .service3_card:nth-child(3),
	html.inview-ready .svc_cards .svc_card:nth-child(3){ transition-delay:.24s; }
	html.inview-ready .home_cards .home_card:nth-child(4){ transition-delay:.36s; }
}

/*------------------------------------------------------------
  ヘッダー画像（メインビジュアル／サブ画像）を「ふわっと」表示
  ※ヘルパーステーションみる(company)と同系のopacityフェード。
    ページ最上部にあるので、読み込み時にそのまま立ち上がる（スクロール不要）。
  ※コンテンツの「下からふわっと」(inview)とは別系統。
  ※prefers-reduced-motion 時はアニメ無しで即時表示。
------------------------------------------------------------*/
@media (prefers-reduced-motion: no-preference){
	#mainimg, #subimg{
		animation: headimgFadeIn 1s ease-out .1s both;
	}
	@keyframes headimgFadeIn{
		from{ opacity:0; }
		to{ opacity:1; }
	}
}


/*------------------------------------------------------------
  トップ／お問い合わせフォーム（フッター直上・index.html / form.html）
  ※クリームの角丸パネル。送信は form.php（confirm→finish）へPOST。
  ※#contents の p/h3 等の既定を上書きするため #contents .home_contact で限定。
------------------------------------------------------------*/
#contents .home_contact{ margin-top:110px; }
#contents .home_contact .hc_panel{
	max-width:900px; margin:0 auto; box-sizing:border-box;
	background:#fbf3e3; border:1px solid #f0e3c4; border-radius:32px;
	padding:54px 7% 56px;
}
#contents .home_contact .hc_head{ text-align:center; margin-bottom:40px; }
#contents .home_contact .hc_heart{ width:62px; height:auto; display:block; margin:0 auto 12px; }
#contents .home_contact .hc_en{
	font-size:12px; font-weight:700; letter-spacing:.28em;
	color:var(--ichigo-red); text-transform:uppercase; margin:0 0 8px; padding:0;
}
#contents .home_contact .hc_ttl{
	font-size:1.6rem; font-weight:700; color:var(--ichigo-text);
	margin:0 0 14px; padding:0; background:none; border:none;
	letter-spacing:.04em; text-align:center; line-height:1.4;
}
#contents .home_contact .hc_lead{
	font-size:15px; line-height:1.9; color:#6a5d61; margin:0; padding:0;
}
#contents .home_contact .hc_field{ margin-bottom:22px; }
#contents .home_contact .hc_lbl{
	display:block; font-size:14.5px; font-weight:700;
	color:var(--ichigo-text); margin-bottom:8px; letter-spacing:.03em;
}
#contents .home_contact .hc_lbl .req{
	display:inline-block; margin-left:8px; padding:2px 10px;
	font-size:11px; font-weight:700; color:#fff; vertical-align:middle;
	background:var(--ichigo-pink); border-radius:999px; letter-spacing:.06em;
}
#contents .home_contact input[type="text"],
#contents .home_contact input[type="tel"],
#contents .home_contact input[type="email"],
#contents .home_contact textarea{
	width:100%; box-sizing:border-box; display:block; margin:0;
	padding:13px 15px; font-size:15px; font-family:inherit;
	color:var(--ichigo-text); background:#fff;
	border:1px solid #e6d8bb; border-radius:12px;
	transition:border-color .2s, box-shadow .2s;
}
#contents .home_contact textarea{ min-height:150px; resize:vertical; line-height:1.8; }
#contents .home_contact input:focus,
#contents .home_contact textarea:focus{
	outline:none; border-color:var(--ichigo-pink);
	box-shadow:0 0 0 3px rgba(244,160,180,.25);
}
#contents .home_contact input::placeholder,
#contents .home_contact textarea::placeholder{ color:#c6babc; }
#contents .home_contact .hc_err{ color:var(--ichigo-red); font-size:13px; margin-top:6px; }
#contents .home_contact .hc_submit{ text-align:center; margin-top:34px; }
#contents .home_contact .hc_btn{
	display:inline-flex; align-items:center; gap:9px;
	padding:15px 54px; border:none; cursor:pointer; border-radius:999px;
	font-family:inherit; font-size:15.5px; font-weight:700; letter-spacing:.05em;
	color:#fff; background:linear-gradient(135deg,#f7a8bd 0%,#ec6e90 100%);
	box-shadow:0 4px 12px rgba(232,90,122,.30); transition:.2s;
}
#contents .home_contact .hc_btn:hover{ filter:brightness(1.05); transform:translateY(-2px); box-shadow:0 6px 16px rgba(232,90,122,.38); }
#contents .home_contact .hc_btn i{ font-size:13px; }
@media screen and (max-width:600px){
	#contents .home_contact{ margin-top:70px; }
	#contents .home_contact .hc_panel{ padding:38px 20px 40px; border-radius:24px; }
	#contents .home_contact .hc_ttl{ font-size:1.32rem; }
	#contents .home_contact .hc_btn{ padding:14px 40px; width:100%; justify-content:center; }
}


/*------------------------------------------------------------
  アンカー移動（ヘッダー/フッターの「お問い合わせ」→ #contact 等）をなめらかに
  ※prefers-reduced-motion 時は無効（即時ジャンプ）。
------------------------------------------------------------*/
@media (prefers-reduced-motion: no-preference){
	html{ scroll-behavior:smooth; }
}


/*------------------------------------------------------------
  視覚的に隠す（画面非表示／スクリーンリーダー・SEOには残す）
  ※ヘッダー画像にタイトルを焼き込んだページで、画像下の重複h2に付与。
------------------------------------------------------------*/
.visually-hidden{
	position:absolute !important;
	width:1px !important; height:1px !important;
	margin:-1px !important; padding:0 !important; border:0 !important;
	overflow:hidden !important; clip:rect(0 0 0 0) !important;
	clip-path:inset(50%) !important; white-space:nowrap !important;
}


/*------------------------------------------------------------
  SP：ヘッダー画像を高さ固定＋cover で、焼き込んだタイトル文字を大きく見せる
  ※横幅に合わせて全体縮小(height:auto)だと文字が小さくなるため、
    高さを保って左右をトリミング（object-fit:cover）。
------------------------------------------------------------*/
@media screen and (max-width:600px){
	#subimg img{ height:200px; object-fit:cover; object-position:center; }
}


/*------------------------------------------------------------
  SP専用ヘッダー画像（<picture> でPC/SP自動切替）
  ※SP画像のあるページ(#subimg.has-sp)はSPでも cover せず全体表示。
------------------------------------------------------------*/
#subimg picture{ display:block; }
@media screen and (max-width:600px){
	#subimg.has-sp img{ height:auto; object-fit:initial; }
}

/*------------------------------------------------------------
  SP：ヘッダーのお問い合わせ/採用情報ボタンを非表示（依頼主指示）
  ※フッターに同ボタンがあり、電話番号は上部に残るため。フッターのボタンは維持。
------------------------------------------------------------*/
@media screen and (max-width:600px){
	.site-header .header-buttons{ display:none; }
}
