/* ==========================================================================
   pages/welfare.css — 포인트 제휴 > 복지 포인트 전용
   ========================================================================== */

.page-section__head { text-align: center; }
.welfare-intro .page-section__title mark { display: block; margin-top: 8px; background: none; color: #1a9e9e; }
.welfare-service .page-section__title mark { background: none; color: #1a9e9e; }

.page-section.welfare-service, .page-section.partner-section { background: #EDF8F8; }
.page-section.welfare-intro { padding-bottom: min(120px, 6.25vw); }
.welfare-intro .page-section__head { margin-bottom: 0; }
.page-section.welfare-service { padding-top: min(160px, 8.3334vw); }
.page-section.welfare-service { padding-bottom: min(120px, 6.25vw); }
.page-section.welfare-service + .page-section.partner-section { padding-top: 0; }
.welfare-flow {
  margin: var(--space-48) 0 0; padding: var(--space-48) var(--space-32);
  background: var(--color-white); border-radius: var(--radius-16); text-align: center;
}
.welfare-flow__row { display: flex; align-items: flex-start; justify-content: center; gap: 0; }
.welfare-node { display: grid; justify-items: center; gap: var(--space-8); }
.welfare-node img { display: block; width: min(120px, 6.25vw); height: min(120px, 6.25vw); border-radius: 50%; border: 1px solid #e5e8eb; background: var(--color-white); }
.welfare-node p { font-size: clamp(14px, 0.8334vw, 16px); font-weight: var(--font-weight-bold); line-height: 1; color: var(--color-neutral-900); text-align: center; }
.welfare-flow__link { display: grid; place-items: center; width: clamp(300px, 18.75vw, 360px); height: min(120px, 6.25vw); }
.welfare-flow__link > * { grid-area: 1 / 1; }
.welfare-flow__arrow { display: block; width: 100%; height: auto; }
.welfare-flow__label {
  position: relative; display: inline-flex; flex-direction: column; align-items: flex-start;
  padding: 6px 12px; border-radius: var(--radius-full); background: #1a9e9e;
  font-size: clamp(16px, 1.0417vw, 20px); font-weight: var(--font-weight-bold); line-height: 1.5; color: var(--color-white);
  white-space: nowrap;
}
.welfare-flow__chip {
  display: inline-block; margin-top: min(60px, 3.125vw); padding: 6px 12px; border-radius: var(--radius-full);
  background: #37404e; font-size: clamp(16px, 1.0417vw, 20px); font-weight: var(--font-weight-bold); line-height: 1.5; color: var(--color-white);
}
.welfare-benefits {
  display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-12);
  margin-top: var(--space-24); list-style: none;
}
.benefit-tile {
  width: 110px; padding: var(--space-16) var(--space-8); border-radius: var(--radius-16);
  background: var(--color-neutral-100); text-align: center;
}
.benefit-tile img { display: block; width: 48px; height: 48px; margin: 0 auto var(--space-8); }
.benefit-tile p { font-size: 0.875rem; font-weight: var(--font-weight-bold); color: var(--color-neutral-900); }

.welfare-partner-rows { display: grid; gap: var(--space-16); margin-top: var(--space-32); }
.welfare-partners { display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: var(--space-12); margin: 0; }
.welfare-partners .partner-tile { padding: var(--space-16) var(--space-4); }
.welfare-partners .partner-tile__logo { width: min(88px, 4.5833vw); height: min(88px, 4.5833vw); margin-inline: auto; }

.services-faq-title { font-size: 2rem; font-weight: var(--font-weight-bold); color: var(--color-neutral-900); line-height: 1.4; }

@media (max-width: 63.99rem) {
}

.page-section__head .page-section__desc { margin-top: min(40px, 2.0834vw); }

@media (max-width: 63.99rem) {
  .page-section.welfare-intro { padding-bottom: 80px; }
  .page-section.welfare-service { padding-top: min(12.5vw, 1.8962vw + 33.93px); padding-bottom: 60px; }
  .welfare-flow { --wf: min(0.27778vw, 1px); margin-top: 32px; padding: 40px calc(20 * var(--wf)); }
  .welfare-flow__row { display: grid; grid-template-columns: calc(88 * var(--wf)) minmax(0, 1fr) calc(88 * var(--wf)); grid-template-rows: auto calc(88 * var(--wf)) auto; row-gap: 0; }
  .welfare-flow__row > .welfare-node:first-child { grid-column: 1; grid-row: 2 / 4; }
  .welfare-flow__row > .welfare-node:last-child { grid-column: 3; grid-row: 2 / 4; }
  .welfare-node img { width: calc(88 * var(--wf)); height: calc(88 * var(--wf)); }
  .welfare-node p { font-size: min(4.4444vw, 0.8044vw + 13.11px); }
  .welfare-flow__link { display: contents; }
  .welfare-flow__arrow { display: none; }
  .welfare-flow__link::before {
    content: ""; grid-column: 2; grid-row: 2; align-self: center; width: 100%; height: calc(11 * var(--wf));
    background: url("/WebContent/assets/images/pages/business/welfare/flow-arrow-head-mo.svg") right center / calc(9 * var(--wf)) calc(11 * var(--wf)) no-repeat,
                linear-gradient(#4E5968, #4E5968) left center / calc(100% - 8 * var(--wf)) calc(1.8 * var(--wf)) no-repeat;
  }
  .welfare-flow__link::after {
    content: "L.POINT"; grid-column: 2; grid-row: 2; align-self: center; justify-self: center; padding: calc(4 * var(--wf)) calc(10 * var(--wf)); border-radius: var(--radius-full);
    background: var(--color-brand-red-solid, #FB1822); color: var(--color-white); font-size: calc(12 * var(--wf)); font-weight: var(--font-weight-bold); line-height: 1.4;
  }
  .welfare-flow__label {
    grid-column: 1 / -1; grid-row: 1; display: block; margin-bottom: 20px; padding: 0; background: none;
    color: var(--color-neutral-900); font-size: 16px; line-height: 1.4; text-align: center; white-space: normal;
  }
  .welfare-flow__chip {
    display: block; margin-top: 32px; padding: 32px 0 0; border-top: 1px solid var(--color-neutral-200, #e5e8eb); border-radius: 0;
    background: none; color: var(--color-neutral-900); font-size: 16px;
  }
  .welfare-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
  .benefit-tile { width: auto; padding: 16px 4px; }
  .benefit-tile img { width: 32px; height: 32px; }
  .benefit-tile p { font-size: min(3.8889vw, 0.7039vw + 11.46px); }
}