/* =========================================================
   就業支援（/support/）専用
   デザイン: アセット 12illastaaaa.png（PC 1200px基準・2x）準拠
   ========================================================= */
.hc-welfare { --sgreen: #009655; max-width:1000px; padding-bottom: 40px; }
.hc-welfare-ttl { font-family: var(--font-sans); font-weight: 700; font-size: 34px; line-height: 1.4; letter-spacing: .14em; text-indent: .1em; color: var(--green); margin: 0 0 6px; text-align: center; }
/* phero__head の上下余白を education に揃える */
.hc-phero--support .hc-phero__head { padding-top: 50px; margin-bottom: 20px; }
.hc-welfare-badge { display: inline-block; font-family: var(--font-round); font-weight: 700; font-size: .72rem; color: #fff; background: var(--pink); padding: 4px 14px; border-radius: 999px; vertical-align: middle; margin-left: 8px; }

/* このページの見出し・アクセント緑はデザイン実測 #009655 */
.hc-welfare .hc-ekg,
.hc-welfare .hc-subhead {color: var(--green);
    font-size: 23px;
    line-height: 1.55;
    font-weight: 700;
margin:0 0 15px;}

/* 白バインダーカードの見出し（デザイン: 緑・約36px・中央） */
.hc-welfare .hc-note__title {
	color: var(--sgreen);
	font-size:36px;
	letter-spacing: .05em;
	margin: 2px 0 24px;
}
.hc-house__body .hc-note__title {
text-align:left;
margin:17px 0 0;
}
/* ---- 白カード背景を教育ページ（.hc-edu-card）と同じ感じに ---- */
.hc-welfare .hc-note {
	background: #fff; border: 1px solid #231815; border-radius: 28px; box-shadow: none;
	padding:82px 100px 40px;
	overflow: hidden; /* 台紙ダッシュ罫をカード端まで伸ばして切る */
}
/* パンチ穴（教育カードの◯6個と同見た目をグラデーションで再現） */
.hc-welfare .hc-note::before {
	top: 26px; left: 40px; right: 40px; height: 30px;
	background-image: radial-gradient(circle, #faf7eb 13px, #231815 13.5px, transparent 15px);
	background-size: calc(100% / 6) 100%;
	background-position: left top;
}

/* ---- EKG見出しを教育ページ（.hc-edu-ekg）と同デザインに ---- */
.hc-welfare .hc-ekg {
	position: relative;
    display: block;
    margin: 64px 0 10px;
    padding: 0 0 46px 20px;
    font-weight: 900;
    font-size: clamp(1.55rem, 3.2vw, 2.6rem);
    line-height: 1.3;
    color: var(--green);
    letter-spacing: .02em;
}
.hc-welfare .hc-ekg::before { display: none; }
.hc-welfare .hc-ekg::after {
	content: ""; position: absolute; left: -58px; bottom: 5px;
	width: min(1005px, calc(100% + 58px)); height: 76px;
	background: url("../images/education/asset-46.png") no-repeat left bottom / 100% auto;
	pointer-events: none;
}

/* ---- 資格取得支援制度（水色ヘッダ＋クリーム行・罫線なし） ---- */
.hc-qual { position: relative;
    max-width: 730px;
    margin: 0 auto;}
.hc-qual .hc-scrollx, .hc-qual-note { position: relative; z-index: 1; }

.hc-qual .hc-scrollx table.hc-welfare-table { min-width: 560px; width: 100%; border-collapse: collapse; background: var(--cream); }
.hc-welfare-table th, .hc-welfare-table td { border: 0; padding: 16px 10px; text-align: center; font-size: .95rem; color: #231815; line-height: 1.5; }
.hc-welfare-table thead th {     background: #c7e1f5;
    padding: 18px 14px;
    font-size: 18px;
    font-weight: 600;
}
.hc-welfare-table tbody th, .hc-welfare-table tbody td { background: var(--cream); border-top: 1px solid #9e9992; }
.hc-welfare-table tbody th { font-size: 18px;
    font-weight: 600; white-space: nowrap; }
.hc-welfare-table tbody td { font-weight: 700; font-size: 18px; position: relative; }
/* 列間の黒仕切り（全高） */
.hc-welfare-table tbody td::before {
	content: ""; position: absolute; left: 0; top: 0; bottom: 0;
	width: 2px; background: #231815;
}
/* 表の下端は黒の実線 */
.hc-welfare-table tbody tr:last-child th,
.hc-welfare-table tbody tr:last-child td { border-bottom: 3px solid #231815; }
.hc-qual-note {
    color: #231815;
    font-size: 16px;
    line-height: 160%;
    letter-spacing: .02em;
    font-weight: 500;
    text-align: center;}

/* 「希望者は100%」バッジ（カード右上に大きく） */
.hc-qual-badge {position: absolute;
    top: 68px;
    right: 65px;
    width: 129px;
    height: auto;
    z-index: 2;
}

/* ---- 福利厚生（支援リスト）---- */
.hc-welfare .hc-media { grid-template-columns: 390px 1fr; gap: 40px; }
.hc-welfare-supports { display: flex; flex-direction: column; margin-top:33px; }
.hc-welfare-support {
	display: grid; grid-template-columns: 230px 1fr; gap: 40px; align-items: center;
	border-bottom: 2px dotted #55524c; padding: 24px 0;
}
.hc-welfare-support:first-child { border-top: 2px dotted #55524c; }
.hc-welfare-support__label {
	font-weight: 700;
    font-size: 23px;
    color: #231815;
    background: #c7e1f5;
    border-radius: 25px;
    text-align: center;
    padding: 16px 10px;
    border: 1.5px solid #231815;
}
.hc-welfare-support__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column;}
.hc-welfare-support__line { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.hc-welfare-support__item { position: relative; padding-left: 22px; font-size: 1rem; font-weight:600; color: #231815; }
.hc-welfare-support__item::before { content: "\25cf"; position: absolute; left: 0; color: var(--sgreen); }

/* ---- 住宅支援制度（イラスト左・テキスト右）---- */
.hc-house { position: relative; display: grid; grid-template-columns: 240px 1fr; gap: 44px; align-items: start; max-width: 750px; margin: 0 auto; padding: 10px 0; }
/* 台紙のダッシュ罫（上下） */
.hc-house__ill, .hc-house__body { position: relative; z-index: 1; }
.hc-house__ill img { max-width: 175px;
    height: auto;
    display: block;
    margin: 26px auto 0;}
.hc-house__catch { font-weight: 700; font-size: clamp(1.2rem, 2.2vw, 1.65rem); line-height: 1.65; color: #231815; margin: 0 0 12px; }
.hc-house__note { font-size: .88rem; color: #231815; margin: 0 0 20px; }
.hc-house__ex { font-weight: 700; font-size: 1.25rem; line-height: 1.75; color: var(--sgreen); margin: 0; }

/* ---- ワークライフバランス（白カード内4項目・ダッシュ罫はピンク）---- */
.hc-wlb { margin-top: 26px; }
.hc-wlb__row {
	display: grid; grid-template-columns: 240px 1fr; gap: 40px; align-items: start;
	padding: 28px 0; border-bottom:1px dashed #231815;
}
.hc-wlb__row:first-child { border-top:1px dashed #231815; margin-top: 6px; }
.hc-wlb__row:last-child { border-bottom: 0; padding-bottom: 8px; }
.hc-wlb__ttl {
	    color: var(--green);
    font-size: 23px;
    line-height: 1.55;
    font-weight: 700;
    margin: 14px 0 10px 20px;
}
.hc-wlb__ill {display: block;
    width: 90px;
    height: auto;
    margin: 5px auto 0; }

/* 社会啓蒙活動の本文（デザインの折り返し幅）と写真2枚（等幅・3:2） */
.hc-welfare .hc-media.hc-social-photos { grid-template-columns: 1fr 1fr; gap: 30px; }
.hc-social-photos .hc-media__photo { aspect-ratio: 3 / 2; }

/* ---- 実画像対応 ---- */
.hc-welfare-hero__img { width: 100%; height: auto; border-radius: 24px; display: block; }
/* 数値カード（デザイン: 2列×4行） */
.hc-welfare-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px 30px; margin: 20px 0 30px; }
.hc-welfare-statimg img { width: 100%; height: auto; display: block; }
.hc-welfare .hc-media__photo img { width: 100%; height: 100%; object-fit: cover; }

/* SPのみ表示の横スクロール注記 */
.hc-welfare .hc-scrollnote--sp { display: none; color: var(--ink-2); font-size: .8rem; margin: 0 0 8px; }

/* =========================================================
   レスポンシブ（SPカンプなし：PC基準の1カラム調整）
   ========================================================= */
@media (max-width: 900px) {
	.hc-welfare .hc-ekg { padding-left: 20px; }
	.hc-welfare .hc-ekg::after { left: -24px; width: calc(100% + 24px); }
}

@media (max-width: 768px) {
	.hc-welfare-ttl { font-size: 30px; letter-spacing: .1em; margin-bottom: 8px; }
	.hc-phero--support .hc-phero__head { padding: 20px 0px 0;
        width: 92%;
        margin: 0 auto;}
	.hc-welfare .hc-ekg { margin: 45px 0 5px; padding: 0 0 24px 12px; }
	.hc-welfare .hc-ekg::after { left: -18px; width: calc(100% + 18px); height: 60px; }

	.hc-welfare .hc-note { border-radius: 20px; padding: 56px 20px 30px; }
	.hc-welfare .hc-note::before {
		top: 16px; left: 20px; right: 20px; height: 22px;
		background-image: radial-gradient(circle, #f2efe4 9.5px, #231815 10px, transparent 11px);
	}

	.hc-welfare .hc-scrollnote--sp { display: block; text-align: left; }
	/* SP本文規約: 15px / 160% / justify */
	.hc-welfare p:not(.hc-welfare-ttl):not(.hc-subhead):not(.hc-note__title):not(.hc-scrollnote--sp):not(.hc-wlb__ttl):not(.hc-wlb__txt) {
		font-size: 15px; line-height: 160%; text-align: justify;
	}
p.hc-wlb__txt{margin:0;}
	.hc-welfare-stats { grid-template-columns: 1fr; gap: 14px; width: 85%; margin: 0 auto;}

	.hc-welfare .hc-media, .hc-welfare .hc-media.hc-social-photos { grid-template-columns: 1fr; gap: 16px; }

	.hc-qual { margin-left: 0; max-width: none; margin-top:10px;}
	.hc-qual-badge {        top: 105px;
        right: unset;
        width: 83px;
        left: 27px;}
	.hc-qual-rule { display: none; }

	.hc-welfare-support { grid-template-columns: 1fr; gap: 10px; padding: 18px 0; }
	.hc-welfare-support__label { width: 220px;
        padding: 12px 10px;
        font-size: 1.05rem;
        margin: 0 auto;}
	.hc-welfare-support__line { gap: 6px 12px; }

	.hc-house { grid-template-columns: 1fr; gap: 18px; }
	.hc-house::before, .hc-house::after { display: none; }
	.hc-house__ill img { margin: 0 auto;
        max-width: 160px;
        width: 50%;}
	.hc-house__catch { font-size: 1.15rem; text-align: left !important; }
	.hc-house__note { text-align: left !important; }
	.hc-house__ex { font-size: 1.05rem; text-align: left !important; }

	.hc-wlb__row { grid-template-columns: 1fr; gap: 12px; padding: 20px 0; }
	.hc-wlb__ttl br { display: none; }
	.hc-wlb__ttl { font-size: 18px;
        margin: 0 auto;
        text-align: center; }
	.hc-wlb__ill { margin: 6px auto 0; width: 90px; }
	.hc-welfare .hc-note__title{
		font-size:26px;
    margin:5px auto 0px;
	}
	.hc-welfare-table thead th{
	padding:15px 8px;
    font-size:16px;
	}
	.hc-welfare-table tbody th {
    font-size: 15px;
    font-weight: 500;
}
	.hc-welfare-table tbody td {
    font-size: 16px;
}
.hc-welfare .hc-scrollnote--sp{
text-align:right;
	}
.hc-house .hc-house__body .hc-note__title{
    text-align: center;
        margin:0px auto 10px;
	}
.hc-welfare .hc-subhead{
font-size:18px;
	}
}