/* 2026-09-09: Produceの相談配置と利用案内を、本人指定の4サービスで共有。 */
.service-closing, .service-usage { box-sizing:border-box; font-family:var(--sans); text-align:left; }
.service-closing { background:var(--gray1); color:var(--tx); padding:72px 0 64px; }
.service-closing__inner, .service-usage__inner { width:min(980px,calc(100% - 64px)); margin:0 auto; padding:0; }
.service-closing__inner { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(270px,.75fr); gap:clamp(38px,5.5vw,68px); align-items:center; }
.service-closing__copy, .service-closing__action { min-width:0; }
.service-closing__phrase { display:inline-block; max-width:100%; }
.service-closing h2 { font-family:var(--bold); font-size:clamp(1.7rem,2.7vw,2.2rem); font-weight:700; line-height:1.55; color:var(--tx); max-width:16em; margin:0 0 22px; padding:0; background:none; letter-spacing:normal; }
.service-closing__copy p { margin:0; color:var(--tx2); font-size:.9rem; line-height:2.05; }
.service-closing__copy p + p { margin-top:16px; }
.service-closing__copy .service-closing__source { font-size:.75rem; }
.service-closing__action { display:flex; flex-direction:column; align-items:flex-start; }
.service-closing .service-closing__button { display:inline-flex; align-items:center; justify-content:center; gap:18px; max-width:100%; box-sizing:border-box; padding:11px 22px; margin:0; border:0; border-radius:999px; background:var(--blue); color:var(--white); font:700 13px/1.7 var(--sans); text-align:center; text-decoration:none; cursor:pointer; box-shadow:0 12px 26px -12px rgba(37,99,214,.55); transition:background .25s,transform .25s; }
.service-closing .service-closing__button:hover { background:var(--blue-hi); transform:translateY(-2px); }
.service-closing__button svg { width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.8; }
.service-closing__action .service-closing__hint { margin:12px 0 0; color:var(--tx2); font-size:.75rem; line-height:1.9; }
.service-closing a:not(.service-closing__button), .service-usage a { color:inherit; text-decoration:underline; text-underline-offset:.2em; }
.service-closing :is(a,button):focus-visible, .service-usage a:focus-visible { outline:3px solid var(--blue); outline-offset:4px; }
.service-usage { background:var(--white); color:var(--tx2); padding:32px 0 40px; }
.service-usage h3 { font-family:var(--bold); font-size:.72rem; font-weight:700; letter-spacing:.1em; color:var(--tx); text-align:center; margin:0 0 18px; }
.service-usage ul { list-style:none; padding:0; margin:0; position:relative; }
.service-usage ul::after { content:""; position:absolute; left:274px; top:0; bottom:0; width:1px; background:var(--line); }
.service-usage li { display:grid; grid-template-columns:274px minmax(0,1fr); column-gap:30px; font-size:.75rem; line-height:1.9; padding:13px 0; margin:0; }
.service-usage li + li { margin-top:0; }
.service-usage li b { font-family:var(--bold); font-size:.72rem; font-weight:700; letter-spacing:.1em; text-align:right; padding-right:30px; }
@media(max-width:760px) {
  .service-closing { padding:48px 0; }
  .service-closing__inner, .service-usage__inner { width:calc(100% - 40px); }
  .service-closing__inner { grid-template-columns:minmax(0,1fr); gap:28px; }
  .service-closing h2 { font-size:24px; max-width:none; }
  .service-closing__action { align-items:flex-start; }
  .service-closing .service-closing__button { min-height:44px; }
  .service-usage { padding:32px 0; }
  .service-usage ul::after { display:none; }
  .service-usage li { grid-template-columns:minmax(0,1fr); gap:4px; }
  .service-usage li b { text-align:left; padding-right:0; }
}
@media(prefers-reduced-motion:reduce) {
  .service-closing .service-closing__button { transition:none; }
  .service-closing .service-closing__button:hover { transform:none; }
}
