@charset "UTF-8";
/* =========================================================
   WELL-BEING（4HP well-being.pdf）
   各 top 値は「PDF上のY座標 − セクション開始Y」
   ========================================================= */

.page-wb .ttl__en { color: var(--c-text2); letter-spacing: .25em; }
.page-wb .ttl__en::before { background: #5dc8f5; }
.page-wb .ttl__ja { line-height: 45px; letter-spacing: 0; color: var(--c-text2); white-space: nowrap; z-index: 1; }
.hang { margin-left: -.5em; }

.wb-lead { font-size: 12px; line-height: 1.8; color: var(--c-sub2); white-space: nowrap; } /* 行間：現行サイト基準（本文 1.8・複数行の見出し 1.6） */
.wb-img { overflow: hidden; --cx: 30px; --cy: 40px; }
.wb-img img { position: absolute; }
.wb-box { left: 94px; width: 943px; background: #f1f1f1; }

/* ---------- INTRO + CONCEPT (y66–1264) ---------- */
.wb-a { height: 1193px; }
.wb-a__wm { left: -12px; top: -10px; font-size: 110px; line-height: 110px; writing-mode: vertical-rl; }
.wb-a__wm2 { left: 601px; top: 398px; font-size: 110px; }
.wb-a__en { left: 123px; top: 58px; }
.wb-a__ttl { left: 119px; top: 99px; }
.wb-a__lead { left: 119px; top: 169px; }

.wb-anchor { left: 117px; top: 269px; width: 496px; height: 101px; border-top: 1px solid #bce6ef; border-bottom: 1px solid #cdecf3; }
.wb-anchor a {
  position: absolute; display: flex; align-items: center; gap: 16px; height: 20px;
  font-size: 12px; line-height: 20px; letter-spacing: .06em; white-space: nowrap; transition: opacity .2s;
}
.wb-anchor a::before { content: ""; width: 17px; height: 17px; background: url("../img/common/arrow-down.svg") center / 100% 100% no-repeat; }
.wb-anchor a:hover { opacity: .6; }
.wb-anchor a:nth-child(1) { left: 6px; top: 17px; }
.wb-anchor a:nth-child(2) { left: 115px; top: 17px; }
.wb-anchor a:nth-child(3) { left: 260px; top: 17px; }
.wb-anchor a:nth-child(4) { left: 6px; top: 64px; }
.wb-anchor a:nth-child(5) { left: 173px; top: 64px; }
.wb-img--hero { left: 665px; top: 63px; width: 353px; height: 354px; --cx: 29px; --cy: 39px; }
.wb-img--hero img { left: -101px; top: -8px; width: 555px; height: 371px; }

.wb-mark { left: 333px; top: 554px; width: 179px; height: 20px; background: #5dc8f5; z-index: 0; }
.wb-a__en2 { left: 112px; top: 485px; }
.wb-a__ttl2 { left: 108px; top: 527px; }
.wb-a__lead2 { left: 108px; top: 596px; }
.wb-box--concept { top: 713px; height: 411px; --cx: 38px; --cy: 50px; }
.wb-img--concept { left: 292px; top: 743px; width: 561px; height: 349px; --cx: 30px; --cy: 42px; }
.wb-img--concept img { left: -7px; top: -5px; width: 568px; height: 364px; }

/* ---------- DECLARATION (y1264–2428) ---------- */
.wb-b { height: 1145px; background: #ecfcd1; }
.wb-b__wm { left: 338px; top: -14px; font-size: 110px; color: #fff; }
.wb-b__en { left: 105px; top: 78px; }
.wb-b__ttl { left: 101px; top: 119px; }
.wb-b__lead { left: 101px; top: 188px; line-height: 24px; } /* 1 行のため行間据え置き */

.wb-point { width: 234px; height: 228px; background: #fff; --cx: 29px; --cy: 38px; }
.wb-step { top: 292px; font-size: 10px; font-weight: 700; line-height: 14px; letter-spacing: .2em; color: #b3b3b3; white-space: nowrap; }
.wb-step b { display: block; margin: 5px 0 0 3px; font-size: 24px; line-height: 24px; letter-spacing: .1em; }
.wb-point__ttl { width: 234px; font-size: 14px; font-weight: 500; line-height: 1.6; letter-spacing: .14em; text-align: center; color: #01a0c1; white-space: nowrap; }
.wb-point__txt { font-size: 8px; line-height: 1.8; color: var(--c-sub2); white-space: nowrap; }
/* POINT 01〜03 の個別位置（デザインの個別値） */
.wb-b .wb-point:nth-of-type(1) { left: 116px; top: 374px; }
.wb-b .wb-point:nth-of-type(2) { left: 427px; top: 374px; }
.wb-b .wb-point:nth-of-type(3) { left: 738px; top: 371px; width: 233px; height: 229px; }
.wb-b .wb-step:nth-of-type(4) { left: 117px; }
.wb-b .wb-step:nth-of-type(5) { left: 427px; }
.wb-b .wb-step:nth-of-type(6) { left: 736px; }
.wb-point__img:nth-of-type(1) { left: 178px; top: 327px; width: 127px; height: 136px; }
.wb-point__img:nth-of-type(2) { left: 488px; top: 315px; width: 110px; height: 135px; }
.wb-point__img:nth-of-type(3) { left: 763px; top: 299px; width: 192px; height: 192px; }
.wb-b .wb-point__ttl:nth-of-type(1) { left: 116px; top: 482px; }
.wb-b .wb-point__ttl:nth-of-type(2) { left: 427px; top: 461px; }
.wb-b .wb-point__ttl:nth-of-type(3) { left: 738px; top: 467px; width: 233px; }
.wb-b .wb-point__txt:nth-of-type(7) { left: 150px; top: 521px; }
.wb-b .wb-point__txt:nth-of-type(8) { left: 466px; top: 538px; }
.wb-b .wb-point__txt:nth-of-type(9) { left: 776px; top: 539px; }

.wb-decl { left: 97px; top: 665px; width: 947px; height: 390px; background: #fff; --cx: 47px; --cy: 63px; }
.wb-decl__txt { left: 176px; top: 802px; font-size: 12px; line-height: 1.8; letter-spacing: -.015em; color: var(--c-text2); white-space: nowrap; }
.wb-decl__tag { height: 36px; display: flex; align-items: center; background: #5dc8f5; font-size: 12px; font-weight: 500; line-height: 1; letter-spacing: .06em; color: var(--c-text); white-space: nowrap; }
.wb-decl__tag:nth-of-type(1) { left: 179px; top: 901px; width: 118px; padding-left: 13px; --cx: 13px; --cy: 17px; }
.wb-decl__tag:nth-of-type(2) { left: 311px; top: 899px; width: 79px; padding-left: 14px; --cx: 9px; --cy: 12px; }
.wb-decl__ttl { left: 179px; top: 731px; }
.wb-img--decl { left: 646px; top: 718px; width: 352px; height: 285px; }
.wb-img--decl img { left: -65px; top: -8px; width: 446px; height: 298px; }

/* ---------- ORGANIZATION + HEALTH TARGETS (y2428–3618) ---------- */
.wb-c { height: 1185px; }
.wb-c__wm { left: 277px; top: -21px; font-size: 110px; color: #edfdd1; }
.wb-c__wm2 { left: 164px; top: 765px; font-size: 110px; }
.wb-c__en { left: 105px; top: 67px; }
.wb-c__ttl { left: 101px; top: 109px; }
.wb-c__lead { left: 101px; top: 178px; }
.wb-box--org { left: 89px; top: 271px; width: 942px; height: 471px; --cx: 42px; --cy: 56px; }
.wb-img--org { left: 286px; top: 301px; width: 561px; height: 412px; --cx: 37px; --cy: 50px; }
.wb-img--org img { left: 0; top: -1px; width: 561px; height: 415px; }
.wb-c__en2 { left: 103px; top: 853px; }
.wb-c__ttl2 { left: 99px; top: 894px; }

.wb-pdf { left: 89px; top: 983px; width: 955px; height: 147px; display: block; border: 1px solid #b8b8b8; transition: background .2s; }
.wb-pdf:hover { background: rgba(0,0,0,.015); }
.wb-pdf > * { position: absolute; white-space: nowrap; }
.wb-pdf__ttl { left: 112px; top: 41px; font-size: 18px; font-weight: 700; line-height: 30px; letter-spacing: .02em; color: var(--c-text2); }
.wb-pdf__txt { left: 110px; top: 77px; font-size: 12px; line-height: 20px; letter-spacing: .04em; color: var(--c-sub2); }
.wb-pdf__more { left: 813px; top: 59px; gap: 21px; font-size: 12px; font-weight: 700; color: var(--c-text2); }

/* ---------- ACTIONS (y3618–4353) ---------- */
.wb-d { height: 723px; background: #f1f1f1; }
.wb-d__wm { left: 633px; top: -15px; font-size: 110px; color: #fff; }
.wb-act { width: 297px; height: 183px; background: #fff; border-top: 3px solid var(--bar); --cx: 15px; --cy: 21px; }
.wb-act > * { position: absolute; white-space: nowrap; }
.wb-act h3 { left: 29px; top: 46px; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: .06em; color: var(--c-text2); }
.wb-act p { left: 29px; top: 87px; font-size: 10px; line-height: 1.8; color: var(--c-sub2); }
.wb-d__en { left: 103px; top: 74px; }
.wb-d__ttl { left: 99px; top: 116px; }
/* 各カードの位置・色・アイコン（デザインの個別値） */
.wb-act--collabo { left: 104px; top: 218px; --bar: #5dc8f5; }
.wb-act--collabo img { left: 223px; top: 23px; width: 39px; height: 41px; }
.wb-act--women { left: 417px; top: 218px; --bar: #58c185; }
.wb-act--women img { left: 221px; top: 19px; width: 49px; height: 49px; }
.wb-act--mental { left: 728px; top: 218px; --bar: #b3c1f9; }
.wb-act--mental img { left: 223px; top: 27px; width: 49px; height: 45px; }
.wb-act--workplace { left: 105px; top: 450px; --bar: #f1acaa; }
.wb-act--workplace img { left: 221px; top: 20px; width: 44px; height: 45px; }
.wb-act--exercise { left: 418px; top: 450px; --bar: #eb6d60; }
.wb-act--exercise img { left: 224px; top: 27px; width: 41px; height: 45px; }
.wb-act--exercise p { top: 96px; } /* 2 行のため上下中央に */
.wb-act--mileage { left: 729px; top: 450px; --bar: #d1ed95; }
.wb-act--mileage img { left: 231px; top: 23px; width: 40px; height: 39px; }

/* ---------- RESULTS (y4353–5335) ---------- */
.wb-e { height: 968px; }
.wb-e__wm { left: 636px; top: -15px; font-size: 110px; }
.wb-e__en { left: 106px; top: 67px; }
.wb-e__ttl { left: 109px; top: 109px; }
.wb-bar { top: 204px; height: 2.4px; }
.wb-num { top: 238px; display: flex; align-items: baseline; white-space: nowrap; color: var(--c-text2); }
.wb-num b { font-family: var(--font-num); font-size: 57px; font-weight: 800; line-height: 57px; letter-spacing: -.01em; }
.wb-num small { margin-left: 10px; font-size: 16px; font-weight: 700; line-height: 1; letter-spacing: .02em; }
.wb-num small.pct { margin-left: 6px; font-size: 18px; font-weight: 900; }
.wb-cap { top: 311px; font-size: 10px; line-height: 1.8; letter-spacing: .04em; color: var(--c-sub2); white-space: nowrap; }
.wb-bar:nth-of-type(1) { left: 99px; width: 312px; background: #009fc0; }
.wb-bar:nth-of-type(2) { left: 429px; width: 312px; background: #eb6d60; }
.wb-bar:nth-of-type(3) { left: 759px; width: 310px; background: #58c185; }
.wb-num:nth-of-type(3) { left: 132px; }
.wb-num:nth-of-type(4) { left: 466px; }
.wb-num:nth-of-type(5) { left: 797px; }
.wb-cap:nth-of-type(6) { left: 132px; }
.wb-cap:nth-of-type(7) { left: 465px; }
.wb-cap:nth-of-type(8) { left: 798px; }

.wb-cert__ttl { left: 99px; top: 468px; font-size: 18px; font-weight: 700; line-height: 1.6; color: var(--c-text2); white-space: nowrap; }
.wb-cert__txt { left: 99px; top: 549px; font-size: 12px; line-height: 1.8; color: var(--c-sub2); white-space: nowrap; }
.wb-cert__note { left: 100px; top: 643px; font-size: 9px; line-height: 16px; letter-spacing: .04em; color: #bababa; white-space: nowrap; }
.wb-cert__img { left: 508px; top: 444px; width: 522px; height: 185px; }

.wb-banner { left: 89px; top: 756px; width: 942px; height: 147px; background: #f1f1f1; --cx: 23px; --cy: 31px; }
.wb-banner > * { position: absolute; white-space: nowrap; }
.wb-banner__ttl { left: 99px; top: 43px; font-size: 18px; font-weight: 700; line-height: 30px; color: var(--c-text2); }
.wb-banner__txt { left: 97px; top: 79px; font-size: 12px; line-height: 20px; letter-spacing: .04em; color: var(--c-sub2); }
.wb-banner__more { left: 734px; top: 61px; gap: 27px; font-size: 12px; font-weight: 700; color: var(--c-text2); }

/* ---------- FOOTER ---------- */

/* =========================================================
   SP（〜767px）… デザイン HP well-being スマホ.pdf（幅375）
   ========================================================= */
@media (max-width: 767px) {
  .page-wb main .inner { --o: calc(50% - 187.5px); }
  .page-wb .ttl__ja { line-height: 43px; white-space: normal; }
  .page-wb .ttl__bg { line-height: 1; }
  .page-wb .ttl__en { z-index: 1; }
  .wb-lead { white-space: normal; }

  /* フロー配置にするセクション（A / C / D）：絶対配置を解除 */
  .wb-a .inner > .abs:not(.ttl__bg):not(.wb-mark),
  .wb-c .inner > .abs:not(.ttl__bg),
  .wb-d .inner > .abs:not(.ttl__bg) { position: relative; left: auto !important; top: auto !important; }

  /* ---------- INTRO + CONCEPT ---------- */
  .wb-a .inner, .wb-c .inner, .wb-d .inner { display: flow-root; }
  .wb-a .inner { padding-bottom: 49px; }
  .wb-a__wm { left: auto; right: -1.5px; top: 2px; font-size: 60px; line-height: 60px; transform: rotate(180deg); }
  .wb-a__wm2 { left: 43px; top: 618px; font-size: 60px; }
  .wb-a .ttl__en:not(#concept) { margin: 17px 0 0 16px; }
  .wb-a h1 { margin: 8px 0 0 12px; }
  .wb-a h1 + .wb-lead { margin: 15px 10px 0 18px; }
  .wb-anchor { width: auto; height: 105px; margin: 32px 20px 0 16px; border-top-color: #cdecf3; }
  .wb-anchor a { gap: 16px; }
  .wb-anchor a::before { width: 18px; height: 18px; }
  .wb-anchor a:nth-child(1) { left: 6px !important; top: 23px !important; }
  .wb-anchor a:nth-child(2) { left: 100px !important; top: 23px !important; }
  .wb-anchor a:nth-child(3) { left: 232px !important; top: 23px !important; }
  .wb-anchor a:nth-child(4) { left: 6px !important; top: 60px !important; }
  .wb-anchor a:nth-child(5) { left: 173px !important; top: 60px !important; }
  .wb-img--hero { width: auto !important; height: auto !important; aspect-ratio: 337 / 223; margin: 41px 19px 0; --cx: 28px !important; --cy: 38px !important; }
  .wb-img--hero img { left: -9.5% !important; top: -13.9% !important; width: 120.18% !important; height: 121.08% !important; }
  .wb-a #concept { margin: 80px 0 0 17px; }
  .wb-a h2.ttl__ja { margin: 5px 0 0 13px; line-height: 1.6; }
  .wb-mark { left: 12px; top: 737px; width: 156px; }
  .wb-a h2 + .wb-lead { width: 340px; margin: 19px 0 0 16px; }
  .wb-a .wb-box { width: auto; height: 230px !important; margin: 21px 14px 0; --cx: 20px !important; --cy: 28px !important; }
  .wb-img--concept { width: auto !important; height: 197px !important; margin: -214px 29px 17px; --cx: 17px !important; --cy: 24px !important; }
  .wb-img--concept img { left: -.95% !important; top: -1.52% !important; width: 100.95% !important; height: 104.57% !important; }

  /* ---------- DECLARATION（絶対配置のまま375基準で中央寄せ） ---------- */
  .page-wb .wb-b { height: 1877px; }
  .wb-b__wm { left: -7px; top: -6.5px; font-size: 57px; }
  .wb-b .ttl__en { left: 19px !important; top: 23px !important; }
  .wb-b h2 { left: 15px !important; top: 56px !important; }
  .wb-b .wb-lead { left: 15px !important; top: 115px !important; }
  .wb-b .wb-point:nth-of-type(1) { left: calc(var(--o) + 67px) !important; top: 270px !important; width: 234px !important; height: 225px !important; --cx: 29px; --cy: 39px; }
  .wb-b .wb-point:nth-of-type(2) { left: calc(var(--o) + 71px) !important; top: 613px !important; width: 233px !important; height: 229px !important; --cx: 29px; --cy: 39px; }
  .wb-b .wb-point:nth-of-type(3) { left: calc(var(--o) + 69px) !important; top: 960px !important; width: 234px !important; height: 229px !important; --cx: 29px; --cy: 38px; }
  .wb-b .wb-step:nth-of-type(4) { left: calc(var(--o) + 68px) !important; top: 189px; }
  .wb-b .wb-step:nth-of-type(5) { left: calc(var(--o) + 71px) !important; top: 531px; }
  .wb-b .wb-step:nth-of-type(6) { left: calc(var(--o) + 67px) !important; top: 880px; }
  .wb-b img:nth-of-type(1) { left: calc(var(--o) + 129px) !important; top: 224px !important; height: 135px !important; }
  .wb-b img:nth-of-type(2) { left: calc(var(--o) + 131px) !important; top: 555px !important; height: 134px !important; }
  .wb-b img:nth-of-type(3) { left: calc(var(--o) + 95px) !important; top: 887px !important; }
  .wb-b .wb-point__ttl:nth-of-type(1) { left: calc(var(--o) + 67px) !important; top: 378.5px !important; width: 234px; }
  .wb-b .wb-point__ttl:nth-of-type(2) { left: calc(var(--o) + 71px) !important; top: 700.5px !important; width: 233px; }
  .wb-b .wb-point__ttl:nth-of-type(3) { left: calc(var(--o) + 69px) !important; top: 1054.5px !important; width: 234px !important; }
  .wb-b .wb-point__txt:nth-of-type(7) { left: calc(var(--o) + 101px) !important; top: 419px !important; }
  .wb-b .wb-point__txt:nth-of-type(8) { left: calc(var(--o) + 110px) !important; top: 777.5px !important; }
  .wb-b .wb-point__txt:nth-of-type(9) { left: calc(var(--o) + 107px) !important; top: 1127.5px !important; }
  .wb-decl { left: calc(var(--o) + 19px); top: 1239px; width: 337px; height: 579px; --cx: 30px; --cy: 40px; }
  .wb-b .wb-img { left: calc(var(--o) + 36px) !important; top: 1553px !important; width: 301px !important; height: 245px !important; --cx: 25px; --cy: 34px; }
  .wb-b .wb-img img { left: -56px !important; top: -6px !important; width: 382px !important; height: 255px !important; }
  .wb-b h3.ttl__ja { left: calc(var(--o) + 19px) !important; top: 1273.5px !important; width: 337px; font-size: 24px; line-height: 40px; text-align: center; }
  .wb-decl__txt { left: calc(var(--o) + 19px); top: 1340.5px; width: 337px; letter-spacing: 0; text-align: center; white-space: normal; }
  .wb-decl__tag:nth-of-type(1) { left: calc(var(--o) + 84px) !important; top: 1481px !important; width: 117px !important; height: 35px; --cx: 13px !important; --cy: 16px !important; }
  .wb-decl__tag:nth-of-type(2) { left: calc(var(--o) + 215px) !important; top: 1479px !important; --cx: 9px !important; --cy: 12px !important; }

  /* ---------- ORGANIZATION + HEALTH TARGETS ---------- */
  .wb-c .inner { padding-bottom: 92px; }
  .wb-c__wm { left: -3px; top: -7.5px; font-size: 55px; }
  .wb-c__wm2 { left: -4px; top: 519px; font-size: 49px; color: #f7f8f8; }
  .wb-c .ttl__en:not(#x) { margin: 16px 0 0 22px; }
  .wb-c h2 { margin: 7px 0 0 18px; }
  .wb-c .wb-lead { width: 338px; margin: 9px 0 0 21px; }
  .wb-c .wb-box { width: auto !important; height: 258px !important; margin: 35px 15px 0 13px; --cx: 23px !important; --cy: 31px !important; }
  .wb-c .wb-img { width: auto !important; height: 236px !important; margin: -247px 27px 11px; --cx: 22px !important; --cy: 29px !important; }
  .wb-c .wb-img img { left: 0 !important; top: 0 !important; width: 100% !important; height: 100.4% !important; }
  .wb-c .ttl__en ~ .ttl__en:not(#x) { margin: 66px 0 0 21px; }
  .wb-pdf { width: auto; height: 172px; margin: 30px 15px 0 13px; }
  .wb-pdf__ttl { left: 40px; top: 36px; font-size: 16px; }
  .wb-pdf__txt { left: 38px; top: 73px; letter-spacing: 0; }
  .wb-pdf__more { left: 260px; top: 130px; gap: 21px; }

  /* ---------- ACTIONS ---------- */
  .page-wb .wb-d { background: #f7f8f8; }
  .wb-d .inner { padding-bottom: 61px; }
  .wb-d__wm { left: 89px; top: -6px; font-size: 49px; }
  .wb-d .ttl__en { margin: 15px 0 0 20px; }
  .wb-d h2 { margin: 8px 0 0 17px; }
  .wb-d .wb-act { margin: 33px 0 0 calc(50% - 156.5px); }
  .wb-d h2 + .wb-act { margin-top: 23px; }
  .wb-act > * { margin-top: 3px; }

  /* ---------- RESULTS（絶対配置） ---------- */
  .page-wb .wb-e { height: 1279px; }
  .wb-e__wm { left: 81px; top: -10px; font-size: 49px; color: #f7f8f8; }
  .wb-e .ttl__en { left: 11px !important; top: 11px !important; }
  .wb-e h2 { left: 8px !important; top: 38px !important; }
  .wb-bar:nth-of-type(1) { left: calc(var(--o) + 29px) !important; top: 117.5px; width: 312px !important; }
  .wb-bar:nth-of-type(2) { left: calc(var(--o) + 29px) !important; top: 339.5px; width: 312px !important; }
  .wb-bar:nth-of-type(3) { left: calc(var(--o) + 30px) !important; top: 555.5px; width: 310px !important; }
  .wb-num:nth-of-type(3) { left: calc(var(--o) + 64px) !important; top: 151px; }
  .wb-num:nth-of-type(4) { left: calc(var(--o) + 61px) !important; top: 375px; }
  .wb-num:nth-of-type(5) { left: calc(var(--o) + 70px) !important; top: 591px; }
  .wb-cap:nth-of-type(6) { left: calc(var(--o) + 64px) !important; top: 224px; }
  .wb-cap:nth-of-type(7) { left: calc(var(--o) + 60px) !important; top: 447px; }
  .wb-cap:nth-of-type(8) { left: calc(var(--o) + 72px) !important; top: 662px; }
  .wb-cert__ttl { left: 14px; top: 746.5px; font-size: 16px; }
  .wb-cert__txt { left: 14px; top: 822.5px; width: 340px; white-space: normal; }
  .wb-cert__txt .hang { margin-left: 0; }
  .wb-e img { left: calc(var(--o) + 6px) !important; top: 886px !important; width: 340px !important; height: 121px !important; }
  .wb-cert__note { left: 17px; top: 1023px; }
  .wb-banner { left: calc(var(--o) + 14px); top: 1069px; width: 347px; height: 171px; background: #f7f8f8; clip-path: none; }
  .wb-banner__ttl { left: 41px; top: 38px; }
  .wb-banner__txt { left: 39px; top: 74px; letter-spacing: 0; }
  .wb-banner__more { left: 201px; top: 130px; gap: 20px; }

  /* ---------- FOOTER ---------- */
}
