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

.hang { margin-left: -.5em; }

/* ---------- HERO (y78–758) ---------- */
.hero { height: 692px; }
/* 背景動画（全面）。--hh＝動画エリアの高さ */
.hero { --hh: 603px; }
.hero__bg { position: absolute; left: 0; top: 0; width: 100%; height: var(--hh); overflow: hidden; background: #2a2a2a url("../img/common/hero-poster-mp4.jpg") center / cover no-repeat; }
.hero__video { position: absolute; inset: 0; }
.hero__video video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.18) 55%, rgba(0,0,0,0) 100%); }
.hero .inner { z-index: 1; }
.hero__label, .hero__title, .hero__lead { color: #fff; text-shadow: 0 2px 10px rgba(0, 0, 0, .55), 0 0 2px rgba(0, 0, 0, .35); }
.hero__label::before { box-shadow: 0 1px 4px rgba(0, 0, 0, .4); }
.hero__label {
  left: 79px; top: 105px; display: flex; align-items: center;
  font-size: 16px; font-weight: 500; line-height: 20px; letter-spacing: .12em; white-space: nowrap;
}
.hero__label::before { content: ""; width: 21px; height: 2px; margin-right: 8px; background: var(--c-red-line); }
.hero__title { left: 72px; top: 151px; font-size: 60px; font-weight: 700; line-height: 1.6; letter-spacing: 0; white-space: nowrap; }
.hero__mark { position: relative; z-index: 0; }
.hero__mark::after { content: ""; position: absolute; z-index: -1; left: 0; right: 0; bottom: 5px; height: 18px; background: var(--c-blue); }
.hero__lead { left: 75px; top: 366px; font-size: 16px; line-height: 1.8; white-space: nowrap; }
.hero__btn {
  top: 435px; height: 62px; display: flex; align-items: center; justify-content: space-between;
  font-size: 16px; font-weight: 500; line-height: 1; letter-spacing: .06em;
  transition: opacity .2s;
}
.hero__btn:hover { opacity: .8; }
.hero__btn--red { left: 78px; width: 220px; padding: 0 20px 0 21px; background: var(--c-red); --cx: 12px; --cy: 19px; }
.hero__btn--gray { left: 320px; width: 190px; padding: 0 20px 0 22px; background: #ccc; --cx: 12px; --cy: 18px; }
.hero__btn .arrow { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11.6' fill='%23fff' stroke='%23333' stroke-width='.8'/%3E%3Cpath d='M6 12h11.2' stroke='%23333' stroke-width='.8'/%3E%3Cpath d='M14.4 9.3 18 12l-3.6 2.7' fill='none' stroke='%23333' stroke-width='.8'/%3E%3C/svg%3E"); }
.hero__stat { top: 500px; height: 28px; font-size: 12px; font-weight: 500; line-height: 28px; letter-spacing: .08em; color: var(--c-sub); white-space: nowrap; }
.hero__stat--b1, .hero__stat--b2 { background: #333; color: #fff; text-align: center; letter-spacing: .04em; }
.hero__stat--t1 { left: 78px; }
.hero__stat--b1 { left: 111px; width: 49px; }
.hero__stat--t2 { left: 164px; }
.hero__stat--b2 { left: 237px; width: 94px; }
.hero__stat--t3 { left: 339px; }
.hero__wm {
  left: -3px; top: 612px; font-size: 81px; font-weight: 900; line-height: 81px; letter-spacing: -.005em;
  color: #e6e6e6; white-space: nowrap; pointer-events: none;
}

/* ---------- MISSION (y758–1004) ---------- */
.mission { height: 238px; background: var(--c-dark); color: #fff; }
.mission__logo { left: 151px; top: 96px; width: 149px; }
.mission__lead { left: 348px; top: 72px; font-size: 16px; font-weight: 500; line-height: 1.8; letter-spacing: .02em; white-space: nowrap; }
.mission__note { left: 349px; top: 146px; font-size: 9px; line-height: 20px; color: var(--c-note); white-space: nowrap; }

/* ---------- NEWS (y1004–1437) ---------- */
.news { height: auto; min-height: 433px; overflow: visible; z-index: 2; }
.news .inner { display: flow-root; padding-top: 179px; } /* 一覧だけフロー配置：タイトルが長く行が増えたらセクションが伸びる */
.news__wm { left: 115px; top: 34px; }
.news__en { left: 102px; top: 97px; }
.news__ja { left: 98px; top: 160px; line-height: 45px; }
.news__lead { left: 98px; top: 238px; line-height: 1.8; color: var(--c-sub); white-space: nowrap; }
.news__more { left: 98px; top: 338px; gap: 20px; }
.news__tabs { left: 441px; top: 100px; display: flex; gap: 8px; width: 590px; } /* 6つのタブを一覧と同じ幅に収める（文字数なり＋余りを均等に配分） */
.news__tabs li { flex: 1 1 auto; margin-left: 0; }
.news__tabs button {
  width: 100%; height: 37px; padding: 0 8px; border: 1px solid #c9c9c9; background: #fff; white-space: nowrap;
  font-size: 12px; font-weight: 500; line-height: 1; letter-spacing: .08em; color: var(--c-sub);
}
.news__tabs button.is-active { background: #333; border-color: #333; color: #fff; }
.news__list { position: relative; width: 590px; margin: 0 0 -63px 441px; border-top: 1px solid #e3e3e3; } /* 下の63pxは次セクション上端の白いアーチに重ねる（デザイン通り） */
.news__list li { border-bottom: 1px solid #e3e3e3; }
/* 一覧の行はMTのループで出力するため、全行共通のルールのみ（件数・タイトルの長さに依存しない） */
.news__list a { display: flex; align-items: center; min-height: 78px; padding: 15px 0; transition: background .2s; }
.news__list a:hover { background: rgba(0,0,0,.02); }
.news__list time { width: 94px; padding-left: 7px; font-size: 12px; line-height: 1; letter-spacing: .08em; color: var(--c-sub); }
.news__list .tag { width: 88px; height: 24px; }
.news__ttl { flex: 1; padding: 0 12px 0 22px; font-size: 12px; font-weight: 500; line-height: 1.8; letter-spacing: .06em; } /* 自然折り返し（右に1文字分の余白） */
.news__list time + .news__ttl { padding-left: 110px; } /* カテゴリ未設定（タグなし）の行も、タイトルの位置をそろえる */
.news__list .arrow { margin-left: auto; }

/* ---------- OUR STORY (y1437–3002) ---------- */
.story {
  height: 1492px;
  /* ラブロジのロゴ2色（赤 #ec6d61・青 #00a0c1）を不透明度を下げてグラデーションに */
  --story-a: rgba(236, 109, 97, .32);
  --story-b: rgba(0, 160, 193, .32);
  background:
    radial-gradient(ellipse 75% 55% at 0% 0%, var(--story-a), transparent 70%),
    radial-gradient(ellipse 75% 55% at 100% 100%, var(--story-b), transparent 70%),
    linear-gradient(115deg, rgba(236, 109, 97, .10), rgba(0, 160, 193, .10)),
    #fff;
}
.story__arc { position: absolute; left: 0; top: -3px; width: 100%; height: 91px; }
.story__wm { left: 113px; top: 123px; color: #fff; }
.story__en { left: 92px; top: 185px; }
.story__ja { left: 87px; top: 262px; line-height: 1.6; }
.story__lead { left: 502px; top: 293px; line-height: 1.8; color: var(--c-sub); white-space: nowrap; }
.story__lead em { font-style: normal; color: #fa5a52; }
.story__cols { left: 88px; top: 416px; width: 950px; height: 272px; display: flex; border-top: 1px solid rgba(0,0,0,.18); }
.story__col { position: relative; height: 257px; margin-top: 15px; }
.story__col:nth-child(1) { width: 236px; }
.story__col:nth-child(2) { width: 247px; }
.story__col:nth-child(3) { width: 246px; }
.story__col:nth-child(4) { flex: 1; }
.story__col + .story__col { border-left: 1px solid rgba(0,0,0,.18); }
.story__tag {
  position: absolute; top: 22px; left: 10px; width: 58px; height: 36px; padding-left: 11px;
  font-size: 12px; font-weight: 700; line-height: 36px; letter-spacing: .12em; --cx: 6px; --cy: 10px;
}
.story__col:nth-child(2) .story__tag { left: 20px; }
.story__col:nth-child(3) .story__tag { left: 16px; width: 68px; padding-left: 7px; }
.story__col:nth-child(4) .story__tag { left: 20px; }
.story__tag--why { background: var(--c-cyan); }
.story__tag--what { background: var(--c-green); }
.story__tag--where { background: var(--c-lavender); }
.story__tag--how { background: var(--c-coral); }
.story__q, .story__col h3, .story__txt { position: absolute; left: 14px; white-space: nowrap; }
.story__col:nth-child(2) .story__q, .story__col:nth-child(2) h3, .story__col:nth-child(2) .story__txt { left: 26px; }
.story__col:nth-child(3) .story__q, .story__col:nth-child(3) h3, .story__col:nth-child(3) .story__txt { left: 22px; }
.story__col:nth-child(4) .story__q, .story__col:nth-child(4) h3, .story__col:nth-child(4) .story__txt { left: 25px; }
.story__q { top: 88px; font-size: 10px; line-height: 20px; color: var(--c-sub); }
.story__col h3 { top: 119px; font-size: 16px; font-weight: 700; line-height: 1.6; letter-spacing: .06em; }
.story__txt { top: 184px; font-size: 10px; line-height: 1.8; color: var(--c-sub); }
.story__card { left: 97px; top: 746px; width: 947px; height: 637px; background: #fff; --cx: 47px; --cy: 61px; }
.story__logo { left: 174px; top: 825px; width: 327px; }
.story__photo { left: 575px; top: 945px; width: 434px; height: 361px; overflow: hidden; --cx: 26px; --cy: 36px; }
.story__photo img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; }
.story__h3 { left: 164px; top: 934px; font-size: 30px; font-weight: 700; line-height: 1.6; white-space: nowrap; }
.story__h3-2 { margin-left: 15px; }
.story__body { left: 176px; top: 1044px; line-height: 1.8; white-space: nowrap; }
.story__values { left: 179px; top: 1186px; display: flex; gap: 8px; }
.story__values li {
  width: 58px; height: 36px; font-size: 12px; font-weight: 500; line-height: 36px; text-align: center;
  --cx: 6px; --cy: 9px;
}
.story__values li:nth-child(1) { background: var(--c-cyan); }     /* 信頼 */
.story__values li:nth-child(2) { background: var(--c-green); }    /* 誠実 */
.story__values li:nth-child(3) { background: var(--c-lavender); } /* 安心 */
.story__values li:nth-child(4) { background: var(--c-coral); }    /* 挑戦 */
.story__more { left: 182px; top: 1248px; gap: 23px; }

/* ---------- NUMBERS (y3002–3542) ---------- */
.numbers { height: 500px; }
.numbers__wm { left: 107px; top: -15px; font-size: 131px; color: #e9fecd; }
.numbers__en { left: 94px; top: 43px; }
.numbers__ja { left: 97px; top: 126px; line-height: 45px; }
.numbers__more { left: 845px; top: 145px; gap: 26px; }
.numbers__item { position: absolute; top: 236px; width: 213px; height: 170px; border-top: 2px solid var(--bar); }
.numbers__item--1 { left: 94px; --bar: var(--c-cyan); }
.numbers__item--2 { left: 325px; --bar: var(--c-coral); }
.numbers__item--3 { left: 552px; --bar: var(--c-green); }
.numbers__item--4 { left: 782px; --bar: var(--c-lavender); }
.numbers__val { position: absolute; left: 33px; top: 30px; display: flex; align-items: baseline; white-space: nowrap; }
.numbers__val b { font-family: var(--font-num); font-size: 57px; font-weight: 800; line-height: 1; letter-spacing: -.01em; }
.numbers__val small { margin-left: 8px; font-size: 17px; font-weight: 700; line-height: 1; }
.numbers__val small.pct { font-weight: 900; font-size: 18px; margin-left: 6px; }
.numbers__cap { position: absolute; left: 33px; top: 104px; font-size: 10px; line-height: 1.8; letter-spacing: .06em; color: var(--c-sub); white-space: nowrap; }
.numbers__cap .paren { margin-left: -5px; }
.numbers__note { left: 94px; top: 440px; font-size: 9px; line-height: 20px; color: var(--c-note); white-space: nowrap; }

/* ---------- BUSINESS (y3542–4413) ---------- */
.business { height: 865px; background: var(--c-gray); overflow: hidden; }
.business__wm { left: 108px; top: -18px; color: #fff; }
.business__en { left: 94px; top: 53px; }
.business__ja { left: 90px; top: 131px; line-height: 45px; }
.business__lead { left: 554px; top: 124px; line-height: 1.8; color: var(--c-sub); white-space: nowrap; }
.business__img { overflow: hidden; }
.business__img img { position: absolute; }
.business__img--1 { left: 90px; top: 231px; width: 483px; height: 305px; }
.business__img--1 img { left: -31px; top: -23px; width: 514px; height: 343px; }
.business__img--2 { left: 594px; top: 231px; width: 182px; height: 251px; }
.business__img--2 img { left: -134px; top: -23px; width: 453px; height: 302px; }
.business__img--3 { left: 594px; top: 498px; width: 182px; height: 250px; }
.business__img--3 img { left: -63px; top: -12px; width: 471px; height: 314px; }
.business__box { background: #fff; }
.business__box--1 { left: 91px; top: 536px; width: 484px; height: 214px; --cx: 30px; --cy: 42px; }
.business__box--2 { left: 776px; top: 230px; width: 269px; height: 252px; --cx: 24px; --cy: 32px; }
.business__box--3 { left: 776px; top: 497px; width: 269px; height: 252px; --cx: 23px; --cy: 31px; }
.business__no {
  position: absolute; left: 49px; top: 39px; width: 32px; height: 23px; padding-left: 7px;
  font-size: 12px; font-weight: 500; line-height: 23px; --cx: 7px; --cy: 8px;
}
.business__box--2 .business__no, .business__box--3 .business__no { left: 23px; top: 37px; width: 33px; }
.business__box--1 .business__no { background: var(--c-cyan); }
.business__box--2 .business__no { background: var(--c-green); }
.business__box--3 .business__no { background: var(--c-lavender); }
.business__box h3 { position: absolute; left: 49px; top: 85px; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: .06em; white-space: nowrap; }
.business__box p { position: absolute; left: 49px; top: 122px; font-size: 10px; line-height: 1.8; color: var(--c-sub); white-space: nowrap; }
.business__box--2 h3, .business__box--3 h3, .business__box--2 p, .business__box--3 p { left: 24px; }
.business__box--2 h3 { top: 83px; }
.business__box--2 p { top: 123px; }
.business__box--3 h3 { top: 78px; line-height: 1.6; } /* 2行の見出し */
.business__box--3 p { top: 142px; }
.business__more { left: 936px; top: 784px; gap: 20px; }

/* ---------- SUSTAINABILITY (y4413–5290) ---------- */
.sustain { height: 862px; }
.sustain__wave { position: absolute; left: 0; top: 0; width: 100%; height: 52px; z-index: 1; }
.sustain__wm { left: 97px; top: 89px; font-size: 117px; }
.sustain__en { left: 86px; top: 147px; }
.sustain__en::before { height: 1px; }
.sustain__ja { left: 82px; top: 229px; line-height: 45px; }
.sustain__lead { left: 534px; top: 233px; line-height: 1.8; color: var(--c-sub); white-space: nowrap; }
.sustain__card { width: 253px; }
.sustain__card--1 { left: 35px; top: 331px; --bar: var(--c-green); }
.sustain__card--2 { left: 299px; top: 329px; --bar: var(--c-cyan); }
.sustain__card--3 { left: 564px; top: 329px; --bar: var(--c-coral); }
.sustain__card--4 { left: 828px; top: 329px; --bar: var(--c-lavender); }
.sustain__box { position: relative; height: 368px; background: var(--c-gray); border-top: 3px solid var(--bar); --cx: 27px; --cy: 36px; }
.sustain__circle { position: absolute; left: 35px; top: 22px; width: 184px; height: 184px; border-radius: 50%; background: #fff; }
.sustain__circle img { position: absolute; }
.sustain__card--1 .sustain__circle img { left: -9px; top: 14px; width: 201px; }
.sustain__card--2 .sustain__circle img { left: 8px; top: 30px; width: 167px; }
.sustain__card--3 .sustain__circle img { left: 22px; top: 26px; width: 135px; }
.sustain__card--4 .sustain__circle img { left: 15px; top: 36px; width: 154px; }
.sustain__box h3 { position: absolute; left: 0; right: 0; top: 227px; text-align: center; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: .06em; }
.sustain__box p { position: absolute; left: 0; right: 0; top: 272px; width: fit-content; margin: 0 auto; font-size: 10px; line-height: 1.8; color: var(--c-sub); white-space: nowrap; }
.sustain__more { left: auto; right: 39px; top: 718px; gap: 10px; white-space: nowrap; } /* 4枚のカードに対して1つ。右端は4枚目のカードの右端に揃える */

/* ---------- PEOPLE (y5290–6240) ---------- */
.people { height: 923px; }
.people__bg { position: absolute; left: 0; top: 0; width: 100%; height: 766px; background: #e6f5f8; }
.people__wm { left: 106px; top: -20px; color: #fff; }
.people__en { left: 90px; top: 50px; }
.people__en::before { background: var(--c-blue-dark); }
.people__ja { left: 86px; top: 122px; line-height: 45px; }
.people__lead { left: 519px; top: 129px; line-height: 1.8; color: var(--c-sub); white-space: nowrap; }
.people__card { top: 316px; width: 317px; height: 267px; display: block; }
.people__card--1 { left: 66px; }
.people__card--2 { left: 411px; }
.people__card--3 { left: 755px; }
.people__card > * { position: absolute; }
.people__pic { left: 0; top: -115px; width: 317px; height: 293px; } /* 下端＝旧写真エリア下端（178px） */
.people__shadow { opacity: .28; filter: blur(8px); }
.people__photo { transition: transform .3s; }
.people__card:hover .people__photo { transform: translateY(-4px); }
.people__tag {
  left: 0; top: 106px; width: 58px; height: 36px; padding-left: 16px; z-index: 2;
  background: var(--c-blue); font-size: 12px; font-weight: 500; line-height: 36px; --cx: 6px; --cy: 10px;
}
.people__box { left: 0; top: 127px; width: 298px; height: 139px; background: #fff; --cx: 19px; --cy: 26px; z-index: 1; }
.people__box > * { position: absolute; }
.people__quote { left: 18px; top: 26px; font-size: 20px; font-weight: 700; line-height: 30px; letter-spacing: .12em; white-space: nowrap; } /* 氏名 */
.people__quote .i { margin-left: 7px; }
.people__meta {
  right: 17px; top: 76px; display: flex; align-items: center; white-space: nowrap; text-align: right;
  font-size: 12px; font-weight: 500; line-height: 1.8; letter-spacing: .06em; color: var(--c-sub);
}
.people__meta::before { content: ""; width: 15px; height: 1px; margin-right: 9px; background: var(--c-red-line); }
.people__card:nth-child(n) .people__box { top: 127px; }
.people__more { left: 947px; top: 621px; gap: 12px; }
.people__rec { top: 690px; width: 492px; height: 187px; display: block; color: var(--c-text); --cx: 28px; --cy: 37px; transition: opacity .2s; }
.people__rec:hover { opacity: .9; }
.people__rec > * { position: absolute; }
.people__rec--career { left: 68px; background: var(--c-blue); }
.people__rec--part { left: 581px; height: 188px; background: var(--c-red); }
.people__rec-en { left: 60px; top: 34px; font-size: 12px; line-height: 20px; letter-spacing: .3em; color: #fff; white-space: nowrap; }
.people__rec-ttl { left: 59px; top: 60px; height: 31px; padding: 0 16px; background: #fff; font-size: 16px; font-weight: 900; line-height: 31px; letter-spacing: .12em; white-space: nowrap; }
.people__rec-txt { left: 58px; top: 105px; font-size: 12px; line-height: 1.8; white-space: nowrap; }
.people__rec .arrow--l { left: 415px; top: 76px; }
.people__rec--part .people__rec-en { left: 59px; }
.people__rec--part .people__rec-ttl { left: 58px; padding: 0 14px; }
.people__rec--part .people__rec-txt { left: 57px; top: 103px; }
.people__rec--part .arrow--l { left: 414px; top: 74px; width: 46px; height: 46px; }

/* ---------- KSL NOTE (y6240–7141) ---------- */
.note { height: 882px; }
.note__wm { left: 113px; top: 57px; font-size: 117px; }
.note__en { left: 89px; top: 116px; }
.note__ja { left: 84px; top: 195px; line-height: 45px; }
.note__lead { left: 84px; top: 275px; line-height: 24px; color: var(--c-sub); white-space: nowrap; }
.note__card { display: block; width: 306px; height: 341px; }
.note__card--1 { left: 71px; top: 372px; }
.note__card--2 { left: 402px; top: 372px; }
.note__card--3 { left: 733px; top: 371px; }
.note__card > * { position: absolute; }
.note__img { left: 0; top: 0; width: 307px; height: 164px; overflow: hidden; --cx: 21px; --cy: 28px; }
.note__img img { position: absolute; height: auto; transition: transform .4s; }
.note__card:hover .note__img img { transform: scale(1.03); }
.note__card--1 .note__img img { left: -58px; top: -73px; width: 383px; }
.note__card--2 .note__img img { left: -49px; top: -25px; width: 423px; }
.note__card--3 .note__img img { left: -54px; top: -36px; width: 414px; }
.note__tag { left: 12px; top: 194px; height: 31px; padding-left: 9px; background: var(--c-lime); font-size: 12px; font-weight: 500; line-height: 31px; letter-spacing: .08em; white-space: nowrap; --cx: 13px; --cy: 18px; }
.note__card:nth-of-type(1) .note__tag { width: 122px; }
.note__card:nth-of-type(2) .note__tag { left: 13px; width: 111px; padding-left: 13px; }
.note__card:nth-of-type(3) .note__tag { left: 17px; width: 117px; padding-left: 13px; }
.note__ttl { left: 14px; top: 241px; font-size: 16px; font-weight: 500; line-height: 1.6; letter-spacing: .08em; white-space: nowrap; }
.note__card:nth-of-type(2) .note__ttl { left: 17px; }
.note__card:nth-of-type(3) .note__ttl { left: 21px; }
.note__date { left: 14px; top: 313px; font-size: 12px; font-weight: 500; line-height: 20px; letter-spacing: .08em; color: var(--c-sub); }
.note__card:nth-of-type(2) .note__date { left: 17px; }
.note__card:nth-of-type(3) .note__date { left: 21px; }
.note__frame { left: 71px; top: 769px; width: 969px; height: 62px; padding-left: 37px; border: 1px solid #bdbdbd; font-size: 9px; line-height: 60px; color: var(--c-note); white-space: nowrap; }

/* ---------- CONTACT (y7141–7506) ---------- */
.contact-sec { height: 365px; background: var(--c-green-bg); }
.contact-sec__wm { left: 104px; top: -14px; font-size: 117px; color: #fff; }
.contact-sec__en { left: 86px; top: 33px; }
.contact-sec__ja { left: 84px; top: 106px; line-height: 45px; }
.contact-sec__lead { left: 84px; top: 184px; line-height: 1.8; color: var(--c-sub); white-space: nowrap; }
.contact-sec__card { top: 69px; width: 299px; height: 176px; padding: 1px; background: var(--c-lime); --cx: 28px; --cy: 35px; display: block; transition: opacity .2s; }
.contact-sec__card:hover { opacity: .8; }
.contact-sec__card--business { left: 434px; }
.contact-sec__card--other { left: 756px; }
.contact-sec__in { position: relative; display: block; height: 100%; background: #fff; --cx: 27.5px; --cy: 34.4px; }
.contact-sec__in > * { position: absolute; }
.contact-sec__en2 { left: 38px; top: 26px; font-size: 12px; font-weight: 700; line-height: 20px; letter-spacing: .3em; color: var(--c-teal-dark); }
.contact-sec__ttl { left: 34px; top: 62px; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: .06em; white-space: nowrap; }
.contact-sec__sub { left: 38px; top: 104px; font-size: 12px; line-height: 20px; color: var(--c-sub); white-space: nowrap; }
.contact-sec__in .arrow { left: 250px; top: 20px; width: 23px; height: 23px; }
.contact-sec__card:nth-of-type(2) .contact-sec__en2, .contact-sec__card:nth-of-type(2) .contact-sec__sub { left: 40px; }
.contact-sec__card:nth-of-type(2) .contact-sec__ttl { left: 36px; }
.contact-sec__media { left: 433px; top: 277px; line-height: 24px; letter-spacing: .08em; color: var(--c-sub); white-space: nowrap; }
.contact-sec__media a { color: #fa5a52; text-decoration: underline; text-underline-offset: 3px; } /* 本文内リンクは下線（制作マニュアル 4.1.6(2)） */

/* 透かし英字の光学補正（欧文キャップは和文中心より上に乗るため） */
.page-top .ttl__bg { margin-top: -.05em; }

/* =========================================================
   SP（〜767px）  デザイン：HP top ス.pdf（アートボード幅375）
   PCの絶対配置(.abs)をフローに戻して1カラムで組み直す。
   コメントの y はSPデザイン上の座標。
   ========================================================= */
@media (max-width: 767px) {
  .page-top main .abs { position: relative; left: auto; top: auto; }
  .page-top main .sec { overflow: hidden; }
  .page-top .ttl__ja { letter-spacing: 0; }
  .page-top .ttl__en { margin-right: auto; }
  .page-top .more { font-size: 10px; }

  /* ---------- HERO (y45–936) ---------- */
  .hero { --hh: 560px; }
  .hero__bg { height: var(--hh); }
  .hero__shade { background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.45) 100%); }
  .hero .inner { padding-top: 150px; font-size: 0; }
  .hero__label { margin-left: 22px; font-size: 14px; }
  .hero__title { margin: 16px 0 0 47px; font-size: 26px; line-height: 1.6; }
  .hero__mark::after { bottom: 1px; height: 12px; }
  .hero__lead { margin: 20px 0 0 48px; font-size: 12px; line-height: 1.8; }
  .hero__btn { width: 201px; height: 56px; margin: 29px 0 0 47px; font-size: 14px; --cx: 11px; --cy: 17px; }
  .hero__btn--red, .hero__btn--gray { padding: 0 15px; }
  .hero__btn--gray { margin-top: 17px; --cx: 11px; --cy: 17px; }
  .hero__stat { display: inline-block; vertical-align: top; height: auto; margin-top: 29px; line-height: 19px; color: #717171; }
  .hero__stat--b1, .hero__stat--b2 { background: #393939; color: #fff; }
  .hero__stat--t1 { width: 33px; margin-left: 44px; }
  .hero__stat--b1 { width: 49px; }
  .hero__stat--t2, .hero__stat--b2, .hero__stat--t3 { margin-top: 4px; line-height: 21px; }
  .hero__stat--t2 { width: 73px; margin-left: 44px; }
  .hero__stat--b2 { width: 95px; }
  .hero__stat--t3 { margin-left: 5px; }
  .hero__wm { margin: 82px 0 -14px -3px; font-size: 69px; line-height: 74px; color: #e8e8e8; white-space: normal; }

  /* ---------- MISSION (y936–1501) ---------- */
  .mission .inner { padding: 71px 0 89px; text-align: center; }
  .mission__logo { width: 149px; margin: 0 auto; }
  .mission__lead { margin-top: 35px; font-size: 16px; line-height: 1.8; letter-spacing: .06em; white-space: normal; }
  .mission__note { margin-top: 41px; font-size: 12px; line-height: 1.8; letter-spacing: .06em; color: #bababa; white-space: normal; }

  /* ---------- NEWS (y1501–2338) ---------- */
  .news { min-height: 0; }
  .news .inner { padding: 50px 0 32px; }
  .page-top .news .news__wm { position: absolute; left: 15px; top: 24px; }
  .news__en { margin-left: 12px; }
  .news__ja { margin: 10px 0 0 23px; line-height: 43px; }
  .news__lead { margin: 17px 0 0 23px; color: #717171; }
  .news__tabs { width: 240px; margin: 31px 0 0 21px; flex-wrap: wrap; gap: 15px 12px; }
  .page-top .news .news__more { position: absolute; right: 23px; top: 91px; gap: 12px; font-size: 12px; } /* 見出し「ニュース」の右（タブが6つで3行目まで埋まるため、タブの右から移動） */
  .news__more .arrow { width: 20px; height: 20px; }
  .news__list { width: auto; margin: 24px 22px 0; }
  .news__list a { flex-wrap: wrap; min-height: 0; padding: 16px 1px 13px 0; }
  .news__list time { line-height: 24px; }
  .news__ttl { order: 2; flex: 0 0 100%; margin-top: 9px; padding: 0 0 0 7px; }
  .news__list time + .news__ttl { padding-left: 7px; }
  .news__list .arrow { order: 1; width: 20px; height: 20px; }

  /* ---------- OUR STORY (y2338–4948) ---------- */
  .story .inner { display: flex; flex-direction: column; padding: 90px 0 58px; }
  .story__arc { top: -1px; height: 31px; }
  .page-top .story .story__wm { position: absolute; left: 33px; top: 69px; word-spacing: -.25em; }
  .story__en { margin-left: 12px; }
  .story__ja { margin: 32px 0 0 39px; line-height: 1.6; }
  .story__lead { margin: 22px 0 0 38px; font-size: 12px; line-height: 1.8; color: #717171; white-space: normal; }
  .story__cols { display: block; width: auto; height: auto; margin-top: 64px; border-top: 0; }
  .story__col:nth-child(n) { width: auto; height: auto; margin-top: 0; border-left: 0; }
  .story__col:nth-child(2) { margin-top: 72px; }
  .story__col:nth-child(3) { margin-top: 73px; }
  .story__col:nth-child(4) { margin-top: 83px; }
  .story__col:nth-child(n) .story__tag { position: static; display: block; width: 58px; height: 35px; line-height: 35px; --cx: 6px; --cy: 9px; }
  .story__q, .story__col h3, .story__txt { position: static; white-space: normal; }
  .story__q { margin-top: 31px; color: #717171; }
  .story__col h3 { margin-top: 11px; }
  .story__txt { margin-top: 27px; color: #717171; }
  .story__col:nth-child(1) .story__tag { margin-left: 38px; padding-left: 10px; }
  .story__col:nth-child(2) .story__tag { margin-left: 48px; padding-left: 7px; width: 59px; }
  .story__col:nth-child(3) .story__tag { margin-left: 51px; padding-left: 7px; width: 68px; }
  .story__col:nth-child(4) .story__tag { margin-left: 52px; padding-left: 9px; }
  .story__col:nth-child(1) > :not(.story__tag) { margin-left: 43px; }
  .story__col:nth-child(2) > :not(.story__tag) { margin-left: 54px; }
  .story__col:nth-child(3) > :not(.story__tag), .story__col:nth-child(4) > :not(.story__tag) { margin-left: 57px; }
  .page-top .story .story__card { position: absolute; left: 19px; right: 19px; top: 1543px; width: auto; height: 757px; --cx: 26px; --cy: 33px; }
  .story__logo { width: 201px; margin: 87px auto 0; }
  .story__h3 { margin-top: 30px; font-size: 16px; font-weight: 500; line-height: 1.6; letter-spacing: .06em; color: #595757; text-align: center; white-space: normal; }
  .story__h3-2 { margin-left: 0; }
  .story__body { margin-top: 12px; line-height: 1.8; letter-spacing: .06em; color: #595757; text-align: center; white-space: normal; }
  .story__values { margin-top: 30px; justify-content: center; }
  .page-top .story .story__more { align-self: flex-end; margin: 19px 33px 0 0; gap: 18px; }
  .story__more .arrow, .numbers__more .arrow, .business__more .arrow, .people__more .arrow { width: 20px; height: 20px; }
  .story__photo { order: 1; width: 303px; height: 253px; margin: 25px 0 0 40px; --cx: 14px; --cy: 23px; }
  .story__photo img { left: 0; top: 0; width: 100%; height: 100%; }

  /* ---------- NUMBERS (y4948–5899) ---------- */
  .numbers .inner { display: flex; flex-direction: column; padding: 15px 0 56px; }
  .page-top .numbers .numbers__wm { position: absolute; left: 23px; top: -8px; font-size: 60px; }
  .numbers__en { margin-left: 10px; }
  .numbers__ja { margin: 28px 0 0 26px; font-size: 30px; line-height: 43px; }
  .numbers__list { order: 1; margin-top: 57px; }
  .numbers__item[class] { position: relative; left: auto; top: auto; width: auto; height: 117px; margin: 0 0 0 54px; border-top: 0; border-left: 1.5px solid var(--bar); }
  .numbers__item:nth-child(2) { margin-top: 25px; }
  .numbers__item:nth-child(3) { margin-top: 34px; }
  .numbers__item:nth-child(4) { margin-top: 39px; }
  .numbers__val { left: 42px; top: 5px; }
  .numbers__cap { left: 43px; top: 79px; }
  .numbers__item:nth-child(2) .numbers__val, .numbers__item:nth-child(3) .numbers__val { top: 10px; }
  .numbers__item:nth-child(4) .numbers__val { top: 7px; }
  .numbers__item:nth-child(2) .numbers__cap { top: 75px; }
  .numbers__item:nth-child(3) .numbers__cap { top: 78px; }
  .page-top .numbers .numbers__more { order: 2; align-self: flex-end; margin: 49px 38px 0 0; gap: 24px; }
  .numbers__note { order: 3; margin: 49px 0 0 51px; font-size: 8px; line-height: 16px; color: #b2b2b2; white-space: normal; }

  /* ---------- BUSINESS (y5899–7427) ---------- */
  .business .inner { padding: 18px 0 19px; }
  .page-top .business .business__wm { position: absolute; left: 41px; top: -8px; }
  .business__en { margin-left: 27px; }
  .business__ja { margin: 27px 0 0 49px; line-height: 1.6; }
  .business__lead { margin: 9px 0 0 49px; line-height: 1.8; white-space: normal; }
  .business__img[class] { width: auto; height: 211px; margin: 20px 22px 0 20px; }
  .business__img--1[class] { margin-top: 36px; }
  .business__img[class] img { left: -22px; top: -15px; width: 354px; height: auto; }
  .business__box[class] { width: auto; height: 178px; margin: 0 22px 0 20px; --cx: 20px; --cy: 35px; }
  .business__box[class] .business__no { left: 33px; top: 27px; width: 22px; height: 16px; padding-left: 3px; line-height: 16px; --cx: 4px; --cy: 6px; }
  .business__box[class] h3 { left: 33px; top: 55px; line-height: 24px; } /* SPでは1行 */
  .business__box[class] p { left: 33px; top: 85px; font-size: 12px; line-height: 1.8; }
  .business__box--3 .hang { margin-left: 0; }
  .page-top .business .business__more { display: flex; width: fit-content; margin: 38px 38px 0 auto; gap: 22px; }

  /* ---------- SUSTAINABILITY (y7427–9563) ---------- */
  .sustain .inner { padding: 66px 0 81px; }
  .sustain__wave { height: 28px; }
  .page-top .sustain .sustain__wm { position: absolute; left: -9px; top: 46px; font-size: 51px; color: #f1f1f1; }
  .sustain__en { margin-left: 22px; }
  .sustain__ja { margin: 17px 0 0 49px; line-height: 43px; }
  .sustain__lead { margin: 15px 0 0 48px; line-height: 1.8; white-space: normal; }
  .sustain__card { margin: 40px auto 0; }
  .sustain__card:nth-of-type(1) { margin-top: 38px; }
  .page-top .sustain .sustain__more { right: auto; display: flex; width: fit-content; margin: 21px calc(50% - 126.5px) 0 auto; } /* 最後のカードの下、右端をカードに揃える */

  /* ---------- PEOPLE (y9563–11551) ---------- */
  .people .inner { padding: 21px 0 71px; }
  .people__bg { height: 100%; background: #e6f6f9; }
  .page-top .people .people__wm { position: absolute; left: 33px; top: -9px; }
  .people__en { margin-left: 17px; }
  .people__ja { margin: 17px 0 0 34px; line-height: 43px; }
  .people__lead { margin: 15px 0 0 38px; line-height: 1.8; white-space: normal; }
  .people__card[class] { width: 300px; height: 247px; margin: 107px 0 0 37px; }
  .people__card:nth-of-type(1) { margin-top: 114px; } /* リード文と写真の間を1文字分以上あける */
  .people__pic { width: 300px; top: -108px; height: 277px; }
  .people__tag { top: 101px; width: 55px; height: 33px; padding-left: 16px; font-size: 11px; line-height: 33px; --cx: 6px; --cy: 9px; }
  .people__card:nth-child(n) .people__box { top: 119px; width: 281px; height: 128px; --cx: 17px; --cy: 24px; }
  .people__quote { left: 17px; top: 24px; font-size: 18px; line-height: 28px; }
  .people__quote .i { margin-left: 6px; }
  .people__meta { right: 15px; top: 70px; font-size: 11px; }
  .people__meta::before { width: 14px; margin-right: 13px; }
  .page-top .people .people__more { display: flex; width: fit-content; margin: 44px 37px 0 auto; gap: 21px; }
  .people__rec[class] { width: 298px; height: 266px; margin: 48px 0 0 39px; --cx: 17px; --cy: 48px; }
  .people__rec--part[class] { height: 267px; margin-top: 24px; }
  .people__rec[class] .people__rec-en { left: 41px; top: 33px; }
  .people__rec[class] .people__rec-ttl { left: 40px; top: 59px; padding: 0 15px; }
  .people__rec[class] .people__rec-txt { left: 39px; top: 112px; }
  .people__rec[class] .arrow--l { left: 226px; top: 202px; width: 46px; height: 46px; }
  .people__rec--part[class] .people__rec-en { top: 34px; }
  .people__rec--part[class] .people__rec-ttl { top: 61px; }
  .people__rec--part[class] .people__rec-txt { top: 113px; }
  .people__rec--part[class] .arrow--l { top: 203px; }

  /* ---------- KSL NOTE (y11551–13157) ---------- */
  .note .inner { padding: 22px 0 45px; }
  .page-top .note .note__wm { position: absolute; left: 34px; top: -9px; font-size: 60px; color: #f1f1f1; }
  .note__en { margin-left: 10px; }
  .note__ja { margin: 23px 0 0 30px; line-height: 43px; }
  .note__lead { margin: 26px 0 0 29px; line-height: 1.8; white-space: normal; }
  .note__card[class] { width: 307px; height: 347px; margin: 52px 0 0 36px; }
  .note__card:nth-of-type(1) { margin-top: 62px; }
  .note__card:nth-of-type(3) { margin-top: 60px; }
  .note__tag { top: 192px; }
  .note__card:nth-of-type(1) .note__tag { left: 9px; width: 114px; }
  .note__ttl { top: 247px; font-size: 14px; line-height: 1.6; letter-spacing: .06em; }
  .note__date { top: 319px; }
  .note__card:nth-of-type(1) .note__ttl, .note__card:nth-of-type(1) .note__date { left: 11px; }
  .note__card:nth-of-type(2) .note__ttl, .note__card:nth-of-type(2) .note__date { left: 16px; }
  .note__frame { width: auto; height: auto; margin: 31px 22px 0; padding: 17px 10px 17px 25px; font-size: 8px; line-height: 16px; white-space: normal; }

  /* ---------- CONTACT (y13157–13828) ---------- */
  .contact-sec .inner { padding: 12px 0 43px; }
  .page-top .contact-sec .contact-sec__wm { position: absolute; left: 33px; top: -7px; font-size: 60px; }
  .contact-sec__en { margin-left: 16px; }
  .contact-sec__ja { margin: 30px 0 0 37px; line-height: 43px; }
  .contact-sec__lead { margin: 9px 0 0 39px; line-height: 1.8; white-space: normal; }
  .contact-sec__card[class] { height: 177px; margin: 24px 0 0 39px; }
  .contact-sec__card:nth-of-type(1) { margin-top: 39px; }
  .contact-sec__media { margin: 26px 0 0 42px; font-size: 8px; letter-spacing: .02em; white-space: normal; }
}