/* AXの基本文字組みと、業務を示す線画。場面の配置はscene.cssで管理する。 */
.ax-prototype{--ax-ink:#1F2C3A;--ax-teal:var(--teal);--ax-blue:var(--aqua);--ax-pink:var(--pink);--ax-pink-strong:#BC3F61;--ax-white:var(--paper);--ax-line:var(--line);--ax-gold:#F5CF6B;--ax-dark:#1D6B7E;color:var(--ax-ink);background:var(--ax-white);overflow-x:clip}
.ax3-main{font-family:var(--font-site);overflow:visible}
.ax3-main *,.ax3-dialog *{box-sizing:border-box}
.ax3-main section[id],.ax3-main article[id],.ax3-main div[id]{scroll-margin-top:100px}
.ax3-wrap{width:min(1180px,calc(100% - 40px));margin-inline:auto}
.ax3-main p{margin:0 0 22px;font-size:16px;line-height:1.9;letter-spacing:.01em}
.ax3-main p:last-child{margin-bottom:0}
.ax3-main h1,.ax3-main h2,.ax3-main h3,.ax3-main h4{color:inherit;letter-spacing:-.035em;line-height:1.4}
.ax3-main h1{font-size:clamp(36px,8vw,66px);font-weight:900;line-height:1.29}
.ax3-main h1 span,.ax3-main h2 span{display:inline-block}
.ax3-main h2{font-size:clamp(32px,5.4vw,59px)}
.ax3-main h3{font-size:clamp(23px,3vw,34px)}
.ax3-main h4{font-size:19px}
.ax3-phrase{display:inline-block;max-width:100%}
.ax3-main .ax3-label{margin-bottom:16px;color:#BC3F61;font-size:13px;font-weight:800;letter-spacing:.07em}
.ax3-main .ax3-note{font-size:14px;line-height:1.8}
.ax3-main .ax3-lead{max-width:860px;margin-bottom:52px}
.ax3-heading{max-width:960px;margin-bottom:36px}
.ax3-section{padding-block:78px}
.ax3-main a{color:inherit}
.ax3-main .ax3-button,.ax3-dialog .ax3-button{display:inline-flex;align-items:center;justify-content:center;flex-wrap:wrap;min-height:54px;padding:13px 24px;border:1px solid var(--ax-pink-strong);border-radius:999px;background:var(--ax-pink-strong);color:#fff;text-align:center;text-decoration:none;font-size:15px;font-weight:700;line-height:1.6;cursor:pointer}
.ax3-main .ax3-button:hover,.ax3-dialog .ax3-button:hover{filter:brightness(.88)}
.ax3-main .ax3-link{display:inline-flex;align-items:center;min-height:44px;padding-block:6px;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px;font-size:15px;font-weight:700;line-height:1.5}
.ax3-main .ax3-link:hover{color:#BC3F61}
.ax3-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;margin-top:28px}
.ax3-hero-title .ax3-note{margin-top:12px}
.ax3-main :focus-visible,.ax3-dialog :focus-visible{outline:3px solid var(--ax-pink);outline-offset:5px}

/* 資料棚から業務画面へ。同じ仕事の場面の中で、見る位置を変える。 */
.ax3-opening{position:relative;isolation:isolate;background:var(--ax-white)}
.ax3-opening-track{position:relative}
.ax3-opening-pin{position:relative;background:var(--ax-white);overflow:clip}
.ax4-paper-field{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.ax3-opening-world{position:relative;display:grid;gap:80px;padding:150px 0 80px}
.ax3-opening-scene{position:relative;display:grid;grid-template-columns:minmax(0,1fr);align-items:center;gap:28px;min-width:0}
.ax3-scene-copy{position:relative;z-index:3;min-width:0}
.ax3-scene-copy .ax3-label{margin-bottom:16px}
.ax3-scene-copy h2{font-size:clamp(32px,4.5vw,58px);line-height:1.38;font-weight:800}
.ax3-scene-copy h3{font-size:clamp(26px,3vw,38px);line-height:1.4}
.ax3-scene-copy p{max-width:570px}
.ax3-scene-step{margin-top:30px}
.ax3-scene-step .ax3-label{margin-bottom:10px}
.ax3-scene-step p{margin-top:20px}
.ax3-hero-title h1{font-weight:900;color:var(--ax-ink);font-size:clamp(40px,4.3vw,62px);letter-spacing:-.045em;line-height:1.38}
.ax3-hero-title h1 span{display:block}
.ax3-hero-title .ax3-actions{margin-top:28px}
.ax3-scene-intro{margin-top:24px}
.ax3-scene-intro p{font-size:16px;line-height:1.85}
.ax3-scene-context{margin-top:20px;font-size:16px;line-height:1.85}
.ax3-opening-scene--source .ax3-scene-step{margin-top:24px}
.ax3-scene-art{position:relative;width:100%;height:300px;min-width:0}
.ax4-static-art{display:block;width:100%;height:100%;object-fit:contain}
.ax4-art-viewport{display:none}
.ax4-workspace{display:block;width:100%;height:100%;overflow:visible;transform-origin:64% 53%}
.ax4-workspace text{fill:var(--ax-ink);stroke:none;font:700 17px var(--font-site)}
.ax4-workspace .ax4-screen-input text:last-child{fill:white;font-size:13px}
.ax4-source-docs{transform-origin:180px 370px}
.ax4-verification{transform-origin:542px 304px;opacity:0}
.ax4-screen-output{opacity:0}
.ax4-checkmarks{stroke-dasharray:34;stroke-dashoffset:34}
.ax3-opening-after{padding:74px 0 88px;background:var(--ax-white)}
.ax3-opening-explainer{max-width:900px}
.ax3-opening-explainer p{margin-bottom:22px}
.ax3-conditions{max-width:900px;margin-top:30px}
.ax3-conditions .ax3-link{margin-top:18px}
@media(min-width:700px){
  .ax3-opening-scene{grid-template-columns:minmax(0,48fr) minmax(0,52fr);gap:42px;min-height:570px}
  .ax3-scene-art{height:430px}
  .ax3-opening-after>.ax3-wrap{display:grid;grid-template-columns:1fr 1fr;gap:70px}
  .ax3-conditions{margin:0}
}
@media(min-width:700px) and (max-width:1199px){
  .ax3-opening-world{gap:84px;padding-top:140px}
  .ax3-opening-scene{grid-template-columns:1fr;gap:30px;min-height:0}
  .ax3-scene-copy{max-width:740px}
  .ax3-scene-art{width:min(100%,700px);height:380px}
  .ax3-main h1{font-size:clamp(43px,5.6vw,64px)}
}
@media(max-width:699px){
  .ax3-opening-world{gap:64px;padding:110px 0 65px}
  .ax3-opening-scene{gap:24px}
  .ax3-scene-art{height:235px}
  .ax3-scene-copy h2{font-size:31px}
  .ax3-scene-copy h3{font-size:26px}
  .ax3-hero-title h1{font-size:clamp(32px,8.7vw,36px)}
  .ax3-scene-step{margin-top:20px}
  .ax3-scene-step p{font-size:16px;line-height:1.8}
  .ax3-scene-intro{margin-top:20px}
  .ax3-scene-intro p{font-size:16px;line-height:1.8}
  .ax3-hero-title .ax3-actions{align-items:flex-start;gap:6px;margin-top:20px}
  .ax3-hero-title .ax3-actions .ax3-link{font-size:14px}
  .ax3-hero-title .ax3-note{margin-top:7px;font-size:13px}
  .ax3-opening-after{padding:54px 0 65px}
  .ax4-paper-field{width:170%;left:-70%;opacity:.7}
}

/* 比較のために料金を静止させる。 */
.ax3-plans{position:relative;background:#fff}
.ax3-plans .ax3-heading{margin-bottom:25px}
.ax3-subtitle{margin:54px 0 22px}
.ax3-entry{display:grid;gap:22px;margin-bottom:38px}
.ax3-entry article{padding-top:15px;border-top:1px solid var(--ax-line)}
.ax3-entry h4{margin-bottom:12px}
.ax3-entry p{font-size:15px}
.ax3-rates{display:grid;gap:0;margin:40px 0 0;border-top:2px solid var(--ax-ink);border-bottom:1px solid var(--ax-line)}
.ax3-rates>div{padding:20px 0}
.ax3-rates>div+div{border-top:1px solid var(--ax-line)}
.ax3-rates>div>p:first-child{margin-bottom:7px;font-size:14px;font-weight:700}
.ax3-main .ax3-amount,.ax3-main .ax3-plan-amount{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 5px;line-height:1.3;margin:0}
.ax3-amount b{font-size:39px;letter-spacing:-.055em}
.ax3-amount .ax3-price-value{display:inline-flex;align-items:baseline;gap:5px}
.ax3-amount .ax3-price-value>span{font-size:16px}
.ax3-amount small,.ax3-plan-amount small{font-size:13px}
.ax3-rates+.ax3-note{margin:13px 0 30px}
.ax3-plan-index{display:none}
.ax3-plan-grid{display:block;border-top:2px solid var(--ax-ink)}
.ax3-main .ax3-plan-group-title{padding:15px 22px;background:var(--ax-dark);color:#fff;font-size:23px;font-weight:800;letter-spacing:0}
.ax3-plan-group-title:not(:first-child){margin-top:30px}
.ax3-plan{position:relative;padding:30px 22px 34px;border-bottom:1px solid var(--ax-line);background:var(--ax-blue)}
.ax3-plan:nth-of-type(even){background:#fff}
.ax3-plan .ax3-label{margin-bottom:12px;color:var(--ax-dark);font-size:38px;font-weight:900;line-height:1.1;letter-spacing:-.07em}
.ax3-plan h3{margin-bottom:10px;font-size:25px}
.ax3-plan-target{margin-bottom:15px!important;font-size:14px!important;font-weight:700;color:var(--ax-dark)}
.ax3-plan>p:not(.ax3-label):not(.ax3-plan-amount):not(.ax3-plan-target){font-size:15px}
.ax3-plan ul{margin:15px 0;padding-left:1.2em;font-size:14px;line-height:1.8}
.ax3-plan-amount{margin:5px 0 15px!important}
.ax3-plan-amount b{font-size:28px}
.ax3-plan-amount span{font-size:15px}
.ax3-plan .ax3-link{margin-top:3px}
.ax3-guard{margin:27px 0!important}
.ax3-plan-scope{padding-top:28px;border-top:1px solid var(--ax-line)}
.ax3-plan-scope h3{margin-bottom:14px;font-size:23px}
.ax3-plan-scope p{font-size:15px}
.ax3-plans>.ax3-wrap>.ax3-actions{margin-top:36px}

/* 3つの実装物は外形・操作とも別の図にする。 */
.ax3-outputs{overflow:visible;background:var(--ax-white)}
.ax3-outputs .ax3-story-copy{display:grid;gap:27px}
.ax3-outputs .ax3-beat{display:grid;gap:20px;padding:27px 0;border-top:1px solid color-mix(in srgb,var(--ax-ink) 21%,transparent)}
.ax3-outputs .ax3-beat h3{max-width:640px}
.ax3-outputs .ax3-beat p{max-width:630px}
.ax3-outputs .ax3-story-copy>.ax3-note{padding-top:5px}
.ax3-output-art{min-width:0;min-height:265px;display:flex;align-items:center;justify-content:center}
.ax3-rule-sheet{width:min(420px,94%);min-height:245px;padding:23px 26px;border:1.5px solid var(--ax-ink);background:var(--ax-white);transform:rotate(-3deg);box-shadow:none}
.ax3-art-top{display:flex;justify-content:space-between;gap:12px;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid var(--ax-ink);font-size:13px;font-weight:800}
.ax3-art-top span{color:#BC3F61}
.ax3-rule-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--ax-line);font-size:12px;font-weight:700}
.ax3-rule-mark{display:block;width:18px;height:18px;border-radius:50%}
.ax3-rule-mark--yes{background:var(--ax-teal)}
.ax3-rule-mark--maybe{background:#F5CF6B}
.ax3-rule-mark--no{background:var(--ax-pink)}
.ax3-rule-foot{margin-top:12px;font-size:11px;font-weight:700;color:var(--ax-dark)}
.ax3-screen{width:min(475px,100%);border:1.5px solid var(--ax-ink);border-radius:4px;background:var(--ax-white);box-shadow:none}
.ax3-screen-top{display:flex;align-items:center;gap:5px;height:31px;padding:0 10px;border-bottom:1px solid var(--ax-ink);background:color-mix(in srgb,var(--ax-pink) 10%,var(--ax-white))}
.ax3-screen-top i{width:6px;height:6px;border-radius:50%;background:var(--ax-pink)}
.ax3-screen-top span{margin-left:auto;font-size:10px;font-weight:800}
.ax3-screen-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px}
.ax3-screen-grid>div{display:flex;flex-direction:column;gap:7px;min-height:190px;padding:13px;border:1px solid var(--ax-line)}
.ax3-screen-grid>div>span{font-size:11px;font-weight:800}
.ax3-screen-grid i{height:9px;border:1px solid var(--ax-line);border-radius:2px}
.ax3-screen-grid i:nth-of-type(2){width:76%}
.ax3-screen-grid b{width:45%;height:13px;margin-top:auto;background:var(--ax-teal)}
.ax3-screen-result{background:var(--ax-blue)}
.ax3-screen-result i{height:5px;border:0;background:color-mix(in srgb,var(--ax-ink) 30%,transparent)}
.ax3-guide-book{display:flex;width:min(345px,92%);min-height:270px;border:1.5px solid var(--ax-ink);border-radius:1px 9px 9px 1px;background:var(--ax-white);transform:rotate(4deg);box-shadow:none}
.ax3-guide-spine{width:18px;flex:none;border-right:1px solid var(--ax-ink);background:color-mix(in srgb,var(--ax-pink) 27%,var(--ax-white))}
.ax3-guide-content{flex:1;padding:24px}
.ax3-guide-content small{display:block;margin-bottom:4px;color:#BC3F61;font-size:10px;font-weight:800}
.ax3-guide-content strong{display:block;padding-bottom:12px;border-bottom:1px solid var(--ax-ink);font-size:17px}
.ax3-guide-content>div{display:flex;gap:8px;padding:12px 0;border-bottom:1px solid var(--ax-line);font-size:12px;font-weight:700}
.ax3-guide-content b{color:var(--ax-teal)}

/* 比較と利用の記録は紙の追従を止め、情報の差を読ませる。 */
.ax3-change{overflow:clip;background:var(--ax-dark);color:#fff}
.ax3-change>h3,.ax3-measurement>h3{width:min(1180px,calc(100% - 40px));margin:0 auto 28px;font-size:clamp(30px,4.5vw,50px)}
.ax3-change>p,.ax3-measurement>p,.ax3-change>.ax3-comparison,.ax3-measurement>.ax3-record-flow,.ax3-measurement>.ax3-actions{width:min(1180px,calc(100% - 40px));margin-inline:auto}
.ax3-change>p{max-width:1180px}
.ax3-comparison{margin-block:30px 26px!important;padding:0 14px;background:var(--ax-blue);color:var(--ax-ink)}
.ax3-comparison-head{display:none}
.ax3-compare-row{display:grid;grid-template-columns:1fr 1fr;padding:18px 0;border-bottom:1px solid var(--ax-line)}
.ax3-compare-row:last-child{border-bottom:0}
.ax3-compare-row h4{grid-column:1 / -1;margin-bottom:8px;font-size:18px}
.ax3-compare-row>div{min-width:0;padding:9px 8px;margin:0}
.ax3-compare-row>div small{display:block;margin-bottom:6px;font-size:11px;font-weight:800}
.ax3-compare-row>div p{font-size:14px;line-height:1.6}
.ax3-before{border:0}
.ax3-after{border-left:1px solid var(--ax-line)}
.ax3-measurement{background:#fff}
.ax3-record-flow{display:grid;gap:12px;margin-block:32px!important}
.ax3-record-flow>div{display:flex;flex-direction:column;gap:19px;min-height:180px}
.ax3-record-flow>div>span{font-size:16px;font-weight:800}
.ax3-record-flow .ax3-record{width:100%;padding:23px;background:var(--ax-blue);border-top:1.5px solid var(--ax-dark)}
.ax3-record-flow .ax3-revision{width:87%;justify-self:center;padding:21px 18px;border:1.5px solid var(--ax-ink);background:var(--ax-white);box-shadow:10px 12px 25px color-mix(in srgb,var(--ax-ink) 8%,transparent);transform:rotate(-2deg)}
.ax3-record-flow .ax3-next-task{width:70%;justify-self:center}
.ax3-record-line{width:38px;height:38px;justify-self:center;transform:rotate(90deg);stroke:var(--ax-teal);fill:none;stroke-width:2}
.ax3-ledger{display:grid;grid-template-columns:1fr 1fr;gap:9px;font-size:12px}
.ax3-ledger i{font-style:normal}
.ax3-ledger b{height:14px;background:#fff}
.ax3-ledger b:nth-of-type(2),.ax3-ledger b:nth-of-type(4){background:var(--ax-dark)}
.ax3-mini-form{display:grid;gap:7px}
.ax3-mini-form small{font-size:12px}
.ax3-mini-form i{height:17px;background:var(--ax-blue)}
.ax3-mini-form i:nth-of-type(3){background:var(--ax-pink)}
.ax3-next-docs{display:flex;gap:9px}
.ax3-next-docs i{position:relative;width:70px;height:92px;background:var(--ax-blue);border:1.5px solid var(--ax-ink);transform:rotate(-7deg)}
.ax3-next-docs i+ i{background:#fff5d9;transform:rotate(7deg)}
.ax3-next-docs i::before{content:"";position:absolute;top:20px;left:11px;right:11px;height:35px;border-top:1.5px solid var(--ax-line);border-bottom:1.5px solid var(--ax-line)}
.ax3-measurement .ax3-actions{margin-top:24px}

/* 対象業務ごとに小さな固有図を置く。 */
.ax3-scope{background:#fff}
.ax3-scope .ax3-story-copy{display:grid;gap:20px}
.ax3-scope .ax3-beat{padding:24px 0;border-top:1px solid var(--ax-line)}
.ax3-scope .ax3-beat h3{font-size:21px}
.ax3-scope-figure{position:relative;width:220px;height:150px;margin-bottom:24px}
.ax3-scope-figure--compare{display:flex;gap:14px}
.ax3-scope-figure--compare div{width:95px;padding:18px 12px;border:1.5px solid var(--ax-ink);transform:rotate(-5deg);background:var(--ax-blue)}
.ax3-scope-figure--compare div+div{transform:rotate(5deg);background:#fff}
.ax3-scope-figure--compare i,.ax3-scope-figure--extract i,.ax3-scope-figure--write i{display:block;height:5px;margin:13px 0;background:color-mix(in srgb,var(--ax-ink) 28%,transparent)}
.ax3-scope-figure--compare b{position:absolute;right:-2px;bottom:5px;padding:8px 11px;background:#fbe7ed;color:#BC3F61;font-size:13px}
.ax3-scope-figure--extract div{width:173px;height:132px;padding:16px 21px;border:1.5px solid var(--ax-ink);border-radius:2px;background:var(--ax-white)}
.ax3-scope-figure--extract i:nth-child(3){height:16px;background:#fff0b9}
.ax3-scope-figure--extract b{position:absolute;right:0;bottom:2px;padding:9px;background:var(--ax-blue);font-size:12px}
.ax3-scope-figure--write div{width:185px;height:132px;padding:20px;border:1.5px solid var(--ax-ink);background:var(--ax-white)}
.ax3-scope-figure--write i{height:24px;border-bottom:1px solid var(--ax-ink);background:none}
.ax3-scope-figure--write b{position:absolute;bottom:0;right:-3px;color:#BC3F61;font-size:12px}
.ax3-industry{margin-top:45px;padding-top:30px;border-top:1px solid var(--ax-ink)}
.ax3-industry h3{margin-bottom:15px}
.ax3-industry p{max-width:800px}

/* FAQと相談は通常フローの独立した面。 */
.ax3-faq{background:var(--ax-blue)}
.ax3-faq-wrap{max-width:900px}
.ax3-questions{border-top:1px solid color-mix(in srgb,var(--ax-ink) 40%,transparent)}
.ax3-questions details{border-bottom:1px solid color-mix(in srgb,var(--ax-ink) 40%,transparent)}
.ax3-questions summary{position:relative;padding:22px 38px 22px 0;list-style:none;cursor:pointer;font-size:16px;font-weight:700;line-height:1.7}
.ax3-questions summary::-webkit-details-marker{display:none}
.ax3-questions summary::after{content:"＋";position:absolute;right:0;top:21px;color:#BC3F61;font-size:20px}
.ax3-questions details[open] summary::after{content:"−"}
.ax3-questions details>p{padding:0 27px 24px 0;font-size:15px}
.ax3-contact{background:var(--ax-blue);color:var(--ax-ink)}
.ax3-contact-grid{display:block;max-width:760px}
.ax3-contact header{margin-bottom:44px}
.ax3-contact header h2{margin-bottom:25px;font-size:clamp(30px,4.7vw,48px)}
.ax3-contact header>p{font-size:15px}
.ax3-contact .ax3-label{color:#BC3F61}
.ax3-contact-art{display:block;width:160px;height:100px;margin:0 auto 34px;color:var(--ax-dark)}
.ax3-contact-art line,.ax3-contact-art path,.ax3-contact-art rect{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ax3-contact-art .ax3-contact-art-paper{fill:var(--ax-white)}
.ax3-phone{margin-top:26px!important}
.ax3-phone a{display:block;margin:5px 0;font-size:26px;font-weight:800;line-height:1.5;text-decoration:none}
.ax3-phone small{font-size:13px}
.ax3-contact-jump{display:none}
.ax3-form-anchor{display:block;scroll-margin-top:104px}
.ax3-form{display:grid;gap:22px;padding:28px 24px;border:1px solid var(--ax-line);border-radius:3px;background:var(--ax-white);color:var(--ax-ink)}
.ax3-form label{display:block;font-size:15px;font-weight:700;line-height:1.7}
.ax3-form label>small{margin-left:8px;color:#465c70;font-size:12px;font-weight:500}
.ax3-form input:not([type=checkbox]),.ax3-form select,.ax3-form textarea{display:block;width:100%;min-width:0;margin-top:8px;padding:12px;border:1px solid #8495a6;border-radius:6px;background:#fff;color:var(--ax-ink);font:400 16px/1.6 var(--font-site)}
.ax3-form textarea{min-height:140px;resize:vertical}
.ax3-field-help{display:block;margin-top:7px;font-size:12px;font-weight:400}
.ax3-form .ax3-agree{display:flex;align-items:flex-start;gap:8px;font-size:13px}
.ax3-agree input{flex:0 0 18px;width:18px;height:18px;margin-top:3px;accent-color:var(--ax-teal)}
.ax3-agree span{flex:1}
.ax3-agree a{text-decoration:underline;text-underline-offset:3px}
.ax3-form .ax3-note{font-size:12px}
.ax3-form .ax3-button{width:100%}
.ax3-dock{position:fixed;z-index:45;bottom:16px;right:50%;transform:translateX(50%);display:none;gap:4px;padding:4px;border:1px solid var(--ax-line);border-radius:99px;background:#fff;box-shadow:0 6px 18px #1f2c3a18}
.ax3-dock a{display:flex;align-items:center;justify-content:center;padding:10px 15px;border-radius:99px;font-size:12px;font-weight:700;text-align:center;line-height:1.4}
.ax3-dock a:last-child{background:var(--ax-pink-strong);color:#fff}
.ax3-dock.is-hidden{display:none}
.ax3-dialog{width:min(650px,calc(100% - 32px));max-height:calc(calc(var(--motion-vh,1svh) * 100) - 40px);padding:28px;border:1px solid var(--ax-line);border-radius:16px;background:#fff;color:var(--ax-ink)}
.ax3-dialog::backdrop{background:#1f2c3a66}
.ax3-dialog h2{font-size:26px}
.ax3-dialog dl{margin:24px 0}
.ax3-dialog dt{margin-top:17px;font-size:13px;font-weight:700}
.ax3-dialog dd{margin:5px 0 0;overflow-wrap:anywhere;white-space:pre-wrap;font-size:15px;line-height:1.7}
.ax3-dialog>p{margin-bottom:20px;font-size:13px;line-height:1.8}
.ax-prototype .prototype-site-footer{padding-bottom:70px}

@media(min-width:700px){
  .ax3-wrap{width:min(1240px,calc(100% - 104px))}
  .ax3-section{padding-block:110px}
  .ax3-main p{font-size:17px}
  .ax3-entry{grid-template-columns:1fr 1fr;gap:45px}
  .ax3-rates{grid-template-columns:1fr 1fr}
  .ax3-rates>div{padding:25px 22px}
  .ax3-rates>div:first-child{padding-left:0}
  .ax3-rates>div+div{border-top:0;border-left:1px solid var(--ax-line)}
  .ax3-plan{display:grid;grid-template-columns:145px minmax(0,1fr) 35%;column-gap:26px;align-items:start;padding:38px 35px}
  .ax3-plan .ax3-label{grid-column:1;grid-row:1 / span 4;font-size:38px;line-height:1.1;letter-spacing:-.07em}
  .ax3-plan h3,.ax3-plan-target,.ax3-plan>p:not(.ax3-label):not(.ax3-plan-amount),.ax3-plan-amount{grid-column:2}
  .ax3-plan ul{grid-column:3;grid-row:1 / span 4;margin:0}
  .ax3-plan .ax3-link{grid-column:2;grid-row:5}
  .ax3-plan h3{margin-top:-4px}
  .ax3-outputs .ax3-beat{grid-template-columns:minmax(0,1fr) 43%;column-gap:58px;padding:47px 0}
  .ax3-outputs .ax3-beat h3,.ax3-outputs .ax3-beat p{grid-column:1}
  .ax3-output-art{grid-column:2;grid-row:1 / span 2;min-height:345px}
  .ax3-outputs .ax3-beat:nth-child(2) .ax3-output-art{grid-column:1}
  .ax3-outputs .ax3-beat:nth-child(2) h3,.ax3-outputs .ax3-beat:nth-child(2) p{grid-column:2}
  .ax3-change>h3,.ax3-measurement>h3,.ax3-change>p,.ax3-measurement>p,.ax3-change>.ax3-comparison,.ax3-measurement>.ax3-record-flow,.ax3-measurement>.ax3-actions{width:min(1240px,calc(100% - 104px))}
  .ax3-comparison-head,.ax3-compare-row{display:grid;grid-template-columns:25% 37.5% 37.5%}
  .ax3-comparison{padding:0;background:transparent;color:var(--ax-white)}
  .ax3-comparison-head{border-bottom:1px solid #ffffff55}
  .ax3-comparison-head span{padding:12px 20px;font-size:12px;font-weight:700}
  .ax3-compare-row{padding:0}
  .ax3-compare-row{border-bottom:1px solid #ffffff55}
  .ax3-compare-row h4{grid-column:auto;align-self:center;margin:0;padding:16px 16px 16px 0}
  .ax3-compare-row>div{display:flex;flex-direction:column;justify-content:center;margin:0;padding:18px 20px}
  .ax3-compare-row small{display:none!important}
  .ax3-before{border:1px solid #ffffff66}
  .ax3-after{border:0;background:var(--ax-blue);color:var(--ax-ink)}
  .ax3-record-flow{grid-template-columns:1.22fr 32px .92fr 32px .68fr;align-items:center}
  .ax3-record-line{align-self:center;transform:none}
  .ax3-scope .ax3-story-copy{grid-template-columns:repeat(3,1fr);gap:25px}
  .ax3-scope .ax3-beat{min-height:215px}
  .ax3-contact-grid{max-width:760px}
  .ax3-form{padding:38px}
  .ax3-dock:not(.is-hidden){display:flex}
}
@media(min-width:1024px){
  .ax3-plan{grid-template-columns:140px minmax(0,1fr) 34%}
}
@media(max-width:699px){
  .ax3-plans{padding-top:54px}
  .ax3-plan:nth-of-type(1){background:var(--ax-blue)}
  .ax3-plan:nth-of-type(2){background:color-mix(in srgb,var(--ax-gold) 25%,var(--ax-white))}
  .ax3-plan:nth-of-type(3){background:color-mix(in srgb,var(--ax-pink) 17%,var(--ax-white))}
  .ax3-plan:nth-of-type(4){background:var(--ax-dark);color:var(--ax-white)}
  .ax3-plan:nth-of-type(4) .ax3-label,.ax3-plan:nth-of-type(4) .ax3-plan-target{color:var(--ax-white)}
  .ax3-plan .ax3-label{font-size:48px}
  .ax3-record-line{display:none}
  .ax3-main .ax3-button{font-size:14px}
  .ax3-contact-grid{display:block}
  .ax3-contact header{margin-bottom:34px}
  .ax3-compare-row h4{font-size:17px}
}
@media(max-width:360px){
  .ax3-wrap{width:calc(100% - 32px)}
  .ax3-main h1{font-size:32px}
  .ax3-amount b{font-size:34px}
  .ax3-form{padding:23px 16px}
}
@media(prefers-reduced-motion:reduce){
  .ax3-main *,.ax3-main *::before,.ax3-main *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* 基本料金と助成金用の個別プランの案内を分ける。 */
.ax3-main #ax-subsidy{margin-top:40px}
.ax3-main #ax-subsidy h3{font-size:24px;line-height:1.5}
@media(max-width:699px){.ax3-main #ax-subsidy{margin-top:28px}.ax3-main #ax-subsidy h3{font-size:22px}}
