/* CMS紹介ページの初心者向け説明・静的な更新例 */
body.recruit-cms-page .cms-intro-note { font-size:14px; line-height:1.85; }
body.recruit-cms-page #center .recruit-hero .recruit-hero-copy > p.cms-start-consult { padding:12px 15px; border-left:3px solid #1f6f68; background:#f2f7f6; font-size:14px; line-height:1.85; }
body.recruit-cms-page .cms-beginner-intro { margin:24px 0; padding:20px 24px; border:1px solid #c5d8d4; border-radius:10px; background:#f5f9f8; }
body.recruit-cms-page #center #detailID .cms-beginner-intro p { margin:0 0 12px; }
body.recruit-cms-page .cms-update-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; padding:0; margin:0; list-style:none; font-size:14px; line-height:1.8; }
body.recruit-cms-page .cms-update-steps li { position:relative; display:flex; flex-wrap:wrap; align-items:center; gap:8px; min-width:0; padding:16px; border:1px solid #c5d8d4; border-radius:8px; background:#fff; }
body.recruit-cms-page .cms-update-steps li + li::before { content:'→'; position:absolute; left:-23px; top:50%; transform:translateY(-50%); color:#1f6f68; font-size:18px; }
body.recruit-cms-page .cms-step-image { display:block; width:100%; height:78px; margin-bottom:4px; fill:#eef5f3; stroke:#426d66; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
body.recruit-cms-page .cms-step-number { display:grid; place-items:center; flex:0 0 25px; width:25px; height:25px; border-radius:50%; color:#fff; background:#1f6f68; font-size:12px; }
body.recruit-cms-page .cms-update-steps strong { flex:1; }
body.recruit-cms-page #center #detailID .cms-flow-caption { margin:12px 0 0; font-size:12px; color:#526a65; }
body.recruit-cms-page .cms-pair-photo { position:relative; display:block; overflow:hidden; width:100%; max-width:240px; aspect-ratio:1.6; border-radius:5px; }
body.recruit-cms-page #center #detailID .cms-pair-photo img { position:absolute; max-width:none; width:var(--crop-width); left:var(--crop-left); top:var(--crop-top); height:auto; }
body.recruit-cms-page .cms-selected-photo { margin-top:14px; }
body.recruit-cms-page .cms-selected-photo > strong { display:block; margin-bottom:6px; font-size:13px; }
body.recruit-cms-page .cms-editor-fragment .cms-pair-photo { max-width:180px; }
body.recruit-cms-page .cms-excluded-property { margin-top:14px; padding:14px; border:1px dashed #809099; background:#f3f5f5; }
body.recruit-cms-page .cms-excluded-property .cms-pair-photo { opacity:.45; filter:grayscale(1); }
body.recruit-cms-page .cms-excluded-property > strong { color:#42565f; font-size:14px; }
body.recruit-cms-page .cms-audience-nav { display:flex; flex-wrap:wrap; gap:12px; margin:22px 0 36px; }
body.recruit-cms-page .cms-audience-nav a { flex:1 1 230px; padding:16px 20px; border:1px solid #b9d0ca; border-radius:8px; color:#164c44; background:#f5f9f8; font-weight:700; text-decoration:none; }
body.recruit-cms-page .cms-one-update { margin-top:30px; padding:24px; border:1px solid #c4d6df; border-radius:10px; background:#f8fafc; }
body.recruit-cms-page #center #detailID .cms-one-update h3 { margin:0 0 10px; font-size:22px; line-height:1.6; }
body.recruit-cms-page .cms-update-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin:18px 0; }
body.recruit-cms-page #center #detailID .cms-update-pair figure { min-width:0; margin:0; padding:18px; border:1px solid #c8d4dd; border-radius:7px; background:#fff; }
body.recruit-cms-page .cms-update-pair figcaption { margin-bottom:14px; color:#234e70; font-size:13px; font-weight:700; line-height:1.7; }
body.recruit-cms-page .cms-editor-bar { padding:9px 12px; margin:0 0 14px; background:#1d2327; color:#fff; font-size:12px; line-height:1.7; }
body.recruit-cms-page .cms-editor-fragment dl { margin:0; }
body.recruit-cms-page .cms-editor-fragment dl div { margin:0 0 12px; }
body.recruit-cms-page .cms-editor-fragment dt { margin:0 0 4px; font-size:13px; font-weight:700; line-height:1.7; }
body.recruit-cms-page .cms-editor-fragment dd { margin:0; padding:9px 11px; border:1px solid #8c8f94; border-radius:3px; background:#fff; color:#1d2327; font-size:14px; line-height:1.7; overflow-wrap:anywhere; }
body.recruit-cms-page #center #detailID .cms-preview-label { margin:14px 0 0; padding:9px 11px; color:#185e56; background:#eaf3f1; font-size:13px; font-weight:700; }
body.recruit-cms-page #center #detailID .cms-public-fragment h4 { margin:12px 0 18px; font-size:20px; line-height:1.6; color:#123b68; }
body.recruit-cms-page #center #detailID .cms-public-fragment p { margin:8px 0; font-size:14px; line-height:1.85; }
body.recruit-cms-page .cms-public-fragment dl { margin:0; padding:14px 0; border-top:1px solid #cbd9e1; border-bottom:1px solid #cbd9e1; }
body.recruit-cms-page .cms-public-fragment dt { font-weight:700; }
body.recruit-cms-page .cms-public-fragment dd { margin:5px 0 0; }
body.recruit-cms-page .cms-public-link { color:#1f6f68; font-weight:700; text-decoration:underline; text-underline-offset:3px; }
body.recruit-cms-page .cms-public-badge { display:inline-block; padding:3px 9px; color:#1f6f68; background:#eaf3f1; }
body.recruit-cms-page #center #detailID .cms-example-caption { margin:10px 0 0; color:#43576a; font-size:13px; line-height:1.85; }
body.recruit-cms-page .cms-field-addition,body.recruit-cms-page .cms-operation-plan,body.recruit-cms-page .cms-related-consult { margin-top:26px; padding:20px 24px; border-left:3px solid #1f6f68; background:#f5f8f8; }
body.recruit-cms-page #center #detailID .cms-operation-plan h3,body.recruit-cms-page #center #detailID .cms-field-addition h3,body.recruit-cms-page #center #detailID .cms-related-consult h3 { margin:0 0 12px; font-size:21px; line-height:1.65; }
body.recruit-cms-page .cms-exhibition-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin:18px 0; }
body.recruit-cms-page .cms-exhibition-fields dt { font-weight:700; margin-bottom:5px; }
body.recruit-cms-page .cms-exhibition-fields dd { margin:0; font-size:14px; line-height:1.85; }
body.recruit-cms-page .cms-responsibilities { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:26px; }
body.recruit-cms-page .cms-responsibilities article { padding:20px; border:1px solid #c8d7dd; border-radius:8px; }
body.recruit-cms-page #center #detailID .cms-responsibilities h3 { margin:0 0 12px; font-size:19px; line-height:1.65; }
body.recruit-cms-page .cms-consult-example { margin:20px 0; padding:16px 20px; text-align:left; border:1px solid #bfd0d9; background:#fff; border-radius:8px; }
body.recruit-cms-page #center #detailID .cms-consult-example p { margin:8px 0; font-size:14px; line-height:1.85; }
body.recruit-cms-page [id$="-example"] { scroll-margin-top:100px; }
@media (max-width:767px) {
 body.recruit-cms-page .cms-beginner-intro,body.recruit-cms-page .cms-one-update { padding:18px 16px; }
 body.recruit-cms-page .cms-update-steps { grid-template-columns:minmax(0,1fr); }
 body.recruit-cms-page .cms-update-steps li { margin:0; flex-wrap:nowrap; }
 body.recruit-cms-page .cms-step-image { width:76px; height:58px; flex:0 0 76px; margin:0; }
 body.recruit-cms-page .cms-update-steps li + li::before { content:'↓'; left:50%; top:-24px; transform:translateX(-50%); }
 body.recruit-cms-page .cms-update-pair,body.recruit-cms-page .cms-exhibition-fields,body.recruit-cms-page .cms-responsibilities { grid-template-columns:minmax(0,1fr); }
 body.recruit-cms-page .cms-field-addition,body.recruit-cms-page .cms-operation-plan,body.recruit-cms-page .cms-related-consult { padding:18px 16px; }
 body.recruit-cms-page #center #detailID .cms-one-update h3 { font-size:20px; }
 body.recruit-cms-page .cms-audience-nav { gap:10px; }
 body.recruit-cms-page .cms-audience-nav a { flex-basis:100%; padding:14px 16px; }
 body.recruit-cms-page [id$="-example"] { scroll-margin-top:80px; }
}

body.recruit-cms-page .cms-example-photo { position:relative; overflow:hidden; width:100%; max-width:320px; aspect-ratio:1.44; border-radius:5px; }
body.recruit-cms-page #center #detailID .cms-example-photo img { position:absolute; max-width:none; width:355.5556%; height:auto; left:-21.2346%; top:-126.5778%; }
@media (max-width:359px) {
 body.recruit-cms-page #center .recruit-hero h1.site-title-local { font-size:26px; line-height:1.55; }
}