@charset "utf-8";
/* mio-etc.css｜etc 担当（diversity・welfare・recruit・faq・credit）の改変
   文字の指定（書体・大きさ・太さ・字間・行間）はベースのまま。新しい部品の大きさはベースの段（45/40/30/25/20/18/17/15/14/12）から選ぶ */

/* ---------- 共通：区切りの波線（セクションの境目だけ・画面幅いっぱい・1種類） ---------- */
.etc-sec { position: relative; }
.etc-sec ~ .etc-sec::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 14px; background: url('/demos/mio-recruit/assets/svg/etc-wake.svg') repeat-x 0 0 / 240px 14px; opacity: 0.55; pointer-events: none; }
.etc-sample { margin: 14px 0 0 0; font-size: 12px; color: #676c6e; }
.etc-no { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 14px 0; font-size: 12px; color: var(--main); }
.etc-no::before { content: ""; width: 22px; height: 14px; background: var(--main); clip-path: polygon(0 0, 100% 0, 72% 50%, 100% 100%, 0 100%); }
.etc-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0 0; }
.etc-chips li { padding: 6px 14px 6px 18px; background: #fff; clip-path: var(--cut-sm); font-size: 14px; }
.cmn-block .etc-chips li { background: var(--ground); }
/* 目次（ベースの帯の色を澪の地に。並びはベースのまま） */
.etc-toc { background-color: #fff; }
.etc-toc ul li a i { color: var(--main); }

/* ============================================================
	diversity
*/
.c-diversity .etc-sec { padding: 100px 0; }
.c-diversity .etc-sec:last-of-type { padding-bottom: 110px; }
.c-diversity .cmn-block { border-radius: 0; clip-path: var(--cut); }
/* 健康 */
.c-diversity .health { padding: 56px 60px; }
.c-diversity .health .row { align-items: center; margin: 0; padding: 0 0 36px 0; }
.c-diversity .health .detail { padding: 0 40px 0 0; }
.c-diversity .health .logo { flex-basis: 260px; padding: 0; }
.c-diversity .health .logo img { width: 240px; transform: rotate(-3deg); }
.c-diversity .health h4 { margin: 0 0 14px 0; }
.c-diversity .health .etc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; border-top: 1px solid #d5d9d9; }
.c-diversity .health .etc-grid li { position: relative; padding: 13px 0 13px 26px; text-indent: 0; border-bottom: 1px solid #d5d9d9; }
.c-diversity .health .etc-grid li::before { content: ""; position: absolute; left: 0; top: 50%; width: 14px; height: 10px; margin-top: -5px; background: var(--main); clip-path: polygon(0 0, 100% 50%, 0 100%); }
.c-diversity .health .etc-grid li:nth-child(4n+2)::before, .c-diversity .health .etc-grid li:nth-child(4n+3)::before { background: var(--sub); }
/* 女性の現場：写真を画面の左端まで */
.c-diversity .etc-women { padding: 100px 0; }
.etc-bleed { display: grid; grid-template-columns: minmax(0, 52%) minmax(0, 1fr); align-items: center; }
.etc-bleed-photo { position: relative; }
.etc-bleed-photo img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 46px), calc(100% - 46px) 100%, 0 100%); }
.etc-bleed-body { padding: 0 80px 0 70px; max-width: 680px; }
.etc-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 30px 0 0 0; border-top: 2px solid var(--ink); }
.etc-stats > div { padding: 16px 14px 0 0; }
.etc-stats > div + div { padding-left: 16px; border-left: 1px solid #d5d9d9; }
.etc-stats dt { font-size: 12px; color: #4a5054; }
.etc-stats dd { margin: 6px 0 0 0; font-size: 20px; font-weight: 700; color: var(--main); }
.etc-stats dd b { font-size: 45px; line-height: 1; }
/* 仕事と家族 */
.c-diversity .etc-family .cmn-heading { margin: 0 0 30px 0; }
.etc-family-lead { max-width: 720px; margin: 0 auto 50px auto; text-align: center; }
.etc-family-row { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(0, 1fr); column-gap: 60px; align-items: start; }
.etc-chart { position: relative; padding: 40px 40px 120px 40px; background: #fff; clip-path: var(--cut); }
.etc-chart-title { margin: 0 0 20px 0; }
.etc-chart ul li { display: grid; grid-template-columns: 52px minmax(0, 1fr) 52px; align-items: center; gap: 12px; padding: 7px 0; }
.etc-chart .y, .etc-chart .v { font-size: 14px; }
.etc-chart .v { text-align: right; }
.etc-chart .bar { position: relative; height: 18px; background: #e6e9e8; }
.etc-chart .bar::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 0; background: var(--sub); clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 0 100%); transition: width 1.1s cubic-bezier(0.65, 0, 0.35, 1) 0.3s; }
.etc-chart .bar.is-max::before { background: var(--main); }
.etc-family.active .etc-chart .bar::before { width: var(--v); }
.etc-family-art { position: absolute; right: 26px; bottom: 18px; width: 170px; }
.etc-family-text h4 + .lead { margin: 0 0 30px 0; }
.etc-family-text .lead:last-child { margin: 0; }
.etc-family-text .note { margin: 14px 0 0 0; }
/* 働き方：大きい1枚＋小さい2枚をずらして並べる */
.etc-ws-head { margin: 0 0 40px 0; }
.etc-ws { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 50px; row-gap: 40px; }
.etc-ws-main { grid-row: 1 / span 2; }
.etc-ws-main .image img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; clip-path: var(--cut); }
.etc-ws-main .etc-txt { margin: 26px 0 0 0; padding: 0 40px 0 0; }
.etc-ws-sub { display: grid; grid-template-columns: 150px minmax(0, 1fr); column-gap: 24px; align-items: start; }
.etc-ws-sub .image img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; clip-path: var(--cut-sm); }
.etc-ws-low { margin: 0 0 0 50px; }
.etc-ws-sub h4 { margin: 0 0 6px 0; }
/* 社員の声：2人を上下にずらす */
.c-diversity .etc-voice .cmn-heading-doubleline { margin: 0 0 50px 0; }
.etc-voices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 50px; }
.etc-voice-item { display: grid; grid-template-columns: 170px minmax(0, 1fr); column-gap: 28px; align-items: start; padding: 34px 34px 34px 0; background: #fff; clip-path: var(--cut); }
.etc-voice-item:nth-child(2) { margin: 70px 0 0 0; }
.etc-voice-item .photo img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.etc-voice-item .quote { font-size: 17px; }
.etc-voice-item .name { margin: 16px 0 0 0; font-size: 14px; color: #4a5054; }
.etc-voice-item .name b { display: block; font-size: 17px; color: var(--ink); }
.c-diversity .cmn-more-nav { padding: 90px 0 0 0; }

/* ============================================================
	welfare
*/
.c-welfare .etc-sec { padding: 100px 0; }
.c-welfare .cmn-block { border-radius: 0; clip-path: var(--cut); }
/* 働く時間と休み：数字の帯 */
.c-welfare .etc-hours .cmn-block { padding: 56px 60px; }
.etc-nums { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 26px 0 34px 0; border-top: 2px solid var(--ink); }
.etc-nums li { position: relative; padding: 18px 16px 6px 22px; }
.etc-nums li + li { border-left: 1px solid #d5d9d9; }
.etc-nums li::before { content: ""; position: absolute; left: 0; top: 22px; width: 12px; height: 9px; background: var(--main); clip-path: polygon(0 0, 100% 50%, 0 100%); }
.etc-nums .k { display: block; font-size: 14px; color: #4a5054; }
.etc-nums .n { display: block; margin: 6px 0 0 0; font-size: 20px; font-weight: 700; color: var(--main); }
.etc-nums .n b { font-size: 45px; line-height: 1; }
.c-welfare .section .hours .wrap { display: block; }
.c-welfare .section .hours .wrap .lead { padding: 0; }
/* 暮らしを支える制度：2列・線で区切る */
.c-welfare .etc-support .cmn-heading { margin: 0 0 40px 0; }
.c-welfare .section .support { padding: 30px 60px 40px 60px; }
.c-welfare .section .support ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 50px; }
.c-welfare .section .support ul li { margin: 0; padding: 28px 0; border-bottom: 1px solid #d5d9d9; }
.c-welfare .section .support ul li:nth-last-child(-n+2) { border-bottom: 0; }
.c-welfare .section .support ul li:last-child { margin: 0; }
.c-welfare .section .support ul li .icon { flex-basis: 92px; flex-shrink: 0; align-self: flex-start; }
.c-welfare .section .support ul li .icon img { width: 76px; }
.c-welfare .section .support ul li .detail h4 { margin: 0 0 6px 0; }
/* 汐見の住まいと施設：大1＋小2＋横長1 */
.etc-town-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 60px; align-items: end; margin: 0 0 40px 0; }
.etc-town-head h3 { margin: 0; }
.etc-town { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 30px; row-gap: 36px; }
.etc-town li .image img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; clip-path: var(--cut-sm); }
.etc-town li h4 { margin: 16px 0 4px 0; font-size: 20px; }
.etc-town .t-big { grid-row: 1 / span 2; }
.etc-town .t-big .image img { aspect-ratio: 3 / 2; clip-path: var(--cut); }
.etc-town li:last-child { grid-column: 2 / span 2; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 26px; align-items: center; }
.etc-town li:last-child .image { grid-row: 1 / span 2; }
.etc-town li:last-child h4 { margin-top: 0; align-self: end; }
.etc-town li:last-child p { align-self: start; }
.c-welfare .cmn-more-nav { padding: 90px 0 0 0; }

/* ============================================================
	recruit
*/
.c-recruit .etc-sec { padding: 100px 0; }
.c-recruit .etc-sec:last-child { padding-bottom: 0; }
.c-recruit .cmn-beginning .lead { margin: 0; }
/* 求める人物像：2×2 の番号つき札 */
.etc-persona { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; max-width: 960px; margin: 0 auto; font-size: 18px; }
.etc-persona li { position: relative; display: flex; align-items: center; min-height: 120px; padding: 26px 30px 26px 104px; background: #fff; clip-path: var(--cut); }
.etc-persona li:nth-child(2), .etc-persona li:nth-child(3) { background: var(--paper); }
.etc-persona .no { position: absolute; left: 30px; top: 50%; transform: translateY(-50%); font-size: 40px; color: var(--main); }
.etc-persona li:nth-child(even) .no { color: var(--sub); }
/* 募集職種 */
.c-recruit .s-type .cmn-heading-frontline { max-width: 960px; margin: 0 auto 40px auto; }
.c-recruit .s-type .detail { max-width: 960px; margin: 0 auto; text-align: left; }
.etc-jobs { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 20px; }
.etc-job { padding: 36px 40px; background: #fff; clip-path: var(--cut); }
.c-recruit .s-type .detail .etc-job h3 { margin: 0 0 16px 0; padding: 0 0 12px 0; border-bottom: 2px solid var(--ink); }
.etc-job ul { display: flex; flex-wrap: wrap; gap: 10px; }
.etc-job ul li { padding: 8px 16px 8px 20px; background: var(--ground); clip-path: var(--cut-sm); font-size: 15px; }
.etc-type-note { margin: 26px 0 0 0; }
.c-recruit .etc-type-note a, .c-recruit .s-guideline a, .c-faq .section .list .a a { color: var(--main); }
/* 募集要項：白い面の上の表（面の縁と罫線を重ねない） */
.c-recruit .s-guideline .container { max-width: 1100px; }
.c-recruit .s-guideline .detail { padding: 30px 60px 50px 60px; background: #fff; clip-path: var(--cut); }
.c-recruit .s-guideline .detail .table { border-bottom-color: #d5d9d9; }
.c-recruit .s-guideline .detail .table > tbody > tr > th { position: relative; width: 150px; padding-left: 20px; border-top-color: #d5d9d9; }
.c-recruit .s-guideline .detail .table > tbody > tr > td { border-top-color: #d5d9d9; }
.c-recruit .s-guideline .detail .table > tbody > tr:first-child > th, .c-recruit .s-guideline .detail .table > tbody > tr:first-child > td { border-top: 0; }
.c-recruit .s-guideline .detail .table > tbody > tr > th::before { content: ""; position: absolute; left: 0; top: 26px; width: 10px; height: 8px; background: var(--main); clip-path: polygon(0 0, 100% 50%, 0 100%); }
.c-recruit .s-guideline .detail .table .performance { min-width: 420px; }
.c-recruit .s-guideline .detail .table .performance th, .c-recruit .s-guideline .detail .table .performance td { padding: 4px 14px; }
/* 選考の流れ：燕尾でつないだ5つの札 */
.etc-step-head { margin: 0 0 36px 0; }
.etc-step-head h3 { font-size: 25px; }
.etc-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.etc-steps li { padding: 26px 30px 28px 34px; background: #fff; clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 50%, calc(100% - 18px) 100%, 0 100%, 18px 50%); }
.etc-steps li:first-child { clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 50%, calc(100% - 18px) 100%, 0 100%); padding-left: 24px; }
.etc-steps li:last-child { background: var(--sub); color: #fff; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 18px 50%); }
.etc-steps .no { display: block; font-size: 12px; color: var(--main); }
.etc-steps li:last-child .no { color: #fff; }
.etc-steps b { display: block; margin: 6px 0 8px 0; font-size: 18px; }
.etc-steps p { font-size: 14px; }
/* インターンシップ：見出しの列＋写真2枚（2枚目を下げる） */
.etc-intern { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr) minmax(0, 1fr); column-gap: 36px; align-items: start; }
.etc-intern-head h2 { font-size: 40px; line-height: 1.3; }
.etc-intern-head p { margin: 20px 0 0 0; }
.etc-intern-item .image img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; clip-path: var(--cut-sm); }
.etc-intern-item h4 { margin: 18px 0 6px 0; font-size: 20px; }
.etc-intern-item:last-child { margin: 80px 0 0 0; }
/* エントリー：大きなパネル */
.c-recruit .s-contact .container { max-width: 1100px; }
.etc-entry { position: relative; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); column-gap: 60px; padding: 70px 70px 120px 70px; background: #fff; clip-path: var(--cut); }
.etc-entry-main .etc-entry-title { font-size: 40px; line-height: 1.3; color: var(--main); }
.etc-entry-main p.bold { margin: 16px 0 0 0; font-size: 18px; }
.etc-entry-note { margin: 10px 0 0 0; font-size: 14px; color: #4a5054; }
.etc-entry-btns { display: flex; flex-wrap: wrap; gap: 14px; margin: 30px 0 0 0; }
.etc-entry-btns .cmn-btn-primary, .etc-next-btns .cmn-btn-primary { min-width: 300px; background-color: var(--ground); }
.c-recruit .s-contact .detail.etc-entry-contact { margin: 0; padding: 0 0 0 40px; border-left: 1px solid #d5d9d9; text-align: left; align-self: center; }
.c-recruit .s-contact .detail.etc-entry-contact > div { margin: 1em 0 0 0; }
.c-recruit .s-contact .detail.etc-entry-contact > div:first-child { margin: 0; color: var(--main); }
.etc-entry-art { position: absolute; left: 70px; right: 70px; bottom: 26px; width: calc(100% - 140px); height: 60px; object-fit: fill; }

/* ============================================================
	faq
*/
.c-faq .etc-faq-sec { padding: 100px 0 0 0; }
.c-faq .etc-faq-sec .container { max-width: 1200px; }
.etc-faq { display: grid; grid-template-columns: 280px minmax(0, 1fr); column-gap: 70px; align-items: start; }
.etc-faq-side { position: sticky; top: 120px; }
.etc-faq-lead { font-size: 18px; }
.etc-faq-nav { margin: 26px 0 0 0; border-top: 2px solid var(--ink); }
.etc-faq-nav li { border-bottom: 1px solid #d5d9d9; }
.etc-faq-nav a { display: flex; align-items: center; gap: 12px; padding: 14px 0; }
.etc-faq-nav a span { font-size: 12px; color: var(--main); }
.os-pc .etc-faq-nav a:hover { color: var(--main); }
.etc-faq-art { display: block; width: 190px; margin: 36px 0 0 0; }
.c-faq .etc-faq-main .cmn-heading { margin: 0 0 24px 0; scroll-margin-top: 110px; }
.c-faq .etc-faq-main .cmn-heading h2 { display: flex; align-items: center; gap: 14px; text-align: left; }
.c-faq .etc-faq-main .cmn-heading h2::before { content: ""; flex: none; width: 26px; height: 18px; background: var(--main); clip-path: polygon(0 0, 100% 0, 72% 50%, 100% 100%, 0 100%); }
.c-faq .section .list { border-bottom: 0; }
.c-faq .section .list li { margin: 0 0 8px 0; padding: 4px 26px; border-top: 0; background: #fff; clip-path: var(--cut-sm); }
.c-faq .section .list .q > div { padding: 0 52px 0 3.2em; }
.c-faq .section .list .q span { color: var(--main); }
.c-faq .section .list .q i { right: 0; margin: -14px 0 0 0; width: 28px; height: 28px; background: var(--ground); }
.c-faq .section .list .q i::before { top: 13px; left: 8px; width: 12px; height: 2px; }
.c-faq .section .list .q i::after { top: 8px; left: 13px; width: 2px; height: 12px; }
.c-faq .section .list .opened .q i { background: var(--main); }
.c-faq .section .list .opened .q i::before { background-color: #fff; }
.c-faq .section .list .a > div { padding: 0 0 22px 3.2em; }
.c-faq .section .list .a .etc-sample { margin: 8px 0 0 0; }
.c-faq .etc-faq-next { padding: 100px 0 0 0; }
.etc-next { position: relative; padding: 56px 60px; background: #fff; clip-path: var(--cut); text-align: center; }
.etc-next h3 { font-size: 30px; line-height: 1.3; }
.etc-next p { margin: 16px 0 0 0; }
.etc-next-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin: 30px 0 0 0; }

/* ============================================================
	credit：船の建造銘板に見立てる
*/
.c-credit .section .cmn-heading h2::after { background: url('/demos/mio-recruit/assets/svg/ornament-line.svg') 0 0 / 100% 100% no-repeat; }
.etc-plate-wrap { display: flex; align-items: flex-start; gap: 60px; }
.c-credit .s-personality .detail.etc-plate { flex: 1; max-width: 860px; padding: 40px 56px 46px 56px; background: #fff; clip-path: var(--cut); }
.etc-plate-top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 20px; padding: 0 0 14px 0; border-bottom: 2px solid var(--ink); font-size: 12px; }
.etc-plate-top span { color: var(--main); }
.c-credit .s-personality .detail.etc-plate h3 { margin: 30px 0 22px 0; }
.c-credit .s-personality .detail.etc-plate ul { display: block; }
.c-credit .s-personality .detail.etc-plate ul li { display: grid; grid-template-columns: 210px minmax(0, 1fr); column-gap: 20px; margin: 0; padding: 10px 0; border-top: 1px solid #d5d9d9; }
.etc-plate ul li .k { color: var(--main); }
.etc-plate-note { margin: 22px 0 0 0; color: #4a5054; }
.c-credit .etc-plate-wrap .icon { flex: none; width: 120px; margin: 20px 0 0 0; }
.c-credit .etc-plate-wrap .icon img { transform: rotate(3deg); }

/* ============================================================
	TB
*/
@media screen and (max-width: 979px) {
	.c-diversity .health .row { display: block; }
	.c-diversity .health .logo { margin: 20px 0 0 0; }
	.etc-bleed { grid-template-columns: minmax(0, 1fr); }
	.etc-bleed-body { max-width: none; padding: 40px 50px 0 50px; }
	.etc-family-row, .etc-ws, .etc-voices, .etc-town-head, .etc-intern, .etc-entry, .etc-faq { grid-template-columns: minmax(0, 1fr); }
	.etc-family-text { margin: 40px 0 0 0; }
	.etc-ws-main { grid-row: auto; }
	.etc-ws-low { margin: 0; }
	.etc-voice-item:nth-child(2) { margin: 20px 0 0 0; }
	.etc-town { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.etc-town .t-big { grid-row: auto; grid-column: 1 / span 2; }
	.etc-town li:last-child { grid-column: 1 / span 2; }
	.etc-steps { grid-template-columns: minmax(0, 1fr); gap: 4px; }
	.etc-steps li, .etc-steps li:first-child, .etc-steps li:last-child { padding: 22px 26px 34px 26px; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 14px), 50% 100%, 0 calc(100% - 14px)); }
	.etc-steps li:last-child { padding-bottom: 22px; clip-path: none; }
	.etc-intern-item { margin: 30px 0 0 0; }
	.etc-intern-item:last-child { margin: 30px 0 0 0; }
	.c-recruit .s-contact .detail.etc-entry-contact { margin: 36px 0 0 0; padding: 30px 0 0 0; border-left: 0; border-top: 1px solid #d5d9d9; }
	.etc-faq-side { position: static; }
	.etc-faq-art { display: none; }
	.etc-faq-main { margin: 40px 0 0 0; }
}

/* ============================================================
	SP
*/
@media screen and (max-width: 767px) {
	.etc-sec ~ .etc-sec::before { height: 10px; background-size: 160px 10px; }
	.etc-chips li { font-size: 13px; }
	/* diversity */
	.c-diversity .etc-sec, .c-diversity .etc-women { padding: 60px 0; }
	.c-diversity .health { padding: 32px 20px; clip-path: var(--cut-sp); }
	.c-diversity .health .row { padding: 0 0 24px 0; }
	.c-diversity .health .detail { padding: 0; }
	.c-diversity .health .logo img { width: 170px; margin: 0 auto; }
	.c-diversity .health .etc-grid { grid-template-columns: minmax(0, 1fr); }
	.etc-bleed-photo img { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 6vw), calc(100% - 6vw) 100%, 0 100%); }
	.etc-bleed-body { padding: 30px 15px 0 15px; }
	.etc-stats { grid-template-columns: minmax(0, 1fr); }
	.etc-stats > div, .etc-stats > div + div { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 12px 0; border-left: 0; border-bottom: 1px solid #d5d9d9; }
	.etc-stats dd { margin: 0; white-space: nowrap; }
	.etc-stats dd b { font-size: 30px; }
	.etc-family-lead { margin: 0 0 30px 0; text-align: left; }
	.etc-chart { padding: 26px 18px 110px 18px; clip-path: var(--cut-sp); }
	.etc-chart ul li { grid-template-columns: 44px minmax(0, 1fr) 46px; gap: 8px; }
	.etc-family-art { right: 16px; bottom: 14px; width: 140px; }
	.etc-ws-sub { grid-template-columns: 110px minmax(0, 1fr); column-gap: 16px; }
	.etc-voice-item { grid-template-columns: 110px minmax(0, 1fr); column-gap: 16px; padding: 20px 18px 20px 0; clip-path: var(--cut-sp); }
	.etc-voice-item .quote { font-size: 15px; }
	.c-diversity .cmn-more-nav { padding: 50px 0 0 0; }
	/* welfare */
	.c-welfare .etc-sec { padding: 60px 0; }
	.c-welfare .etc-hours .cmn-block, .c-welfare .section .support { padding: 30px 20px; clip-path: var(--cut-sp); }
	.etc-nums { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.etc-nums li { padding: 14px 8px 12px 18px; }
	.etc-nums li:nth-child(3) { border-left: 0; }
	.etc-nums li:nth-child(n+3) { border-top: 1px solid #d5d9d9; }
	.etc-nums .n b { font-size: 30px; }
	.c-welfare .section .support ul { grid-template-columns: minmax(0, 1fr); }
	.c-welfare .section .support ul li { display: flex; padding: 22px 0; }
	.c-welfare .section .support ul li:nth-last-child(2) { border-bottom: 1px solid #d5d9d9; }
	.c-welfare .section .support ul li .icon { flex-basis: 64px; margin: 0; width: auto; }
	.c-welfare .section .support ul li .icon img { width: 56px; }
	.c-welfare .section .support ul li .detail { margin: 0; padding: 0 0 0 12px; }
	.etc-town { grid-template-columns: minmax(0, 1fr); row-gap: 28px; }
	.etc-town .t-big, .etc-town li:last-child { grid-column: auto; }
	.etc-town li:last-child { display: block; }
	.etc-town li:last-child h4 { margin-top: 16px; }
	.etc-town li h4 { font-size: 17px; }
	.c-welfare .cmn-more-nav { padding: 50px 0 0 0; }
	/* recruit */
	.c-recruit .etc-sec { padding: 60px 0; }
	.etc-persona { grid-template-columns: minmax(0, 1fr); gap: 10px; font-size: 15px; }
	.etc-persona li { min-height: 0; padding: 20px 18px 20px 72px; clip-path: var(--cut-sp); }
	.etc-persona .no { left: 18px; font-size: 30px; }
	.etc-jobs { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.etc-job { padding: 26px 20px; clip-path: var(--cut-sp); }
	.c-recruit .s-guideline .detail { padding: 10px 16px 26px 16px; clip-path: var(--cut-sp); }
	.c-recruit .s-guideline .detail .table > tbody > tr > th { width: 5.5em; padding-left: 14px; white-space: normal; }
	.c-recruit .s-guideline .detail .table > tbody > tr > th::before { top: 24px; width: 8px; height: 7px; }
	.c-recruit .s-guideline .detail .table .performance { min-width: 0; width: 100%; }
	.c-recruit .s-guideline .detail .table .performance th, .c-recruit .s-guideline .detail .table .performance td { padding: 0.3em 0.4em; }
	.etc-step-head h3 { font-size: 20px; }
	.etc-intern-head h2, .etc-entry-main .etc-entry-title { font-size: 25px; }
	.etc-entry { padding: 36px 20px 90px 20px; clip-path: var(--cut-sp); }
	.etc-entry-main p.bold { font-size: 15px; }
	.etc-entry-btns .cmn-btn-primary, .etc-next-btns .cmn-btn-primary { min-width: 0; width: 100%; }
	.etc-entry-art { left: 20px; right: 20px; width: calc(100% - 40px); height: 40px; bottom: 20px; }
	/* faq */
	.c-faq .etc-faq-sec { padding: 50px 0 0 0; }
	.etc-faq-lead { font-size: 15px; }
	.c-faq .section .list li { padding: 2px 14px; }
	.c-faq .section .list .q > div { padding: 0 40px 0 2.8em; }
	.c-faq .section .list .a > div { padding: 0 0 18px 2.8em; }
	.c-faq .etc-faq-next { padding: 50px 0 0 0; }
	.etc-next { padding: 34px 20px; clip-path: var(--cut-sp); }
	.etc-next h3 { font-size: 21px; }
	.etc-next p { text-align: left; }
	.etc-next p br { display: none; }
	/* credit */
	.etc-plate-wrap { display: block; }
	.c-credit .s-personality .detail.etc-plate { padding: 26px 20px 30px 20px; clip-path: var(--cut-sp); }
	.c-credit .s-personality .detail.etc-plate ul li { grid-template-columns: minmax(0, 1fr); row-gap: 2px; }
	.c-credit .etc-plate-wrap .icon { width: 80px; margin: 30px auto 0 auto; }
}

/* ベースの .c-diversity .section .image（最大幅440px・中央寄せ）を、澪の組みでは打ち消す */
.c-diversity .etc-ws .image { max-width: none; margin: 0; padding: 0; }

/* 日本語は文節で折り返す（語の途中で切らない。文字の大きさ・太さ・字間・行間は変えない） */
.c-diversity, .c-welfare, .c-recruit, .c-faq, .c-credit { word-break: auto-phrase; }
/* recruit.css の「.section a は下線・青緑」がボタンにまで効くのを、ボタンの本来の見た目に戻す */
.c-recruit .section a.cmn-btn-primary { text-decoration: none; color: #1d2326; }
.os-pc .c-recruit .section a.cmn-btn-primary:hover { color: #fff; opacity: 1; }
.etc-intern { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1fr); }
.etc-entry-btns .cmn-btn-primary { min-width: 260px; }
@media screen and (max-width: 979px) { .etc-intern { grid-template-columns: minmax(0, 1fr); } }
@media screen and (max-width: 767px) { .etc-entry-btns .cmn-btn-primary { min-width: 0; } }
@media screen and (max-width: 767px) { .c-recruit .s-guideline .detail .table > tbody > tr > th { width: 7.2em; } }
@media screen and (max-width: 767px) {
	.c-recruit .s-guideline .detail .table > tbody > tr > th { width: 8em; }
	.etc-voice-item { grid-template-columns: minmax(0, 1fr); padding: 20px 18px; }
	.etc-voice-item .photo { width: 120px; margin: 0 0 14px 0; }
}

.c-recruit .s-type .cmn-heading-frontline h2 { width: fit-content; }
