/* 代理店募集 service-lp.css の上に積む。右にフォームを固定し左に中身を並べる */
.pt-page{position:relative;--pt-form:400px;--pt-gap:56px;--pt-pad:clamp(20px,4vw,48px)}
.pt-inner,.pt-hero__inner{box-sizing:border-box;max-width:1280px;margin:0 auto;padding-inline:var(--pt-pad)}
.pt-page .lp-band{padding:clamp(56px,6vw,88px) 0}
.pt-page .home-section-heading{min-height:140px;margin-bottom:36px}
.pt-page .home-section-heading__back{font-size:clamp(56px,7.4vw,120px)}
.service-lp.pt-page :is(.lp-band,.lp-why) h2{text-wrap:balance;word-break:auto-phrase}

/* ヒーロー 今のLPと同じくパソコンの上に見出し */
.service-lp .pt-hero{min-height:0;display:block}
.pt-hero__inner{display:grid;gap:14px;padding-top:104px;padding-bottom:48px}
.pt-hero__inner .pt-hero__laptop{width:min(100%,600px);margin:0}
.service-lp .pt-hero .lp-hero__sub{word-break:auto-phrase;text-wrap:balance}
.service-lp .pt-hero h1{color:#fff;font-size:clamp(28px,3.4vw,50px);font-weight:700;line-height:1.3}.pt-hero h1 span{display:block}

/* ロゴ */
.pt-logos{padding-top:20px;padding-bottom:0}
.service-lp .pt-logos .supporters{padding:8px 0 0}

/* ほかのページへの行 トップのサービスの行と同じ部品 */
.pt-pages .layerx-services__list{display:grid;grid-auto-rows:1fr;padding:0;gap:16px}
.pt-pages .layerx-services__row{box-sizing:border-box;height:100%}
.pt-pages .is-current .layerx-services__glass{border-color:#f1f1f3;background:#ffffff14}
@media(min-width:768px){.pt-pages .layerx-services__row{padding:20px}.pt-pages .layerx-services__image{width:160px;height:112px}.pt-pages .layerx-services__copy{padding:0 24px}.pt-pages .layerx-services__name{font-size:26px}.pt-pages .layerx-services__description{font-size:15px;line-height:1.7}}

/* 画像つきのカード 同じ並びのカードは同じ大きさ */
.pt-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:20px}
.pt-cards>li{box-sizing:border-box;display:flex;flex-direction:column;gap:18px;height:100%;padding:20px 20px 26px;border:1px solid var(--lp-line);border-radius:var(--lp-radius);background:var(--lp-card);box-shadow:0 18px 40px #0006}
.pt-cards img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:18px;background:#000}
.pt-cards__num{display:none!important}
.pt-cards__body{display:grid;align-content:start;gap:10px}
.service-lp .pt-cards h3{color:#fff;font-size:24px;font-weight:700;line-height:1.35}
.service-lp :is(.pt-cards,.pt-icons) p{color:var(--lp-text);font-size:16px;line-height:1.8}

/* 悩み 金属のアイコン */
.pt-worries{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:16px}
.pt-worries:has(>li:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.pt-worries li{display:grid;justify-items:center;align-content:center;gap:12px;padding:24px 16px;border-radius:30px;background:var(--lp-card);color:#fff;text-align:center}
.pt-worries img{display:block;width:72px;height:72px;object-fit:contain}
.service-lp .pt-worries p{font-size:18px;font-weight:700;line-height:1.55}

/* アイコンのカード 左に金属のアイコン 右に見出しと中身 */
.pt-icons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:16px}
/* 数が奇数の時は1つだけはみ出さないよう1列にする */
:is(.pt-icons,.pt-cards):has(>li:last-child:nth-child(odd)){grid-template-columns:minmax(0,1fr)}
.pt-icons li{display:grid;grid-template-columns:72px minmax(0,1fr);gap:18px;align-items:center;padding:22px;border:1px solid var(--lp-line);border-radius:20px;background:var(--lp-card);box-shadow:0 18px 40px #0006}
.pt-icons__mark{display:block;width:72px;height:72px;object-fit:contain}
.pt-icons__body{display:grid;gap:6px}
.service-lp .pt-icons h3{color:#fff;font-size:20px;font-weight:700;line-height:1.4}

/* 紹介と再販 今のLPの強みのカードを使う */
.service-lp .pt-plans .p-strengths__item-head .title{font-size:clamp(20px,1.9vw,26px)}
.service-lp .pt-plans .p-strengths__item-wrap{gap:24px;padding:24px 28px 24px 104px}

/* 表 */
/* 表 案B: 列の見出しは STEP の金属の矢羽根 行の見出しに金属の丸の番号 */
.pt-table table{width:100%;border-collapse:separate;border-spacing:0 10px;margin-top:-10px}
.pt-table thead th{padding:0 0 0 10px}
.pt-table thead th:first-child{padding:0}
.pt-table thead .lp-step{height:44px;font-size:17px}
.pt-table tbody :is(th,td){padding:20px 22px;background:var(--lp-card,#252525);color:#fff;font-size:28px;font-weight:700;line-height:1.4;text-align:center;vertical-align:middle}
.pt-table tbody th{border-radius:20px 0 0 20px;font-size:17px;text-align:left}
.pt-table tbody td:last-child{border-radius:0 20px 20px 0}
.pt-table tbody td:nth-child(3){background:#2f2f2f}
.pt-table__label{display:flex;align-items:center;gap:14px}
.pt-table__label .lp-num{width:40px;height:40px;font-size:18px}
.pt-table td.is-text{font-size:17px}

/* 言い切り */
.pt-statement{padding:clamp(40px,4vw,56px) 0;background:var(--lp-bg)}
.service-lp .pt-statement .lp-about__bold{margin:0;text-align:center;word-break:auto-phrase}
.service-lp .pt-reason+.lp-about__bold{margin-top:44px}
.pt-reason li{align-content:start}
.service-lp .pt-reason h3{font-size:clamp(16px,1.25vw,18px);word-break:auto-phrase}.service-lp .pt-reason p{font-size:16px}

/* 流れ */
.pt-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr;gap:12px;list-style:none;padding:0}
.pt-flow li{display:grid;align-content:start;gap:12px;text-align:center;padding:0 0 22px;border:1px solid var(--lp-line);border-radius:16px;background:var(--lp-card);overflow:hidden}
.pt-flow .lp-step{height:40px}
.service-lp .pt-flow h3{padding-inline:16px;color:#fff;font-size:18px;font-weight:700}
.service-lp .pt-flow p{padding-inline:16px;color:var(--lp-text);font-size:15px;line-height:1.7}

/* 申し込みを促す段 */
.pt-cta{padding-bottom:clamp(40px,4vw,56px)}
.pt-cta .lp-cta{margin-top:0}

/* 右に固定するフォーム */
.service-lp .pt-aside__form .grtx-contact__form-inner{padding:22px 24px;border:1px solid var(--lp-line);border-radius:var(--lp-radius);background:#1b1a1bf2;box-shadow:0 24px 60px #000a}
.service-lp .pt-aside__form .grtx-choice{display:flex;flex-direction:column;gap:8px;margin:4px 0 0;padding:0;border:0}
.service-lp .pt-aside__form .grtx-choice legend{margin-bottom:6px;font-size:14px}
.service-lp .pt-aside__form .grtx-choice label{display:flex;align-items:center;gap:8px;font-size:15px}
.service-lp .pt-aside__form .grtx-check--partner{margin-top:18px}
body .pt-aside__form form [data-contact-verification] [data-verification-widget]{min-height:0}
body .pt-aside__form form [data-contact-verification]{margin:6px 0!important}

/* 金属の枠は大きさ0の要素で描けないため 固定ボタンは消さずに画面の外へ逃がす */
.service-lp .pt-sticky,.service-lp .pt-sticky[hidden]{display:block!important;position:fixed;inset:auto 0 0;z-index:45;padding:10px 16px max(10px,env(safe-area-inset-bottom));border-top:1px solid var(--lp-line);background:#131213eb;transition:transform .25s}
.service-lp .pt-sticky[hidden]{transform:translateY(120%);visibility:hidden}

@media(min-width:769px){.service-lp .pt-sticky,.service-lp .pt-sticky[hidden]{transform:translateY(120%);visibility:hidden}}
@media(min-width:1021px){
 .pt-inner,.pt-hero__inner{padding-right:calc(var(--pt-pad) + var(--pt-form) + var(--pt-gap))}
 .pt-aside{position:absolute;inset:0;z-index:5;pointer-events:none}
 .pt-aside__frame{box-sizing:border-box;display:flex;justify-content:flex-end;max-width:1280px;height:100%;margin:0 auto;padding:96px var(--pt-pad) 48px}
 .pt-aside__form{position:sticky;top:112px;align-self:flex-start;width:var(--pt-form);max-height:calc(100vh - 124px);overflow:auto;pointer-events:auto;scrollbar-width:thin}
}
@media(max-width:1020px){
 .pt-aside__frame{padding:0 var(--pt-pad) 64px;background:var(--lp-bg)}
 .pt-aside__form{max-width:620px;margin:0 auto}
 .pt-hero__inner .pt-hero__laptop{margin:0 auto}
}
@media(max-width:768px){
 .pt-hero__inner{padding-top:92px;padding-bottom:32px}
 .service-lp .pt-hero h1{font-size:min(7.4vw,34px)}
 .pt-page .lp-band{padding:48px 0}
 .pt-page .home-section-heading{min-height:110px;margin-bottom:24px}
 .pt-statement{padding:32px 0}
 .service-lp .pt-statement .lp-about__bold{font-size:min(5vw,22px)}
 .pt-logos{padding-inline:0}
 /* 画像のカードは画像を消して丸の番号にする 番号は縦の真ん中 */
 .pt-cards{grid-template-columns:minmax(0,1fr);grid-auto-rows:1fr;gap:12px}
 .pt-cards img{display:none}
 .pt-cards__num{display:inline-grid!important}
 .pt-cards>li{flex-direction:row;align-items:center;gap:16px;padding:18px 20px}
 .service-lp .pt-cards h3, .service-lp :is(.pt-cards,.pt-icons) p{font-size:15px;line-height:1.7}
 .pt-cards__body{gap:6px}
 .pt-worries,.pt-worries:has(>li:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .pt-worries li{padding:16px 10px;border-radius:22px}
 .pt-worries img{width:56px;height:56px}
 .service-lp .pt-worries p{font-size:15px;line-height:1.5;word-break:auto-phrase;text-wrap:balance}.pt-worries p br{display:none}
 .pt-icons{grid-template-columns:minmax(0,1fr);grid-auto-rows:1fr;gap:12px}
 .pt-icons li{grid-template-columns:56px minmax(0,1fr);gap:14px;padding:16px 18px}
 .pt-icons__mark{width:56px;height:56px}
 .service-lp .pt-icons h3{font-size:18px}
 .service-lp .pt-plans .p-strengths__item-wrap{padding:20px}
 .pt-flow{grid-template-columns:minmax(0,1fr);grid-auto-rows:1fr}
 .pt-table thead th{padding-left:6px}
 .pt-table thead .lp-step{height:36px;font-size:14px}
 .pt-table tbody :is(th,td){padding:14px 6px;font-size:16px;word-break:auto-phrase}
 .pt-table tbody th{padding-left:10px}
 .pt-table tbody th{border-radius:16px 0 0 16px;font-size:14px}
 .pt-table tbody td:last-child{border-radius:0 16px 16px 0}
 .pt-table td.is-text{font-size:13px}
 .pt-table__label{gap:8px;word-break:auto-phrase}
 .pt-table__label .lp-num{width:28px;height:28px;font-size:14px}
 .service-lp .pt-sticky a.lp-cta__button{min-height:56px;padding:0 20px;font-size:16px}
 .pt-sticky .metal-fx-root{width:100%}
}