/* =========================================================
   heartcenter front.css （トップページ）
   デザイン計測値：PC=1201px カンプ / SP=391px カンプ 準拠
   ========================================================= */

/* ===== ヒーロー =====
   PC: ロゴ x160 w446 / イラスト右端 余白66 / イラスト上 ヘッダー+18 */
.hc-hero { background: var(--cream); padding:35px 0 0; overflow: hidden; }
.hc-hero__inner {
	max-width: 1200px; margin-inline: auto;
	display: flex; align-items: center; position: relative;
}
.hc-hero__logo { margin: 0;
    flex: 0 0 auto;
    width: 38%;
    margin-left: 9%; }
.hc-hero__logo-pc { width: 100%; height: auto; display: block; }
.hc-hero__logo-sp { display: none; }
.hc-hero__visual {flex: 0 0 auto;
    width: 43%;
    margin-left: auto;
    margin-right: 9.5%;}
.hc-hero__illust { width: 100%; height: auto; display: block; }
/* フレームアニメーション */
.hc-hero__frame-anim { position: relative; width: 100%; aspect-ratio: 993 / 1248; }
.hc-frame { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; opacity: 0; transition: opacity 2s ease; }
.hc-frame.is-active { opacity: 1; }
.hc-hero__badge-sp { display: none; }

/* ===== NEWS =====
   PC: イラスト下102 → ロゴ(164x56) → 45 → 白枠(700x152) → 18 → MORE(169x32) */
.hc-news { background: var(--cream); padding: 102px 0 0; }
.hc-news__inner { max-width:750px; margin-inline: auto; padding-inline: 24px; text-align: center; }
.hc-news__title { margin: 0 0 45px; line-height: 0; }
.hc-news__title img { width: 164px; height: auto; }
.hc-news__list {
	background: #fff; border:2px solid #231815; border-radius: 26px;
	padding: 6px 30px; text-align: left;
}
.hc-news__item { display: flex; gap: 0; align-items: baseline; padding: 12px 0; border-bottom: 1px solid #c9c5c6; }
.hc-news__list .hc-news__item:last-child { border-bottom: 0; }
.hc-news__date { font-family: var(--font-en); font-weight: 600; color: var(--ink); flex: 0 0 138px; font-size: .9rem; letter-spacing: .02em; }
.hc-news__text { color: var(--ink); font-size: .9rem; }
.hc-news__item:hover .hc-news__text { color: var(--green); }
.hc-news__more { margin-top: 18px; }
.hc-news__empty { padding: 14px 0; color: var(--ink-2); margin: 0; }
.hc-btn--more {
	background: var(--green);
    color: #fff;
    width: 180px;
    padding: 0;
    height: 40px;
    font-family: --font-sans;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: .14em;
    border: 1.8px solid #0c000a;
}
.hc-btn--more:hover { background: var(--green-d); color: #fff; }

/* ===== メニューグリッド =====
   PC: グリッド900中央 / カード434x200 / 列間34 行間29 / ラベル49% 写真51% */
.hc-menu { background: var(--cream); padding: 110px 0 45px; }
.hc-menu__inner { max-width:1080px; margin-inline: auto; padding-inline: 24px; }
.hc-menu__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 29px 34px; }
.hc-menucard {
	display: flex; align-items: stretch; border-radius: 16px; overflow: hidden;
	height: 200px;
	transition: transform .25s, box-shadow .25s;
}
.hc-menucard:hover { transform: translateY(-4px); box-shadow: 0 12px 26px rgba(60,50,20,.14); }
.hc-menucard__label { flex: 0 0 49%; display: flex; align-items: center; padding: 10px 16px 10px 43px; }
.hc-menucard__ja {     font-weight: 500;
    font-size: 23px;
    letter-spacing: .02em;
    color: #221815;
    margin: 0 auto;
}
.hc-menucard__thumb { flex: 1 1 auto; position: relative; overflow: hidden; }

/* 各ブロックの色（デザイン実測値） */
.hc-menucard--cyan     .hc-menucard__label { background: var(--c-cyan); }
.hc-menucard--pink     .hc-menucard__label { background: var(--c-pink); }
.hc-menucard--tan      .hc-menucard__label { background: var(--c-tan); }
.hc-menucard--yellow   .hc-menucard__label { background: var(--c-yellow); }
.hc-menucard--lavender .hc-menucard__label { background: var(--c-lavender); }
.hc-menucard--gray     .hc-menucard__label { background: var(--c-gray); }
.hc-menucard--green    .hc-menucard__label { background: var(--c-green); }
.hc-menucard--teal     .hc-menucard__label { background: var(--c-teal); }
.hc-menucard--orange   .hc-menucard__label { background: var(--c-orange); }

/* 追従バッジ（hc-fixbadge）はユーザー指示により現状維持。トップでも global.css の定義のまま表示する（上書きしない）。 */
@media (min-width: 901px) {
    .hc-hero {
        min-height: calc(100dvh - 84px);
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding-bottom: 35px;
    }
    .hc-hero__inner {
        width: 100%;
    }
}
/* ===== レスポンシブ（SPカンプ 391px 準拠） ===== */
@media (max-width: 900px) {
	/* ヒーロー：イラスト → キャッチ → ロゴ2行 → 採用サイト → バッジ の順 */
	.hc-hero { padding: 22px 0 0; }
	.hc-hero__inner { flex-direction: column; align-items: stretch; }
	.hc-hero__visual { order: 1; width: 82.4%; margin: 0 auto; }
	.hc-hero__logo { order: 2; width: 100%; margin: 12px 0 0; padding-inline: 26px; }
	.hc-hero__logo-pc { display: none; }
	.hc-hero__logo-sp { display: flex; flex-direction: column; align-items: center; }
	.hc-hero__catch-sp { width: 100%; height: auto; display: block; }
	.hc-hero__en-sp { width: 97%; height: auto; display: block; margin-top: 10px; }
	.hc-hero__recruit-sp { width: 45%; max-width: 200px; height: auto; display: block; margin-top: 8px; }
	/* SPでも hc-fixbadge は現状維持（非表示にしない／ヒーロー内バッジは使わない）＝ユーザー指示 */

	/* NEWS: バッジ下 → ロゴ(h30) → 22 → 白枠 → 12 → MORE */
	.hc-news { padding: 24px 0 0; margin: 60px auto 0;}
	.hc-news__inner { padding-inline: 25px; }
	.hc-news__title { margin-bottom: 22px; }
	.hc-news__title img { width: 88px; }
	.hc-news__list { border-radius: 20px; padding: 3px 16px; }
	.hc-news__item { flex-direction: column; gap: 0; padding: 7px 0; }
	.hc-news__date { font-size: .76rem; flex: none; line-height: 1.4; }
	.hc-news__text { font-size: .8rem; line-height: 1.4; }
	.hc-news__more { margin-top: 12px; }
	.hc-btn--more { width: 150px;
        height: 32px;
        font-size: .78rem;
        padding-top: 1px;}

	/* メニュー: MORE下74 → カード(340x158) 間隔17 / ラベル55% 写真45% */
	.hc-menu { padding: 74px 0 10px; }
	.hc-menu__inner { padding-inline: 25px; }
	.hc-menu__grid { grid-template-columns: 1fr; gap: 17px; }
	.hc-menucard { height: 158px; border-radius: 12px; }
	.hc-menucard__label { flex: 0 0 50%; padding:0;}
	.hc-menucard__ja { font-size: 17px; }
}