/* 工事一元管理（/restore-manage）専用。
   現行 STUDIO 版（service.remodela.jp/restore-manage）のレイアウト・余白・文字サイズに合わせている。
   相談CTA（.t-contact）・見出しラベル（.t-label）・表示アニメーション（[data-appear]）はトップと同じ部品なので top.css を共用する。
   ブレークポイントは現行と同じ 1280 / 840 / 540 / 320px。 */
.rm{--grad:linear-gradient(90deg,#ff6 0%,#ffb054 100%);background:#fff}
/* shared.css の p{text-wrap:pretty} は現行と改行位置が変わるため、折り返しの方式だけ既定に戻す（white-space:nowrap 指定は残す） */
.rm p{text-wrap-style:auto}
.rm h1,.rm h2,.rm h3{font-weight:700}
.rm img{display:block}
.rm em{font-style:normal}

/* ---------- ファーストビュー ---------- */
.rm-hero{position:relative;z-index:1;isolation:isolate;display:flex;flex-direction:column;align-items:center;background:#f6f7f9}
.rm-hero::before{content:'';position:absolute;inset:0;z-index:-1;background:url(../media/pages/restore-manage/b0f61641-0530-4723-8a9c-29b107f1b042.jpg) center top/cover no-repeat;pointer-events:none}
.rm-hero__in{width:1400px;max-width:100%;margin-top:120px;display:flex;align-items:flex-start;justify-content:space-between}
.rm-hero__copy{width:45%;margin-bottom:140px;display:flex;flex-direction:column;align-items:flex-start}
.rm-hero__title{margin-bottom:30px !important;color:var(--g);font-size:4vw;font-weight:800 !important;line-height:1.25;white-space:nowrap}
.rm-hero__catch{margin-bottom:20px !important;display:flex;flex-direction:column;align-items:flex-start;color:var(--ink);font-size:40px;font-weight:800;line-height:1.4}
.rm-hero__line{display:flex;justify-content:center;white-space:nowrap}
.rm-hero__catch em{color:var(--g)}
.rm-hero__pill{margin-bottom:10px !important;padding:10px 30px;border-radius:8px;background:#fff;color:var(--ink);font-size:18px;font-weight:500;line-height:1.4;text-align:center}
.rm-hero__dl{width:70%;margin-top:30px;padding:10px 30px;border-radius:96px;background:var(--grad);box-shadow:3px 3px 0 rgba(0,0,0,.2);display:flex;align-items:center;justify-content:center;color:#282828}
.rm-hero__dl img{position:relative;flex:none;width:100px;height:auto}
.rm-hero__dl-text{padding-left:10px;font-size:28px;font-weight:700;line-height:1.25;white-space:nowrap}
.rm-hero__dl-icon{flex:none;width:32px;height:32px;margin-right:15px;fill:#333}
.rm-hero__img{width:55%;height:auto}

/* ---------- 利用企業ロゴ ---------- */
.rm-logos{display:flex;flex-direction:column;align-items:center}
.rm-logos__title{margin:50px 0 30px !important;color:var(--ink);font-size:22px;line-height:1.6;text-align:center}
.rm-logos__title span{display:inline-block}
.rm-logos__list{width:100%;display:flex;flex-wrap:wrap;align-items:center;justify-content:center}
.rm-logo{height:auto;margin:5px 15px}
.rm-logo--recrea{width:120px}.rm-logo--daihyaku{width:140px}.rm-logo--space{width:160px}.rm-logo--kawata{width:140px}.rm-logo--goodworks{width:150px}
.rm-logo--gates{width:60px}.rm-logo--tatemono{width:200px}.rm-logo--keiai{width:80px}.rm-logo--conspirito{width:180px}

/* ---------- お悩み ---------- */
.rm-worry{position:relative;z-index:1;padding:100px 100px 0;display:flex;flex-direction:column;align-items:center}
.rm-worry__in{width:1100px;max-width:100%;padding:0 40px;display:flex;flex-direction:column;align-items:center}
.rm-worry__title{margin-bottom:30px !important;color:var(--ink);font-size:40px;line-height:1.35;text-align:center;font-feature-settings:'palt' 1 !important}
.rm-worry__list{width:100%;margin-bottom:30px !important;display:flex;flex-wrap:wrap;align-items:stretch;justify-content:center;gap:30px 20px}
.rm-worry__item{position:relative;width:calc(33% - 13.4px);padding:15px 10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
.rm-worry__item--1{z-index:3}
.rm-worry__item--3{justify-content:flex-end}
.rm-worry__text{position:relative;z-index:2;flex:1;color:var(--ink);font-size:20px;font-weight:500;line-height:1.5;text-align:center}
.rm-worry__text span{display:block}
/* 1行目は語の途中（「工/事業者」など）で折り返さないよう、<wbr> の位置でだけ折り返す */
.rm-worry__text span:first-child{word-break:keep-all;overflow-wrap:anywhere}
.rm-worry__text strong{color:var(--ink);font-weight:800}
.rm-worry__bubble{position:absolute;width:200px;max-width:100%;height:auto}
.rm-worry__item--1 .rm-worry__bubble{top:-20px;right:52px}
.rm-worry__item--2 .rm-worry__bubble{top:-25px;right:52px}
.rm-worry__item--3 .rm-worry__bubble{top:-22px;left:52px}
.rm-worry__img{width:500px;max-width:100%;height:auto}

/* ---------- 解決・ベネフィット ---------- */
.rm-benefit{padding:100px 0;background:var(--mint);display:flex;flex-direction:column;align-items:center}
.rm-benefit__label{width:1100px;max-width:100%}
.rm-solve{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;color:var(--ink);font-size:40px;line-height:1.35;text-align:center;font-feature-settings:'palt' 1 !important}
.rm-solve__brand{margin:0 5px;color:var(--g)}
.rm-bn{width:100%;padding:80px 0;display:flex;flex-direction:column;align-items:center}
.rm-bn--2{background:#d8ede0}
.rm-bn__in{width:1350px;max-width:100%;display:flex;align-items:center;justify-content:center;gap:80px;overflow-x:auto;overflow-y:hidden}
.rm-bn--2 .rm-bn__in{flex-direction:row-reverse}
.rm-bn__body{position:relative;z-index:0;flex:1;padding-left:100px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;--ad:.6s;--adl:.6s}
.rm-bn--2 .rm-bn__body{padding:0 100px 0 0}
.rm-bn__title{width:100%;margin-bottom:30px !important;color:var(--g);font-size:32px;line-height:1.35;font-feature-settings:'palt' 1 !important}
/* 現行は1024px幅などで「完/全集約」「ワンストッ/プ管理」「一/瞬で」と語の途中で折り返していたため、<wbr> の位置でだけ折り返す（行数は現行と同じ） */
.rm .rm-bn__title{word-break:keep-all;overflow-wrap:anywhere}
.rm-bn__lead{margin-bottom:30px !important;color:var(--ink);font-size:18px;font-weight:700;line-height:1.6}
.rm-bn__list{display:flex;flex-direction:column;gap:10px;line-height:1.6}
.rm-bn__list li{position:relative;padding-left:24px}
.rm-bn__list li::before{content:'';position:absolute;left:0;top:5px;width:14px;height:14px;border-radius:50%;background:var(--g)}
.rm-bn__item-title,.rm-bn__item-text{color:#333;font-size:16px;line-height:1.8}
.rm-bn__item-title{font-weight:700}
.rm-bn__fig{width:calc(36% - 51.2px);border-radius:8px;--ad:.6s;--adl:.6s}
.rm-bn__fig img{width:100%;height:auto}

/* ---------- 機能紹介 ---------- */
.rm-fn{padding:80px 100px;background:var(--g);display:flex;flex-direction:column;align-items:center}
.rm-fn__label{width:1100px;max-width:100%;color:var(--sage)}
.rm-fn__title{width:1100px;max-width:100%;padding:0 40px;color:#fff;font-size:40px;line-height:1.35;text-align:center;font-feature-settings:'palt' 1 !important}
.rm-fn__slider{width:1000px;max-width:100%;overflow:hidden}
.rm-fn__track{display:flex;align-items:flex-start}
.rm-fn__panel{flex:none;width:100%;padding-top:40px}
.rm-fn__card{padding:30px 45px 60px;border-radius:8px;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.1);display:flex;flex-direction:column;align-items:center}
.rm-fn__tabs{width:100%;display:flex;flex-wrap:wrap;align-items:flex-end;gap:5px}
.rm-fn__tab{width:calc(16.6% - 4.17px);word-break:keep-all;overflow-wrap:anywhere;padding:17px 0 15px;border-radius:2px;background:var(--mint);color:var(--g);font-size:14px;font-weight:600;line-height:1;text-align:center;transition:background-color .3s cubic-bezier(.4,.4,0,1),color .3s cubic-bezier(.4,.4,0,1)}
.rm-fn__tab:hover,.rm-fn__tab[aria-current]{background:var(--g);color:#fff}
.rm-fn__img{width:100%;height:auto;margin:30px 0 40px;border:2px solid transparent;background:rgba(36,37,40,.1)}
.rm-fn__desc{width:100%;padding:15px 30px;border:2px solid var(--g);border-radius:2px;display:flex;align-items:center;justify-content:center}
.rm-fn__name{flex:none;margin-right:30px !important;color:var(--g);font-size:16px;line-height:1.8}
.rm-fn__text{flex:1;color:#333;font-size:16px;font-weight:400;line-height:1.8}

/* ---------- 紹介動画 ---------- */
.rm-movie{background:var(--mint);display:flex;flex-direction:column;align-items:center}
.rm-movie__in{width:100%;padding:80px 40px;display:flex;flex-direction:column;align-items:center}
.rm-movie__card{width:1000px;max-width:100%;padding:0 50px 50px;border-radius:16px;background:#fff;box-shadow:1px 2px 25px 2px rgba(48,152,115,.2);display:flex;flex-direction:column;align-items:center}
.rm-movie__catch{margin-top:30px !important;display:flex;align-items:center;justify-content:center;color:var(--deep);font-size:20px;font-weight:700;line-height:1.4;font-feature-settings:'palt' 1}
.rm-movie__catch img{width:10px;height:auto}
.rm-movie__catch span{margin:0 20px}
.rm-movie__title{margin:15px 0 30px !important;color:var(--ink);font-size:32px;line-height:1.35;font-feature-settings:'palt' 1 !important}
.rm-movie__frame{width:600px;max-width:100%;height:345px}
.rm-movie__frame iframe{display:block;width:100%;height:100%;border:0}

/* ---------- 利用者の声 ---------- */
.rm-voice{padding:80px 60px 100px;border-top:1px solid rgba(0,0,0,.3);display:flex;flex-direction:column;align-items:center}
.rm-voice__label{width:1100px;max-width:100%}
.rm-voice__title{width:1100px;max-width:100%;margin-bottom:50px !important;padding:0 40px;color:var(--ink);font-size:40px;line-height:1.35;text-align:center;font-feature-settings:'palt' 1 !important}
.rm-voice__list{width:1100px;max-width:100%;padding:0 20px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:stretch}
.rm-voice__card{border-radius:12px;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.2);display:flex;flex-direction:column;overflow:hidden;color:#333}
.rm .rm-voice__photo{width:100%;height:300px;object-fit:cover;border-radius:12px 12px 0 0}
.rm-voice__body{flex:1;padding:30px;display:flex;flex-direction:column;align-items:flex-start}
.rm-voice__head{color:#333;font-size:20px;font-weight:800;line-height:1.4}
/* 現行は「…残業15時間以下/に」のように1文字だけ次の行に送られていたため、541px以上は行の長さをそろえる（折り返しの位置は shared.css の文節の切れ目） */
@media (min-width:541px){.rm-voice__head{text-wrap:balance}}
.rm .rm-voice__logo{width:auto;max-width:100%;height:40px;margin:10px 0}
.rm-voice__company{margin:10px 0 20px !important;color:#333;font-family:Lato,var(--f);font-size:16px;font-weight:700;line-height:1}
.rm-voice__tags{display:flex;flex-wrap:wrap}
.rm-voice__tags li{margin:0 5px 5px 0;padding:5px 15px;border-radius:32px;background:rgba(148,201,166,.5);color:var(--g);font-size:15px;font-weight:500;line-height:1.4}

/* ---------- 1280px 以下 ---------- */
@media (max-width:1280px){
  .rm-hero__in{margin-top:0;padding:0 70px;width:100%;flex-direction:column;align-items:center;justify-content:flex-start}
  .rm-hero__copy{width:100%;margin:80px 0 0;align-items:center}
  .rm-hero__title{font-size:64px}
  .rm-hero__catch{align-items:center}
  .rm-hero__dl-text{font-size:24px}
  .rm-hero__img{width:70%}
  .rm-logo--keiai{width:90px}
  .rm-worry{padding:60px 100px 40px}
  .rm-worry__in{width:100%}
  .rm-worry__title{margin-bottom:49px !important}
  .rm-worry__list{gap:30px}
  .rm-worry__item{width:calc(50% - 15px);gap:20px}
  .rm-worry__item--1 .rm-worry__bubble{top:-20px;right:130px}
  .rm-worry__item--2 .rm-worry__bubble{top:-20px;left:130px;right:auto}
  .rm-worry__item--3 .rm-worry__bubble{top:-21px;right:141px;left:auto}
  .rm-bn__in{gap:40px}
  .rm-bn__body{padding-left:90px}
  .rm-bn--2 .rm-bn__body{padding:0 90px 0 0}
  .rm-bn__title{font-size:36px}
  .rm-bn__fig{width:calc(36% - 15px - 25.6px);margin-right:15px}
  .rm-bn--2 .rm-bn__fig{margin:0 0 0 15px}
  .rm-fn{padding:100px 60px}
  .rm-movie__in{width:1080px;max-width:100%}
  .rm-movie__card{width:100%}
  .rm-movie__frame{width:450px}
  .rm-voice{padding:80px 60px}
  .rm-voice__list{width:100%}
}
/* ---------- 840px 以下 ---------- */
@media (max-width:840px){
  .rm-hero__in{padding:100px 40px 0}
  .rm-hero__copy{margin:0}
  .rm-hero__dl{width:460px}
  .rm-hero__dl img{left:6px;width:90px}
  .rm-hero__dl-text{padding:0 5px 0 20px;font-size:20px}
  .rm-hero__img{width:90%}
  .rm-worry{padding:50px 30px}
  .rm-worry__in{padding:0 20px}
  .rm-worry__title{margin-bottom:30px !important;font-size:28px}
  .rm-worry__list{gap:20px 15px}
  .rm-worry__item{width:calc(50% - 7.5px)}
  .rm-worry__item--3 .rm-worry__bubble{top:-26px;right:73px}
  .rm-solve{font-size:24px}
  .rm-bn{padding:40px 0}
  .rm-bn--1{padding:0}
  .rm-bn__in,.rm-bn--2 .rm-bn__in{flex-direction:column-reverse;align-items:flex-start;justify-content:flex-end;gap:40px;padding:0 15px 40px}
  .rm-bn--1 .rm-bn__in{margin-bottom:80px}
  .rm-bn__body,.rm-bn--2 .rm-bn__body{width:100%;padding:0}
  .rm-bn__title{font-size:24px}
  .rm-bn__fig,.rm-bn--2 .rm-bn__fig{width:100%;margin:0}
  .rm-fn{padding:50px 15px}
  .rm-fn__title{font-size:24px}
  .rm-fn__card{padding:30px 15px 60px}
  .rm-fn__tabs{align-items:stretch}
  .rm-fn__tab{width:calc(25% - 3.75px)}
  .rm-movie__in{width:100%}
  .rm-movie__title{font-size:24px}
  .rm-movie__frame{width:600px}
  .rm-voice__title{font-size:24px}
  .rm-voice__list{padding:0 20px;grid-template-columns:1fr;gap:0}
  .rm-voice__card{margin:0 15px 45px}
  .rm-voice__list{padding-bottom:30px}
  .rm-voice__company{margin:10px 0 15px !important;font-family:var(--f);font-size:18px}
  .rm-voice__tags li{border-radius:24px;background:var(--sage)}
}
/* ---------- 540px 以下 ---------- */
@media (max-width:540px){
  /* 現行はヘッダー60pxに対して本文が70px下から始まるため、ヘッダーとの間に10pxの白い帯がある */
  .rm-hero{margin-top:10px}
  .rm-hero__in{padding:40px 20px 0}
  .rm-hero__copy{margin-top:40px}
  .rm-hero__title{width:100%;margin-bottom:0 !important;padding-bottom:20px;font-size:36px;text-align:center}
  /* 現行は375px幅で「煩雑なやりとりを一元管理！」の両端が画面外に切れるため、左右20pxの余白の内側に1行で収まるよう文字だけ縮める（行の高さは現行の42pxのまま） */
  .rm-hero__catch{font-size:min(30px,calc((100vw - 40px) / 13));line-height:42px}
  .rm-hero__pill{font-size:16px}
  .rm-hero__dl{width:100%}
  .rm-hero__dl img{left:0;width:80px}
  .rm-hero__img{width:100%}
  .rm-logos__title{margin:40px 15px 15px !important;font-size:18px}
  .rm-logo--recrea{width:100px}.rm-logo--daihyaku,.rm-logo--space,.rm-logo--kawata,.rm-logo--goodworks{width:120px}
  .rm-logo--gates{width:40px}.rm-logo--tatemono{width:160px}.rm-logo--keiai{width:80px}.rm-logo--conspirito{width:140px}
  .rm-worry{padding:50px 25px 0}
  .rm-worry__in{padding:0;gap:5px}
  .rm-worry__title{margin-bottom:0 !important;font-size:20px}
  .rm .rm-worry__list{gap:15px;padding-top:20px}
  .rm-worry__item{justify-content:flex-start;gap:10px}
  .rm-worry__item--3{justify-content:flex-start}
  .rm-worry__text{font-size:16px}
  .rm-worry__item--1 .rm-worry__bubble{top:-23px;right:10px}
  .rm-worry__item--2 .rm-worry__bubble{top:-23px;left:10px}
  .rm-worry__item--3 .rm-worry__bubble{top:-29px;left:20px;right:18px}
  .rm-benefit{padding:60px 0 0}
  .rm-solve{padding:0 16px}
  .rm-bn__in,.rm-bn--2 .rm-bn__in{gap:30px;margin-bottom:60px;padding:0 0 40px}
  .rm-bn--1 .rm-bn__in{margin-bottom:60px}
  .rm-bn__body,.rm-bn--2 .rm-bn__body{padding:0 15px}
  .rm-bn__title{margin-bottom:15px !important;line-height:1.5}
  .rm-bn__lead{margin-bottom:15px !important}
  .rm-bn__fig,.rm-bn--2 .rm-bn__fig{padding:0 15px}
  .rm-fn{padding:60px 20px 20px}
  .rm-fn__img{margin:30px 0 20px}
  .rm-fn__desc{padding:15px}
  .rm-movie__in{padding:50px 15px}
  .rm-movie__card{padding:0 15px 50px}
  .rm-movie__title{font-size:20px}
  .rm-voice{padding:50px 30px}
  .rm-voice__list{padding:0}
  .rm-voice__card{margin:0 0 45px}
  .rm-voice__list{padding-bottom:0}
}
/* ---------- 320px 以下 ---------- */
@media (max-width:320px){
  .rm-hero__in{padding:30px 20px 0}
  .rm-hero__copy{margin-top:0}
  .rm-hero__title{margin-bottom:20px !important;padding-bottom:0;font-size:28px}
  .rm-hero__catch{margin-bottom:10px !important;font-size:18px;line-height:1.4}
  .rm-hero__pill{margin-bottom:30px !important;font-size:15px}
  .rm-hero__dl{margin:0 0 15px}
  .rm-hero__dl img{width:60px}
  .rm-hero__dl-text{margin-right:5px;padding:0 0 0 10px;font-size:16px}
  .rm-hero__dl-icon{width:24px;height:24px}
  .rm-hero__img{margin-bottom:40px}
  .rm-logos__title{font-size:16px}
  .rm-logo{margin:5px 10px}
  .rm-logo--tatemono{width:150px}.rm-logo--keiai{width:70px}.rm-logo--conspirito{width:160px}
  .rm-worry{padding:60px 15px 40px}
  .rm-worry__in{gap:0}
  .rm-worry__bubble{width:130px}
  .rm-worry__item--1 .rm-worry__bubble{top:16px;left:13px;right:-5px}
  .rm-worry__item--2 .rm-worry__bubble{top:auto;bottom:22px;left:0;right:8px}
  .rm-worry__item--3{align-items:flex-end;justify-content:center}
  .rm-worry__item--3 .rm-worry__bubble{top:10px;left:3px;right:4px}
  .rm-benefit{padding:60px 0}
  .rm-bn__title{font-size:20px}
  .rm-bn__lead{font-size:16px}
  .rm-bn__list{gap:5px}
  .rm-fn{padding:40px 15px 20px}
  .rm-fn__title{padding:0}
  .rm-fn__tab{font-size:13px}
  .rm-fn__img{margin:15px 0}
  .rm-movie__in{padding:50px 0}
  .rm-voice{padding:50px 15px}
  .rm-voice__title{margin-bottom:30px !important;padding:0}
  .rm .rm-voice__photo{height:200px}
  .rm-voice__body{padding:30px 15px}
  .rm-voice__head{font-size:16px}
  .rm-voice__company{font-size:16px}
  .rm-voice__tags li{font-size:14px}
}