@charset "utf-8";
/* =========================================================
   初めての方へ（Figma 613:15844）
   ========================================================= */
.fst { display: flex; flex-direction: column; align-items: center; gap: 1.48rem; padding-top: .70rem; }
.fst__blk { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 1.00rem; }
.fst__in { display: flex; flex-direction: column; align-items: center; gap: .70rem; }
.fst__part { width: 11rem; display: flex; flex-direction: column; align-items: flex-start; gap: .70rem; }

/* ---------- 4つの始め方（Frame 1321321229） ---------- */
.sit { width: 11rem; display: flex; flex-wrap: wrap; justify-content: center; gap: .55rem .44rem; }
.sit__card { width: 5.10rem; height: 6.01rem; display: flex; flex-direction: column; background: #fff; box-shadow: inset 0 0 0 .01rem #fd6a05; border-radius: .20rem; overflow: hidden; color: #4b4344; }
.sit__head { flex: none; height: 1.40rem; display: flex; align-items: center; justify-content: center; gap: .29rem; padding: .15rem 0; background: #fd6a05; color: #fff; }
.sit__head b {
  flex: none; width: .76rem; height: .76rem; border-radius: 50%; background: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: Poppins, Montserrat, sans-serif; font-weight: 700; font-size: .42077rem; line-height: .64118rem; letter-spacing: .029454rem; color: #fd6a05;
}
.sit__head h4 { font-weight: 700; font-size: .30352rem; line-height: .48057rem; letter-spacing: .021246rem; white-space: nowrap; }
.sit__head h4.s { width: 3.23rem; font-size: .2135rem; line-height: .31rem; letter-spacing: .014945rem; white-space: normal; }
.sit__body { height: 4.59rem; display: flex; flex-direction: column; align-items: flex-start; gap: .25rem; padding: .26rem .37rem; }
.sit__blk { display: flex; flex-direction: column; align-items: flex-start; gap: .12rem; }
.sit__blk + .sit__blk { margin-top: calc(.18rem - .25rem); }
.sit__lbl { padding: 0 .12rem; background: #feedcf; color: #fd6a05; font-weight: 700; font-size: .18623rem; line-height: .39574rem; letter-spacing: .027934rem; white-space: nowrap; }
.sit__list { display: flex; flex-direction: column; gap: .06rem; }
.sit__list li { position: relative; width: calc(.18rem + 3.62rem); padding-left: .18rem; font-weight: 400; font-size: .16rem; line-height: .27rem; letter-spacing: .024rem; }
.sit__list li::before { content: ""; position: absolute; left: 0; top: .11rem; width: .05rem; height: .05rem; border-radius: 50%; background: #fd6a05; }
.sit__txt { width: 4.34rem; font-weight: 400; font-size: .16rem; line-height: .27rem; letter-spacing: .024rem; }
.sit__rec { position: relative; width: 100%; display: flex; align-items: flex-start; gap: .05rem; padding-top: .25rem; color: #352e2e; font-weight: 700; font-size: .19476rem; line-height: .30837rem; letter-spacing: .013633rem; white-space: nowrap; }
.sit__rec::before { content: ""; position: absolute; left: 0; right: 0; top: -.01rem; height: .02rem; background: url(../img/lower/dash-line.svg) no-repeat 0 0 / 100% 100%; }
.sit__rec span { display: flex; align-items: flex-start; gap: .17rem; }
.sit__rec a { color: #fd6a05; text-decoration: underline; text-decoration-thickness: 12%; }
.sit__rec i { font-style: normal; }

/* ---------- 4つの段階（Frame 1321321253） ---------- */
.stage { display: flex; flex-direction: column; align-items: center; gap: .735rem; } /* 間に▼（25.5px）＋上下24px */
.stage li { position: relative; width: 11rem; height: 1.395rem; display: flex; align-items: center; gap: .29rem; padding: .20rem .28rem; background: #fff; color: #352e2e; }
.stage li:not(:last-child)::after { content: ""; position: absolute; left: calc(5.725167rem); top: calc(100% + .0001rem); width: .450333rem; height: .255rem; margin-top: -.0001rem; transform: translateY(0); background: url(../img/lower/tri-down.svg) no-repeat center / 100% 100%; rotate: 180deg; translate: 0 .0001rem; }
.stage li:not(:last-child)::after { top: calc(100% + .24rem); }
.stage__h { flex: none; width: 2.38rem; display: flex; flex-direction: column; gap: .01rem; font-weight: 700; font-size: .25765rem; line-height: .44221rem; letter-spacing: .018035rem; white-space: nowrap; }
.stage__h b { color: #fd6a05; font-size: .2045rem; line-height: .35542rem; letter-spacing: .014315rem; }
.stage__rows { position: relative; display: flex; flex-direction: column; gap: .12rem; padding-left: .29rem; }
.stage__rows::before { content: ""; position: absolute; left: 0; top: 50%; height: .995rem; transform: translateY(-50%); width: 0; box-shadow: 0 0 0 .005rem #352e2e; }
.stage__rows p { display: flex; align-items: center; gap: .18rem; font-weight: 400; font-size: .16rem; line-height: .35542rem; letter-spacing: .0112rem; white-space: nowrap; }
.stage__rows i {
  flex: none; min-width: 1.01rem; display: flex; align-items: center; justify-content: center; padding: .04106rem .19707rem; border-radius: .16423rem;
  background: #352e2e; color: #fff; font-style: normal; font-weight: 700; font-size: .14439rem; line-height: .22862rem; letter-spacing: .010107rem;
}
.stage__rows i.o { background: #fd6a05; }
.stage li.is-last { height: 1.38rem; padding: 0 .28rem 0 0; box-shadow: inset 0 0 0 .05rem #fd6a05; }
.stage li.is-last .stage__h { align-self: stretch; width: auto; justify-content: center; padding: .20rem .36rem; background: #fd6a05; color: #fff; font-size: .29119rem; line-height: .49979rem; letter-spacing: .020384rem; }
.stage li.is-last .stage__h b { margin-bottom: -.03rem; color: #fff; font-size: .23113rem; line-height: .4017rem; letter-spacing: .016179rem; }
.stage li.is-last .stage__rows { padding-left: 0; }
.stage li.is-last .stage__rows::before { content: none; }

/* ---------- 社内の体制（Frame 1321321274） ---------- */
.team { display: flex; align-items: flex-start; gap: .47rem; }
.team__tbl { border-collapse: separate; border-spacing: 0; font-weight: 700; font-size: .16rem; line-height: .35542rem; letter-spacing: .0112rem; }
.team__tbl th, .team__tbl td { height: .60rem; padding: .11rem .28rem; border: .01rem solid #fff; text-align: left; vertical-align: middle; white-space: nowrap; }
.team__tbl th { width: 1.86rem; background: #4b4344; }
.team__tbl td { width: 4.28rem; }
.memo { width: 4.30rem; display: flex; flex-direction: column; align-items: center; gap: .27109rem; padding: 0 .24304rem .25239rem; background: #fff; color: #352e2e; }
.memo__rings { width: 3.69025rem; height: .351622rem; }
.memo__in { display: flex; flex-direction: column; align-items: flex-start; gap: .20565rem; }
.memo__ttl { padding: 0 .11217rem; box-shadow: inset 0 0 0 .0187rem #352e2e; font-weight: 700; font-size: .24084rem; line-height: .41337rem; letter-spacing: .016859rem; white-space: nowrap; }
.memo__body { display: flex; flex-direction: column; align-items: flex-start; gap: .1963rem; }
.memo__list { display: flex; flex-direction: column; gap: .07478rem; }
.memo__list li { position: relative; width: calc(.16826rem + 3.66rem); /* Chrome の方が字幅がわずかに広く折り返すため +7px */ padding-left: .16826rem; font-size: .14957rem; line-height: .25239rem; letter-spacing: .022435rem; }
.memo__list li::before { content: ""; position: absolute; left: 0; top: .10282rem; width: .04674rem; height: .04674rem; border-radius: 50%; background: #fd6a05; }
.memo__list li.s { width: calc(.15729rem + 3.35546rem); padding-left: .15729rem; font-size: .1398rem; line-height: .23593rem; letter-spacing: .02097rem; }
.memo__list li.s::before { top: .09612rem; width: .04369rem; height: .04369rem; }
.memo__note { width: calc(3.66rem + .22434rem); padding: .07478rem .11217rem; background: #feedcf; font-size: .14957rem; line-height: .25239rem; letter-spacing: .022435rem; }

/* ---------- 費用と期間（Frame 1321321285） ---------- */
.fst__part--svc { gap: .70rem; }
.fsvc { display: flex; flex-direction: column; gap: 1.15rem; }
.fsvc__item { width: 11rem; display: flex; flex-direction: column; align-items: center; gap: .85rem; }
.fsvc__item .svc__head { align-self: stretch; }
.fsvc__item:nth-child(2) .svc__para { min-height: 0; }
.term { margin-top: calc(1.15rem - .70rem); display: flex; flex-direction: column; align-items: flex-start; gap: .49rem; }
.term__ttl { padding: .06rem 0; font-weight: 700; font-size: .4342rem; line-height: .35542rem; letter-spacing: .030394rem; white-space: nowrap; }
.term__row { display: flex; align-items: center; gap: .6667rem; } /* 箱 226 ×4 ＋ 間 67 ×3 ＝ 1100（カンプ実測） */
.term__row li { position: relative; width: 2.27rem; height: 1.13rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .1698rem; background: #4b4344; box-shadow: inset 0 0 0 .01126rem #fff; text-align: center; white-space: nowrap; }
.term__row li + li::before { content: ""; position: absolute; left: calc(-.33335rem - .156881rem); top: calc(50% - .088833rem); width: .313761rem; height: .177666rem; background: url(../img/lower/tri-right.svg) no-repeat center / .313761rem .177666rem; rotate: 90deg; }
.term__row b { display: flex; align-items: center; height: .22286rem; font-weight: 700; font-size: .2253rem; line-height: .4003rem; letter-spacing: .015771rem; }
.term__row span { display: flex; align-items: center; height: .1698rem; font-size: .1698rem; line-height: .4003rem; letter-spacing: .011886rem; }
.term__row li.s { gap: .16rem; box-shadow: inset 0 0 0 .01061rem #fff; }
.term__row li.s b { height: .21rem; font-size: .21225rem; line-height: .3772rem; letter-spacing: .014858rem; }
.term__row li.s span { height: .16rem; font-size: .16rem; line-height: .3772rem; letter-spacing: .0112rem; }

/* ---------- 支援先の変化（Frame 368 声つき） ---------- */
.fst__part--case { align-items: center; }
.fst__part--case .bh { align-self: flex-start; }
.vcards { display: flex; flex-wrap: wrap; align-items: flex-start; gap: .50rem .37rem; width: 11rem; }
.vcard { flex: none; width: 3.41464rem; display: flex; flex-direction: column; align-items: flex-start; gap: .18rem; filter: drop-shadow(0 .10561rem .14081rem rgba(0,0,0,.08)); }
.vcard__img { display: block; width: 3.41464rem; height: 1.91853rem; border-radius: .10501rem; overflow: hidden; }
.vcard__img img { width: 100%; height: 100%; object-fit: cover; }
.vcard__body { width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: .09rem; }
.vcard__tag { display: flex; align-items: center; padding: .03839rem .22071rem; background: #fd6a05; border-radius: .27319rem; font-weight: 500; font-size: .15357rem; line-height: .27955rem; letter-spacing: .016893rem; white-space: nowrap; }
.vcard__ttl { width: 100%; font-weight: 700; font-size: .21002rem; line-height: .33442rem; letter-spacing: .014702rem; text-align: justify; }
.vcard__voice { position: relative; width: 100%; margin-top: calc(.343397rem - .09rem); display: flex; flex-direction: column; gap: .14rem; padding: .20rem; background: #4b4344; border-radius: .20rem; }
.vcard__voice::before { content: ""; position: absolute; left: 0; top: -.343397rem; width: .91rem; height: .343397rem; background: url(../img/lower/voice-tail.svg) no-repeat 0 0 / 100% 100%; }
.vcard__voice b { padding-bottom: .14rem; box-shadow: 0 .005rem 0 #fff; font-weight: 700; font-size: .20rem; line-height: .33442rem; letter-spacing: .014rem; }
.vcard__voice > span { font-weight: 500; font-size: .16802rem; line-height: .33442rem; letter-spacing: .011761rem; }

/* ---------- 03：FAQ・得られること ---------- */
.fst__part--faq { align-items: center; }
.fst__part--faq .bh { align-self: flex-start; }
.gain { display: flex; align-items: center; gap: .26rem; }
.gain li { position: relative; width: 2.51rem; display: flex; flex-direction: column; align-items: center; gap: .12rem; padding: .47rem 0 .30rem; background: #4b4344; box-shadow: inset 0 0 0 .02rem #fff; /* 線幅がレイアウトに含まれる（Figma 174px） */ text-align: center; }
.gain b { position: absolute; left: .98rem; top: -.3038rem; width: .55rem; height: .55rem; border-radius: 50%; background: #fd6a05; display: flex; align-items: center; justify-content: center; font-family: Montserrat, sans-serif; font-weight: 700; font-size: .34347rem; line-height: .8199rem; letter-spacing: .037782rem; padding-left: .035rem; }
.gain h4 { font-weight: 700; font-size: .28rem; line-height: .33345rem; letter-spacing: .0196rem; white-space: nowrap; }
.gain p { width: calc(2.19rem + .03rem); height: .51rem; font-size: .16rem; line-height: .25448rem; letter-spacing: .024rem; }
.fst__blk--3 > .cta { margin-top: 0; }

/* ---------- kintoneとパッケージシステムの違い（613:16043） ---------- */
.pkg { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 1.00rem; padding: 1.00rem 0; background: #4b4344; }
.secno--plain .secno__h { gap: .13rem; }
.pkg__part { width: 11rem; display: flex; flex-direction: column; align-items: center; gap: .70rem; }
.pkg__vs { display: flex; align-items: flex-start; gap: .35546rem; }
.pbox { height: 5.25502rem; display: flex; flex-direction: column; align-items: flex-start; gap: .40349rem; padding: .4131rem .33624rem; background: #352e2e; box-shadow: inset 0 0 0 .02882rem #fff; border-radius: .19214rem; }
.pbox--or { width: 5.2262rem; align-items: center; gap: .31703rem; background: #4d3529; box-shadow: inset 0 0 0 .07686rem #fd6a05; }
.pbox__ttl { display: flex; align-items: center; height: .2786rem; font-weight: 700; font-size: .25939rem; line-height: .71092rem; letter-spacing: .018157rem; white-space: nowrap; }
.pbox__fig { width: 100%; display: flex; flex-direction: column; align-items: center; gap: .1345rem; }
.pbar { position: relative; width: 4.61135rem; display: flex; justify-content: center; }
.pbar--k { height: 2.52664rem; align-items: center; }
.pbar__cols { position: relative; display: flex; align-items: center; gap: .31703rem; }
.pbar__cols p { display: flex; flex-direction: column; align-items: center; font-weight: 700; font-size: .16911rem; line-height: .3758rem; letter-spacing: .025366rem; white-space: nowrap; }
.pbar__cols p > span:first-child { margin-bottom: .11528rem; }
.pbar__cols p > span:last-child { margin-top: .10568rem; }
.pbar__b { display: block; width: 1.18166rem; background: #99a3bf; }
.pbar--k .pbar__b { background: #fd6a05; }
.pbar__b--none { background: none; border: dashed #fff; border-width: .02882rem .02882rem 0; }
.pbar__cols::after { content: ""; position: absolute; left: calc(50% - .0048rem - 2.248035rem); width: 4.49607rem; bottom: calc(.3758rem + .10568rem - .0144rem); height: 0; box-shadow: 0 0 0 .0144rem #fff; }
.pbox__txt { min-width: 100%; font-size: .16911rem; line-height: .31703rem; letter-spacing: .025366rem; text-align: center; white-space: nowrap; }
.pbox__txt em { font-weight: 700; color: #f1a36e; }
.pkg__txt { width: 11rem; display: flex; flex-direction: column; gap: .39117rem; font-size: .17603rem; line-height: .39117rem; letter-spacing: .026404rem; }
.pkg__txt strong { font-weight: 700; }
.pkg__txt a { font-weight: 700; color: #f1a36e; text-decoration: underline; text-decoration-thickness: from-font; }
.pkg__two { display: flex; align-items: flex-start; gap: .37rem; }
.pcard { width: 5.4201rem; display: flex; flex-direction: column; align-items: flex-start; gap: .33rem; padding: .43rem .35rem; background: #352e2e; box-shadow: inset 0 0 0 .03rem #fff; border-radius: .20rem; }
.pcard--or { width: 5.42rem; background: #4d3529; box-shadow: inset 0 0 0 .08rem #fd6a05; }
.pkg__part--2 .pcard:not(.pcard--or) { width: 5.63rem; height: 3.05rem; } /* 「向いている会社」の左カード：562×305（カンプ実測） */
.pcard h4 { position: relative; width: 100%; display: flex; align-items: center; height: .29rem; font-weight: 700; font-size: .27rem; line-height: .74rem; letter-spacing: .0189rem; white-space: nowrap; }
.pcard h4::after { content: ""; position: absolute; left: 0; right: 0; bottom: calc(-.33rem / 2 - .29rem / 2 + .145rem - .33rem / 2); height: 0; }
.pcard__txt { position: relative; display: flex; flex-direction: column; gap: .39117rem; padding-top: .33rem; font-size: .17603rem; line-height: .39117rem; letter-spacing: .026404rem; }
.pcard__txt::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 0; box-shadow: 0 0 0 .01rem #fff; }
.pcard--or .pcard__txt::before { box-shadow: 0 0 0 .01rem #fd6a05; }
.pkg > .cta { align-self: stretch; }
.cta { background: transparent; }
/* テキスト枠は整数高に切り上がる（Figma：見出し 45.74 / 項目 26・24・48） */
.memo__ttl { height: .45739rem; display: flex; align-items: center; }
.memo__list li:nth-child(1) { height: .26rem; }
.memo__list li:nth-child(2) { height: .24rem; }
.memo__list li:nth-child(3) { height: .48rem; }
/* 枠線がレイアウトに含まれる（Figma の strokes included in layout）ため、余白に線幅を足す */
.pbox { padding: calc(.4131rem + .02882rem) calc(.33624rem + .02882rem); }
.pbox--or { padding: calc(.4131rem + .07686rem) calc(.33624rem + .07686rem); }
.pcard { padding: calc(.43rem + .03rem) calc(.35rem + .03rem); }
.pcard--or { padding: calc(.43rem + .08rem) calc(.35rem + .08rem); }
/* 料金表（SERVICE 03 と同じ部品）：本文色は白を継がず、サービスページ（.svp）と同じ #4b4344 */
.ptbl3 .p3c, .ptbl3 .p3s { color: #4b4344; }
.ptbl .pcol__body li { color: #4b4344; }
.ptbl__lab li, .ptbl3__lab li { background: #4b4344; } /* 暗い地の上なので見出し列は 1 段明るく（Figma 実測） */
/* 料金表のセル文字（サービスページ .svp と同じ実寸。style.css の値は TOP の縮小インスタンス用） */
.ptbl .pcol__body li.is-price, .ptbl .pcol__body li.is-list { font-size: .1543rem; letter-spacing: .007098rem; }
.ptbl .pcol__body li.is-sm { font-size: .10829rem; line-height: .15475rem; letter-spacing: .00758rem; }
.ptbl .pcol__body li.is-mk { padding-top: .04rem; font-size: .205rem; line-height: .205rem; letter-spacing: 0; font-weight: 700; color: #352e2e; -webkit-text-stroke: .012rem currentColor; }
.ptbl .pcol__body li.is-xs { font-size: .13923rem; letter-spacing: .009746rem; }