/* HP リニューアル（2026-10）追加CSS
   ベース base/css/style.css は書き換えず、足す分だけここに書く（後ろが優先）。
   色・書体はベースの値を使う：緑 #00bd60／#00a653／濃い緑 #172e21、書体 var(--display-font)・var(--body-font) */

/* ---- 共通：最初のアニメーションは1回だけ（デザイン担当の申し送り） ---- */
.intro-seen .intro{display:none!important}
.intro-seen .copy-text{animation:none!important;opacity:1!important;transform:none!important}
.intro-seen .copy-block{display:none!important}
.intro-seen .cinematic.ready h1,.intro-seen .hero.ready h1{animation:none!important}

/* ---- 共通：ボタンがリンクになった分（ベースは button） ---- */
a.cta-consult,a.cta-estimate{text-decoration:none;color:inherit}
a.phone-number{color:inherit;text-decoration:none}
.phone-hours{line-height:1.8}

/* ---- 共通：注記 ---- */
.rn-note{font-size:13px;line-height:1.8;color:#5f6f65;margin:18px 0 0}
.rn-note--center{text-align:center;padding:0 5%}

/* ---- TOP：よくある質問（新設・FAQページの部品を3問だけ） ---- */
.rn-top-faq{position:relative;z-index:8;background:#f2f2f2;padding:20px 3% 70px}
.rn-top-faq .lower-wrap{max-width:1320px;background:#fff;border-radius:32px;padding:70px 6% 60px}
.rn-top-faq .faq-intro{margin-bottom:30px}
.rn-top-faq .faq-intro h2{font-size:clamp(44px,5vw,75px)}
.rn-top-faq .lower-link{margin-top:30px}
@media(max-width:700px){.rn-top-faq{padding:10px 18px 50px}.rn-top-faq .lower-wrap{border-radius:24px;padding:44px 22px 36px}.rn-top-faq .faq-answer{padding:0 0 22px}}

/* ---- 共通：読み上げ専用・改行させない ---- */
.rn-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rn-nw{white-space:nowrap}

/* ---- 共通：比較表（HTMLの表・自社の列を色で強調）＝about「ONE WINDOW」・price「ほかの集客と比べてみると」 ---- */
.rn-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:40px 0 10px}
.rn-compare{width:100%;border-collapse:separate;border-spacing:0;font-size:16px;line-height:1.75;color:#192820;background:#fff}
.rn-compare th,.rn-compare td{padding:20px 22px;border-bottom:1px solid #d5dad6;text-align:left;vertical-align:top;font-weight:700}
.rn-compare thead th{font-size:15px;color:#526158;border-bottom:2px solid #21332a;padding-top:14px;padding-bottom:14px}
.rn-compare tbody th{width:22%;color:#17291d;font-weight:900}
.rn-compare .is-us{background:#e8f6ee;color:#0b4a2c;font-weight:900}
.rn-compare thead .is-us{background:#00bd60;color:#fff;border-radius:16px 16px 0 0;border-bottom-color:#00bd60;font-size:17px}
.rn-compare tbody tr:last-child .is-us{border-radius:0 0 16px 16px}
.rn-compare--2 td{width:39%}
@media(max-width:700px){.rn-compare{font-size:14px;min-width:560px}.rn-compare th,.rn-compare td{padding:14px 12px}.rn-compare tbody th{width:26%}}

/* ---- 下層：新設の短い節（ベースの lower-wrap を使う） ---- */
.rn-why{padding-bottom:40px}
.rn-why p{max-width:860px;font-size:18px}
.rn-onewindow{padding-top:40px}
.rn-tolink{padding-top:20px;padding-bottom:70px}
.rn-tolink p{font-size:18px;max-width:860px}
@media(max-width:700px){.rn-why p,.rn-tolink p{font-size:16px}}

/* ---- サービス：左右の案内（ベースは button。ページに分けたのでリンクにした・見た目は同じ） ---- */
.sv2-nav a{display:flex;align-items:center;gap:16px;width:100%;height:80px;padding:0 20px 0 28px;border:0;border-radius:8px;background:#fff;color:#143a29;text-align:left;text-decoration:none;transition:color .3s,box-shadow .3s}
.sv2-nav a:hover{color:#00a64f;box-shadow:0 8px 24px rgba(11,74,44,.08)}
.sv2-nav a[aria-current=page]{color:#00a64f;box-shadow:inset 0 0 0 2px #00a64f}
@media(max-width:700px){.sv2-nav a{height:64px;gap:10px;padding:0 14px}}
.sv2-head .sv2-crumb a,.sv2-mv .sv2-crumb a{color:inherit;text-decoration:none}

/* ---- サービス：お悩み・理由・進め方・料金の補足（ベースの sv2 部品に合わせた色と線） ---- */
.sv2-caps.rn-worry{margin-top:48px;margin-bottom:8px;border-style:solid;border-color:#cfe6d8;background:#f7fbf9}
.sv2-caps.rn-worry .sv2-caps-tag{background:#143a29}
.sv2-caps.rn-one ul{grid-template-columns:1fr}
.sv2-item dd .rn-ddlist{display:block;margin-top:10px;line-height:2}
.sv2-item dd .rn-ddnote{display:block;margin-top:8px;font-size:13px;color:#4c5d52}
.rn-reasons,.rn-steps{margin-top:48px;padding:28px 32px;border-radius:16px;background:#f2f7f4}
.rn-reasons-ttl{margin:0 0 14px;font-size:15px;font-weight:700;letter-spacing:.08em;color:#00a64f}
.rn-reasons ul,.rn-steps ol{margin:0;padding:0;list-style:none;display:grid;gap:14px}
.rn-reasons li,.rn-steps li{font-size:15px;line-height:1.85}
.rn-reasons li b,.rn-steps li b{display:block;font-size:16px;color:#143a29}
.rn-reasons li span,.rn-steps li span{display:block;font-weight:500;color:#33463b}
.rn-steps ol{counter-reset:st}
.rn-steps li{position:relative;padding-left:48px;counter-increment:st}
.rn-steps li::before{content:counter(st,decimal-leading-zero);position:absolute;left:0;top:0;font:700 22px/1.3 Roboto,Arial,sans-serif;color:#00a64f}
.sv2-cases .sv2-note{margin:14px 0 0;font-size:12px;color:#4c5d52}
.rn-more{margin:16px 0 0;text-align:right}
.rn-more a,.rn-pricenote a{color:#00a64f;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.rn-more a span{margin-left:6px}
.rn-pricenote{margin-top:40px;font-size:14px;font-weight:500;line-height:2}
.rn-pricenote p{margin:0}
@media(max-width:700px){.rn-reasons,.rn-steps{padding:20px 18px}.rn-steps li{padding-left:38px}.rn-steps li::before{font-size:18px}}

/* ---- できること（入口）：サービスのカード4枚（料金ページのカードと同じ緑の枠） ---- */
.rn-svc-top{padding-bottom:40px}
.rn-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:25px}
.rn-card{display:flex;flex-direction:column;gap:12px;padding:36px 38px;border:2px solid #00bd60;border-radius:22px;background:#fff;color:#143a29;text-decoration:none;transition:transform .3s,box-shadow .3s}
.rn-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px #00402218}
.rn-card-num{font-size:13px;font-weight:900;letter-spacing:.1em;color:#00a64f}
.rn-card-ttl{font-size:28px;line-height:1.5;font-weight:900}
.rn-card-txt{font-size:15px;line-height:2;font-weight:500}
.rn-card-price{margin-top:auto;padding-top:16px;border-top:1px solid #21332a;font-size:15px;font-weight:700}
.rn-card-more{display:flex;align-items:center;justify-content:flex-end;gap:10px;font-size:15px;font-weight:900;color:#00a64f}
.rn-card-more i{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#00a64f;color:#fff;font-style:normal}
@media(max-width:700px){.rn-cards{grid-template-columns:1fr;gap:16px}.rn-card{padding:26px 22px}.rn-card-ttl{font-size:22px}}

/* ---- 文章の折り返し：1文字だけ次の行に落ちるのを避ける ---- */
.rn-why p,.rn-tolink p,.rn-onewindow p,.rn-pricenote p,.rn-reasons li,.rn-steps li{word-break:auto-phrase;text-wrap:pretty}

/* ---- サービス案内の矢印：ページ移動なので右向きに ---- */
.sv2-nav a i{transform:rotate(-45deg);margin-top:0}

/* ---- コラム一覧：ベースは button。記事へのリンクにしたので同じ見た目を a に ---- */
.ed-ttl .ed-ttl-name{margin:0;font-size:42px;font-weight:700;line-height:1.4;letter-spacing:.05em;color:#143a29}
.ed-rank a{display:flex;align-items:flex-start;gap:14px;width:100%;color:#143a29;font-weight:700;font-size:14px;line-height:1.6;letter-spacing:.04em;text-align:left;text-decoration:none}
.ed-rank a:hover span{color:#00a64f}
.ed-rank-photo a{position:relative;display:block;padding-top:15px}
.ed-rank-photo a:hover .ed-rank-img svg{opacity:.7}
a.editorial-card,a.ed-pick,a.column-card{text-decoration:none;color:inherit}
@media(max-width:700px){.ed-ttl .ed-ttl-name{font-size:24px}}

/* ---- コラム記事（新設＝記事の型。ベースのコラム一覧と同じ緑・書体） ---- */
.rn-article{background:#f2f2f2}
.rn-article-inner{max-width:1380px;margin:0 auto;padding:140px 4% 100px}
.rn-art-crumb{margin:0 0 28px}
.rn-art-head{margin-bottom:28px}
.rn-art-cat{display:inline-block;margin:0 0 14px;padding:4px 18px;border-radius:99px;background:#00a64f;color:#fff;font-size:15px;font-weight:700}
.rn-article h1{position:static;margin:0;font-size:clamp(26px,3.2vw,40px);font-weight:900;line-height:1.55;letter-spacing:.03em;white-space:normal;text-shadow:none;animation:none;-webkit-text-stroke:0;color:#143a29}
.rn-art-meta{display:flex;gap:18px;margin:16px 0 0;font-size:15px;color:#5f6f65}
.rn-art-eye{border-radius:20px;overflow:hidden;aspect-ratio:1832/859;margin-bottom:40px}
.rn-art-eye img{display:block;width:100%;height:100%;object-fit:cover}
.rn-art-body{background:#fff;border-radius:24px;padding:56px 6%;color:#192820;font-size:18.5px;line-height:2.1;font-weight:500;letter-spacing:.03em}
.rn-art-body p{margin:0 0 1.2em;text-wrap:pretty}
.rn-art-body h2{scroll-margin-top:120px;margin:2.4em 0 .9em;padding:0 0 12px;border-bottom:3px solid #00bd60;font-size:clamp(23px,2.6vw,30px);line-height:1.6;font-weight:900;color:#143a29}
.rn-art-body h3{margin:1.9em 0 .6em;padding-left:14px;border-left:5px solid #00a64f;font-size:22px;line-height:1.6;font-weight:900;color:#143a29}
.rn-art-body ul{margin:0 0 1.4em;padding-left:1.3em}
.rn-art-body li{margin:.3em 0}
.rn-art-body a{color:#00843f;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.rn-art-body b{color:#143a29}
.rn-table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.8;min-width:560px}
.rn-table th,.rn-table td{padding:12px 14px;border:1px solid #d5dad6;text-align:left;vertical-align:top}
.rn-table thead th{background:#e8f6ee;color:#143a29;font-weight:900}
.rn-table tbody th{background:#f7fbf9;font-weight:900;white-space:nowrap}
.rn-art-body .rn-table-scroll{margin:0 0 1.6em}
.rn-art-body .faq-list{margin-bottom:2em}
.rn-art-body .faq-answer p{margin:0}
.rn-acta{margin:2.2em 0;padding:30px 28px;border-radius:20px;background:#00a64f;color:#fff}
.rn-acta-ttl{margin:0 0 6px!important;font-size:23px;font-weight:900;line-height:1.6}
.rn-acta>p{color:#fff}
.rn-acta-btns{display:grid;gap:12px;margin-top:16px}
.rn-acta-tel{display:flex;flex-direction:column;align-items:center;gap:2px;padding:18px 14px;border-radius:14px;background:#fff;color:#143a29!important;text-decoration:none!important;text-align:center}
.rn-acta-tel span{font-size:16px;font-weight:700;color:#00a64f}
.rn-acta-tel b{font-size:clamp(28px,4.4vw,40px);font-weight:900;line-height:1.3;color:#009f4d!important;letter-spacing:-.02em}
.rn-acta-tel small{font-size:14px;line-height:1.7;color:#4c5d52}
.rn-acta-form{display:flex;justify-content:center;align-items:center;gap:12px;min-height:68px;padding:12px 20px;border-radius:8px;background:var(--red,#f4433e);box-shadow:0 5px 0 rgba(0,0,0,.18);color:#fff!important;font-size:19px;font-weight:900;letter-spacing:.06em;text-decoration:none!important;transition:translate .15s,box-shadow .15s,filter .2s}
.rn-acta-form:hover{translate:0 2px;box-shadow:0 3px 0 rgba(0,0,0,.18);filter:brightness(1.05)}
.rn-acta-sub{display:inline-block;margin-top:14px;color:#fff!important;font-size:16px}
.rn-art-author{display:flex;gap:22px;align-items:flex-start;margin-top:40px;padding:28px;border-radius:20px;background:#fff}
.rn-art-author img{width:96px;height:96px;object-fit:cover;border-radius:50%;flex:none}
.rn-art-author p{margin:0 0 8px;font-size:16px;line-height:1.9}
.rn-art-author-name b{display:block;font-size:19px;color:#143a29}
.rn-art-author-name small{font-size:12px;color:#5f6f65}
.rn-art-author a,.rn-art-related a{color:#00843f;font-weight:700}
.rn-art-related{margin-top:24px;padding:24px 28px;border-radius:20px;background:#fff}
.rn-art-related-ttl{margin:0 0 8px;font-weight:900;color:#143a29}
.rn-art-related ul{margin:0;padding-left:1.2em;font-size:17px;line-height:2.1}
.rn-art-back{margin-top:40px;text-align:center}
@media(max-width:700px){.rn-article-inner{padding:110px 18px 70px}.rn-art-body{padding:34px 20px;font-size:17px;line-height:2}.rn-acta{padding:24px 18px}.rn-art-author{flex-direction:column;padding:22px}}

/* ---- 料金 ---- */
.rn-price{padding-bottom:40px}
.rn-plan4{grid-template-columns:1fr 1fr;margin-top:10px}
.rn-plan4 article{display:flex;flex-direction:column}
.rn-plan4 h3{margin:14px 0 4px}
.rn-plan4 h3 small{display:block;font-size:15px;letter-spacing:.04em}
.rn-plan4 strong{font-size:26px;font-weight:900}
.rn-plan4 strong small{display:block;font-size:14px;font-weight:700}
.rn-plan4 p,.rn-plan4 li{font-size:15px;line-height:1.9}
.rn-plan-points{margin:18px 0 0;padding-left:1.2em}
.rn-plan-sub{margin:20px 0 6px!important;font-weight:900}
.rn-plan-incl{margin:0;padding-left:1.2em;font-weight:500}
.rn-get{padding-top:60px}
.rn-goal{margin:0 0 56px}
.rn-goal h3{display:flex;align-items:center;gap:14px;margin:0 0 14px;font-size:clamp(22px,2.6vw,30px);line-height:1.5}
.rn-goal h3 span{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:50%;background:#00bd60;color:#fff;font-size:22px}
.rn-goal-sub{margin:22px 0 0;font-weight:900;color:#00a64f}
.rn-compare--3 thead .is-us small{display:block;font-size:12px;font-weight:700}
.rn-dots{margin:10px 0 0;padding-left:1.2em;line-height:2}
.rn-promise-note{margin-top:28px;font-size:15px}
.rn-terms{padding-top:40px}
.rn-lead-link{margin:50px 0 0!important}

/* ---- 相談の流れ ---- */
.rn-flow-heading{margin-top:0}
.rn-flow-note{margin:30px 0 0;padding:20px 24px;border-radius:14px;background:#f2f7f4;font-size:15px}
.rn-promises{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.rn-promises .price-promise{margin-top:0}
.rn-promises .price-promise h3{font-size:21px;line-height:1.6;margin-bottom:8px}
@media(max-width:900px){.rn-promises,.rn-plan4{grid-template-columns:1fr}}

/* ---- 提案事例 ---- */
.rn-cs-cat{margin:6px 0 10px!important;font-size:13px;font-weight:700;color:#00a64f}
.rn-cs-txt{margin:0;font-size:15px;line-height:2}
.cs-result li b{color:#00a64f;font-size:1.15em}
.rn-cs-imgs{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:36px 0 0}
.rn-cs-imgs figure{margin:0}
.rn-cs-imgs img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:left top;border-radius:14px;border:1px solid #d5dad6;background:#fff}
.rn-cs-imgs figcaption{margin-top:8px;font-size:13px;font-weight:700;color:#4c5d52;text-align:center}
.rn-cs-link{margin:20px 0 0;text-align:right}
.rn-cs-link a{color:#00843f;font-weight:700;text-decoration:underline;text-underline-offset:3px}
@media(max-width:700px){.rn-cs-imgs{grid-template-columns:1fr}}

/* ---- 制作実績（今の本番のカード6枚を新しいデザインで） ---- */
.rn-work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 28px;margin:44px 0 50px}
.rn-work{display:block;color:#143a29;text-decoration:none}
.rn-work-img{position:relative;display:block;overflow:hidden;border-radius:16px;background:#efefef}
.rn-work-img img{display:block;width:100%;height:auto;transition:transform .6s}
a.rn-work:hover .rn-work-img img{transform:scale(1.04)}
.rn-work-more{position:absolute;right:12px;bottom:12px;padding:6px 14px;border-radius:99px;background:#00a64f;color:#fff;font-size:12px;font-weight:900;letter-spacing:.08em}
.rn-work-cat{display:inline-block;margin:14px 0 6px;padding:2px 12px;border:1px solid #00a64f;border-radius:99px;color:#00a64f;font-size:12px;font-weight:700}
.rn-work-ttl{display:block;font-size:16px;line-height:1.7}
.rn-works-btn{text-align:center}
.rn-works-btn a{display:inline-flex;text-decoration:none}
.rn-one-btn{grid-template-columns:1fr!important;max-width:480px;margin-left:auto;margin-right:auto}
@media(max-width:900px){.rn-work-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.rn-work-grid{grid-template-columns:1fr}}

/* ---- 会社概要：地図 ---- */
.rn-map{margin-top:24px;border-radius:20px;overflow:hidden;aspect-ratio:16/8;background:#e8eee9}
.rn-map iframe{display:block;width:100%;height:100%;border:0}
@media(max-width:700px){.rn-map{aspect-ratio:4/3}}

/* ---- 代表挨拶 ---- */
.rn-msg-list{font-size:17px;line-height:2.1}
.rn-profile{margin-top:70px}
.rn-profile .company-table{margin:20px 0 0}

/* ---- お問い合わせ ---- */
.rn-contact-phone{padding-top:60px;padding-bottom:60px}
.rn-reply{margin:8px 0 0!important;color:#00843f}
.rn-field{border:0;margin:0;padding:0}
.rn-field legend{font-weight:900;font-size:15px;margin-bottom:12px;padding:0}
.rn-hint{font-weight:500;font-size:13px;color:#5f6f65;margin-left:6px}
#inquiry-form .rn-opt{display:inline-flex;align-items:center;gap:10px;margin:0 22px 12px 0;font-weight:700;font-size:15px}
#inquiry-form .rn-opt input{display:inline-block;width:20px;height:20px;margin:0;accent-color:#00a64f}
#inquiry-form .rn-agree{display:flex}
#inquiry-form .rn-agree a{color:#00843f;text-decoration:underline}
.rn-err{color:#c62828;font-size:13px;margin:4px 0 0}
.rn-review-btns{display:flex;gap:16px;flex-wrap:wrap;margin-top:24px}
.rn-review-btns a.form-submit{text-decoration:none;display:inline-block}
.rn-btn-sub{background:#fff!important;color:#20352a!important;box-shadow:inset 0 0 0 2px #20352a}

/* ---- プライバシーポリシー／送信完了／404（別サイトの作りを踏襲・色と書体はこのサイト） ---- */
.rn-policy{max-width:960px;margin:0 auto;padding:150px 5% 110px;font-family:var(--body-font)}
.rn-policy-ttl{text-align:center;margin-bottom:44px}
.rn-policy-ttl p{margin:0;font:700 clamp(26px,3.4vw,38px)/1.3 var(--display-font);letter-spacing:.08em;color:#00a64f}
.rn-policy h1{position:static;margin:8px 0 0;font:700 16px/1.6 var(--display-font);white-space:normal;text-shadow:none;animation:none;-webkit-text-stroke:0;color:#143a29;letter-spacing:.1em}
.rn-policy-box{padding:48px 6%;border:2px solid #cfe6d8;border-radius:20px;background:#fff;font-size:15px;line-height:2.05;font-weight:500;color:#192820}
.rn-policy-box h2{margin:2em 0 .6em;padding-left:14px;border-left:5px solid #00a64f;font:700 18px/1.6 var(--display-font);color:#143a29}
.rn-policy-box p{margin:0 0 1em}
.rn-policy-box ul{margin:0 0 1em;padding-left:1.3em}
.rn-policy-box a{color:#00843f;word-break:break-all}
.rn-policy-box .company-table{margin:10px 0 20px}
.rn-policy-date{text-align:right;margin-top:24px!important}
.rn-card-page{background:#e8f6ee;padding:150px 20px 120px}
.rn-card-box{position:relative;max-width:760px;margin:0 auto;padding:60px 64px 54px;background:#fff;border-radius:6px;box-shadow:0 30px 80px rgba(0,0,0,.08);font-family:var(--body-font)}
.rn-card-box.is-wide{max-width:900px}
.rn-card-head{text-align:center;margin-bottom:32px}
.rn-card-en{margin:0 0 8px;font:700 15px/1.4 Roboto,Arial,sans-serif;letter-spacing:.22em;color:#00a64f}
.rn-card-jp{margin:0 0 10px;font-size:15px;font-weight:700;color:#00a64f;letter-spacing:.06em}
.rn-card-box h1{position:static;margin:0;font:700 clamp(26px,3.2vw,38px)/1.45 var(--display-font);white-space:normal;text-shadow:none;animation:none;-webkit-text-stroke:0;color:#143a29;text-wrap:balance}
.rn-card-body{margin:0 0 40px;text-align:center;font-size:16px;line-height:2;color:#4c5d52;font-weight:500;word-break:auto-phrase;text-wrap:pretty}
.rn-card-btns{display:flex;justify-content:center;gap:18px;flex-wrap:wrap}
.rn-card-btn{display:inline-flex;align-items:center;justify-content:center;min-width:230px;padding:17px 30px;border-radius:6px;font-weight:700;text-decoration:none;background:#00a64f;color:#fff;box-shadow:0 10px 24px rgba(0,166,79,.25)}
.rn-card-btn.is-sub{background:#fff;color:#00a64f;box-shadow:inset 0 0 0 2px #00a64f}
.rn-404-row{display:grid;grid-template-columns:1fr;gap:28px;align-items:start;margin-bottom:36px}
.rn-404-row p{margin:0;font-size:16px;line-height:2;color:#4c5d52;font-weight:500;word-break:auto-phrase;text-wrap:pretty}
.rn-404-nav{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(max-width:700px){.rn-404-nav{grid-template-columns:1fr 1fr}}
.rn-404-nav a{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:10px;background:#f2f7f4;color:#143a29;font-weight:700;text-decoration:none}
.rn-404-nav a::before{content:"›";display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#00a64f;color:#fff;font-size:15px}
.rn-404-tel{text-align:center;padding-top:26px;border-top:1px solid #e3ebe6;font-size:15px;line-height:1.9;color:#4c5d52}
.rn-404-tel a{display:block;margin-top:6px;font-size:clamp(28px,4vw,40px);font-weight:900;color:#009f4d;text-decoration:none}
@media(max-width:700px){.rn-policy{padding:110px 18px 70px}.rn-policy-box{padding:28px 20px}.rn-card-page{padding:110px 16px 70px}.rn-card-box{padding:40px 22px 36px}.rn-404-row{grid-template-columns:1fr;gap:24px}}

/* ---- 下層の白背景：ベースは #price・#faq・#company 等の id で白にしていた。URLごとに分けたページは同じ白をここで当てる ---- */
.subpage:not(.cs):not(.about-detail):not(.sv2):not(.rn-article):not(.rn-card-page):not(.editorial):not(.pcx-page):not(.flw-page):not(.wk-page):not(.wlp-page){background:#fff}

/* ==== 電話のCTA（共通部品 src/layout/cta.html）==========================================
   形＝お医者さん版のCTA（見出し・ボタン3つ・電話・左右の人物）。2026-10-15 案A：
   ・楕円の外側は透明。CTAを直前の欄に楕円の高さぶん重ねるので、角には直前の欄の色がそのまま見える（色の指定は要らない）
   ・CTAの地は薄い緑。曲線はお医者さん版と同じSVG（二次ベジェ M0 200 Q500 -200 1000 200）
   ・直前の欄の下には、楕円の高さぶんの余白を部品側で確保する（:has で直前の要素に当てる） */
:root{--rn-dome:130px;--rn-cta-bg:#e9f8ee}
@media(max-width:750px){:root{--rn-dome:75px}}
.rn-cta{position:relative;z-index:9;isolation:isolate;margin-top:calc(var(--rn-dome) * -1);padding-top:calc(var(--rn-dome) + 25px);text-align:center;color:#102b19;font-family:var(--display-font)}
.rn-cta::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-color:transparent;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 200' preserveAspectRatio='none'%3E%3Cpath d='M0 200 Q500 -200 1000 200Z' fill='%23e9f8ee'/%3E%3C/svg%3E"),linear-gradient(to bottom,transparent calc(var(--rn-dome) - 1px),var(--rn-cta-bg) calc(var(--rn-dome) - 1px));background-size:100% var(--rn-dome),100% 100%;background-position:top,top;background-repeat:no-repeat}
:has(+ .rn-cta){padding-bottom:calc(var(--rn-dome) + 60px)!important}
.rn-cta h2{position:static;margin:0 0 24px;font-size:clamp(30px,3vw,46px);line-height:1.55;font-weight:900;white-space:normal;text-shadow:none;animation:none;-webkit-text-stroke:0;color:#102b19}
.rn-cta-intro{padding:0 5% 55px}
.rn-cta-intro p{margin:0;font-size:17px;line-height:1.9;font-weight:500}
/* ボタン3つ */
.rn-cta-choices{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid #e0e0e0;overflow:hidden;text-align:left}
.rn-cta-choices a{display:flex;align-items:center;position:relative;gap:20px;padding:52px 7%;background:#fff;color:#303c30;text-decoration:none;isolation:isolate}
.rn-cta-choices a+a{border-left:1px solid #e0e0e0}
.rn-cta-choices a::before{content:"";position:absolute;inset:0;background:#f5f6f0;z-index:-1;transform:scaleX(0) skewX(-10deg);transform-origin:left;transition:transform .4s}
.rn-cta-choices a:hover::before{transform:scaleX(1.15) skewX(-10deg)}
.rn-cta-choices strong{display:block;font-size:clamp(15px,1.35vw,23px)}
.rn-cta-choices small{display:block;margin-top:8px;font-size:13px;color:#92978f;letter-spacing:.07em}
.rn-cta-symbol{flex:none;font-size:40px;color:#00a64f}
.rn-cta-cw{font-size:14px;font-weight:900;border:2px solid currentColor;border-radius:10px;padding:9px 5px}
.rn-cta-choices b{flex:none;display:grid;place-items:center;margin-left:auto;width:38px;height:38px;border:1px solid #c7ccbb;border-radius:50%;font-size:23px}
/* 電話と左右の人物 */
.rn-cta-tel{position:relative;display:block;min-height:340px;padding:48px 24% 58px;overflow:hidden}
.rn-cta-phone{position:relative;z-index:2}
.rn-cta-phone h3{margin:0 0 8px;font-size:clamp(22px,2vw,32px);line-height:1.5}
.rn-cta-say{margin:0 -9% 18px;font-size:clamp(14px,1.15vw,20px);line-height:1.9;text-wrap:balance}
.rn-cta-number{display:inline-flex;align-items:center;gap:.25em;margin:0 0 16px;color:#009f4d;text-decoration:none;font-size:clamp(33px,4vw,65px);font-weight:900;letter-spacing:.015em;white-space:nowrap}
.rn-cta-number svg{width:.7em;height:.7em;flex:none}
.rn-cta-hours{margin:8px 0 0;font-size:14px;line-height:1.8}
.rn-cta-person{position:absolute;bottom:0;width:21%;max-width:350px;display:flex;flex-direction:column;align-items:center;gap:15px;pointer-events:none}
.rn-cta-person-l{left:3.5%}
.rn-cta-person-r{right:3.5%}
.rn-cta-person img{display:block;width:100%;height:clamp(175px,15vw,250px);object-fit:cover;object-position:bottom}
.rn-cta-person-l img{width:80%;object-fit:contain}
.rn-cta-speech{position:relative;display:block;margin:0 0 2px;padding:17px 24px;border-radius:60px;background:#ffd8ce;color:#131b15;font-size:clamp(14px,1.15vw,19px);font-weight:700;line-height:1.5;white-space:nowrap}
.rn-cta-speech::after{content:'';position:absolute;right:24%;bottom:-10px;width:19px;height:20px;background:#ffd8ce;clip-path:polygon(0 0,100% 0,0 100%)}
.rn-cta-person-l .rn-cta-speech{transform:rotate(-12deg)}
.rn-cta-person-r .rn-cta-speech{transform:rotate(12deg)}
@media(max-width:1000px){.rn-cta-tel{padding:40px 22% 55px;min-height:300px}.rn-cta-speech{padding:13px 15px;font-size:13px}.rn-cta-person-l{left:1%}.rn-cta-person-r{right:1%}.rn-cta-person{width:23%}.rn-cta-number{font-size:clamp(28px,4.2vw,43px)}}
@media(max-width:750px){.rn-cta-intro{padding-bottom:35px}.rn-cta-intro p{font-size:15px}.rn-cta-choices{grid-template-columns:1fr}.rn-cta-choices a{padding:30px 8%}.rn-cta-choices a+a{border-left:0;border-top:1px solid #e0e0e0}.rn-cta-choices strong{font-size:20px}.rn-cta-tel{padding:34px 6% 230px;min-height:0}.rn-cta-phone h3{font-size:23px}.rn-cta-say{margin:0 0 12px;font-size:14px}.rn-cta-number{font-size:clamp(30px,7vw,43px)}.rn-cta-person{width:43%;gap:10px;max-width:230px}.rn-cta-person-l{left:3%}.rn-cta-person-r{right:3%}.rn-cta-person img{height:150px}.rn-cta-speech{padding:11px 13px;font-size:clamp(11px,2.7vw,15px)}.rn-cta-hours{font-size:13px}}
/* 例外：高さを固定して中身を絶対配置する欄は、余白では伸びないので高さに楕円の分を足す（about「代表メッセージ」） */
.ad-message:has(+ .rn-cta){min-height:calc(660px + var(--rn-dome) + 30px)}
@media(max-width:650px){.ad-message:has(+ .rn-cta){min-height:calc(490px + var(--rn-dome) + 30px)}}

/* ==== 下層の見出し（アイキャッチ・共通部品 src/layout/hero.html）=========================
   形＝お医者さん版の下層見出しの最終版（横長の写真の枠・緑の膜・白の大きな英字と見出し・左下の飾りの丸・下に一文）。
   ページごとに変えるのは 英字・リード文・写真・パンくずの親（ページ先頭の hero_*）。H1 は seo-pages.md から入る */
.rn-hero{position:relative;max-width:1800px;margin:0 auto;padding:134px 24px 65px;background:#fff}
.rn-hero-crumb{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;margin:0 0 20px;padding:0 3%;color:#597565;font-size:13px;line-height:1.8}
.rn-hero-crumb a{color:inherit;text-decoration:underline;text-underline-offset:4px}
.rn-hero-frame{position:relative;isolation:isolate;overflow:hidden;min-width:0;max-width:100%;border-radius:72px 26px 72px 26px;min-height:400px;aspect-ratio:3.05;max-height:540px;background:#315e49;box-shadow:0 18px 55px #125e2e0c}
.rn-hero-frame::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#10a66799 0%,#25b78070 42%,#8cddb72b 100%);pointer-events:none}
.rn-hero-photo{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.rn-hero-copy{position:relative;z-index:3;max-width:90%;padding:clamp(85px,8vw,150px) 6% clamp(70px,5.5vw,105px);color:#fff;text-align:left}
.rn-hero-en{display:block;margin:0 0 18px;font:700 clamp(45px,6.6vw,105px)/1.1 var(--display-font);letter-spacing:.015em;color:#fff}
.rn-hero h1{position:static;margin:0;max-width:1000px;font-size:clamp(25px,2.7vw,43px);font-weight:900;line-height:1.6;letter-spacing:.06em;color:#fff;white-space:normal;text-shadow:none;animation:none;-webkit-text-stroke:0;text-wrap:balance;word-break:auto-phrase}
.rn-hero-lead{max-width:960px;margin:36px auto 0;padding:0 5%;text-align:center;font-size:clamp(18px,1.55vw,23px);font-weight:700;line-height:1.9;color:#315440}
.rn-hero-shapes{position:absolute;z-index:2;left:0;bottom:0;width:390px;height:118px;pointer-events:none}
.rn-hero-shapes i{position:absolute;display:block;border-radius:50%;background:#39db88;bottom:-18px;left:42px;width:82px;height:82px;animation:rn-shape-drift 8s ease-in-out infinite;--fx:4px;--fy:-8px}
.rn-hero-shapes i:nth-child(2n){animation-duration:11s;animation-delay:-3s;--fx:-5px;--fy:10px}
.rn-hero-shapes i:nth-child(2){width:43px;height:43px;left:13px;bottom:76px;background:#d0fae5}
.rn-hero-shapes i:nth-child(3){width:126px;height:126px;left:152px;bottom:-66px;background:#00af66}
.rn-hero-shapes i:nth-child(4){width:25px;height:25px;left:126px;bottom:62px;background:#fff}
.rn-hero-shapes i:nth-child(5){width:60px;height:92px;border-radius:50px;left:270px;bottom:-30px;transform:rotate(35deg);background:#e8f58c}
.rn-hero-shapes i:nth-child(6){width:17px;height:17px;left:71px;bottom:98px;background:#8aeec6}
.rn-hero-shapes i:nth-child(7){width:29px;height:29px;left:346px;bottom:8px;background:#b0eed4}
@keyframes rn-shape-drift{0%,100%{translate:0 0}50%{translate:var(--fx) var(--fy)}}
@media(prefers-reduced-motion:reduce){.rn-hero-shapes i{animation:none}}
@media(max-width:1000px){.rn-hero{padding-top:128px}.rn-hero-frame{min-height:380px}.rn-hero-copy{padding-top:95px;max-width:95%}}
@media(max-width:650px){.rn-hero{padding:110px 13px 40px}.rn-hero-crumb{justify-content:flex-start;margin-bottom:16px;font-size:12px}.rn-hero-frame{min-height:380px;aspect-ratio:auto;max-height:none;border-radius:44px 20px 44px 20px}.rn-hero-photo{object-position:46% center}.rn-hero-frame::after{background:linear-gradient(90deg,#10a667b0,#25b78066)}.rn-hero-copy{padding:90px 7% 110px;max-width:100%}.rn-hero-en{font-size:clamp(32px,9vw,53px);line-height:1.2;overflow-wrap:anywhere}.rn-hero h1{font-size:clamp(23px,5.5vw,31px);letter-spacing:.03em}.rn-hero-lead{font-size:17px;margin-top:28px}.rn-hero-shapes{transform:scale(.72);transform-origin:left bottom}}
@media(max-width:550px){.rn-hero h1{overflow-wrap:anywhere}.rn-hero-frame{min-height:350px}.rn-hero-copy{padding-bottom:95px}}
/* 見出しの器を持つページの、元の上の余白を外す（見出し側で取る） */
.subpage:has(> .rn-hero){padding-top:0!important}

/* 下層の見出し：開いたときの動き（お医者さん版と同じ。見出しは下から現れ、写真は右から回りながら入る）
   写真は 6deg 傾いて止まる（お医者さん版と同じ・2026-10-17 決定）。枠の角に地の濃い緑が少し出る */
@keyframes rn-hero-title{from{opacity:0;translate:0 35px;clip-path:inset(0 0 100% 0)}to{opacity:1;translate:0 0;clip-path:inset(0)}}
@keyframes rn-hero-photo{from{opacity:0;translate:60px 20px;rotate:11deg}to{opacity:1;translate:0 0;rotate:6deg}}
.rn-hero-copy{animation:rn-hero-title .85s cubic-bezier(.22,1,.36,1) both}
.rn-hero-photo{animation:rn-hero-photo 1.05s .14s cubic-bezier(.22,1,.36,1) both}
@media(prefers-reduced-motion:reduce){.rn-hero-copy,.rn-hero-photo{animation:none}.rn-hero-photo{rotate:6deg}}

/* ==== 2026-10-17 手直し（TOP）================================================================ */

/* ヘッダー：「まずは相談してみる」はFVと同じ角の形のまま（白いヘッダーでも丸くしない） */
#header .contact{border-radius:4px}

/* ヘッダー：下層メニュー（アイコン＋見出し＋ひとことの形・色はこのサイトの緑） */
.hd-mega{position:relative;display:flex;align-items:stretch}
.hd-mega-trigger{position:relative;display:inline-flex;align-items:center;gap:8px;padding:17px 0;white-space:nowrap;color:inherit;text-decoration:none}
.hd-mega-trigger::before{content:'+';display:inline-grid;place-items:center;width:18px;height:18px;border:1px solid currentColor;border-radius:50%;font:500 13px/1 Roboto,Arial,sans-serif;transition:background .15s,color .15s,border-color .15s}
#header.white .hd-mega-trigger::before,body.menu-open .hd-mega-trigger::before{border-color:#00a64f;color:#00a64f}
.hd-mega:hover .hd-mega-trigger,.hd-mega:focus-within .hd-mega-trigger{color:#00a64f}
#header .hd-mega:hover .hd-mega-trigger::before,#header .hd-mega:focus-within .hd-mega-trigger::before{content:'\2212';background:#00a64f;border-color:#00a64f;color:#fff}
.hd-mega-trigger::after{content:'';position:absolute;left:0;right:0;bottom:8px;height:2px;background:#00a64f;transform:scaleX(0);transition:transform .2s}
.hd-mega:hover .hd-mega-trigger::after,.hd-mega:focus-within .hd-mega-trigger::after{transform:scaleX(1)}
.hd-mega-menu{position:absolute;top:100%;left:-20px;min-width:380px;padding:8px 0;background:#fff;border:1px solid #eaeaea;border-radius:0 0 12px 12px;box-shadow:0 12px 32px rgba(0,0,0,.08);color:#333;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;z-index:50;font-family:var(--body-font);-webkit-text-stroke:0}
.hd-mega:hover .hd-mega-menu,.hd-mega:focus-within .hd-mega-menu{opacity:1;visibility:visible}
.hd-mega-item{position:relative;display:flex;align-items:center;gap:14px;min-height:64px;padding:14px 44px 14px 20px;color:#333;text-decoration:none;transition:background .15s}
.hd-mega-item+.hd-mega-item{border-top:1px solid #eaeaea}
.hd-mega-item:hover{background:#eef9f3}
.hd-mega-item::after{content:'\203A';position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:22px;line-height:1;color:#00a64f;opacity:.5;transition:opacity .15s,transform .15s}
.hd-mega-item:hover::after{opacity:1;transform:translateY(-50%) translateX(4px)}
.hd-mega-icon{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:10px;background:#fff;border:1px solid #bfe7d0;color:#00a64f;transition:background .15s,border-color .15s,color .15s}
.hd-mega-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hd-mega-item:hover .hd-mega-icon{background:#00a64f;border-color:#00a64f;color:#fff}
.hd-mega-body{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.hd-mega-title{display:block;margin-bottom:4px;font-size:14px;font-weight:700;color:#333;white-space:nowrap;transition:color .15s}
.hd-mega-item:hover .hd-mega-title,.hd-mega-item[aria-current=page] .hd-mega-title{color:#00a64f}
.hd-mega-desc{display:block;font-size:11px;font-weight:500;line-height:1.5;color:#888;white-space:nowrap}

/* ABOUT：背景の矢印は1回描いたら、そのまま残す */
.about-arrow.is-playing .about-arrow-curve{animation:rn-about-draw 3.4s cubic-bezier(.65,0,.35,1) forwards}
.about-arrow.is-playing .about-arrow-head{animation:rn-about-head 3.6s linear forwards}
@keyframes rn-about-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes rn-about-head{0%,90%{opacity:0}100%{opacity:1}}

/* できること：背景を薄いグレーに・左下の白い欠けも埋める・見出しを大きく・タブに白丸の右向き三角 */
.file-tabs .ft-bg{--c:#f2f2f2}
.file-tabs .ft-bg::after{left:0;border-radius:0}
.file-tabs .ft-bg i:nth-child(2){display:none}
.file-tabs .ft-vtitle{font-size:clamp(34px,3.4vw,52px)}
.ft-tab::before{content:'';flex:none;width:18px;height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Ccircle cx='9' cy='9' r='9' fill='%23fff'/%3E%3Cpath d='M7.2 5.4 12.4 9l-5.2 3.6z' fill='%2300a64f'/%3E%3C/svg%3E") center/contain no-repeat}
/* タブを切り替えても高さが変わらないよう、4枚のパネルを重ねて一番高いものに合わせる */
.ft-card{display:grid}
.ft-panel{grid-area:1/1;min-width:0}
.ft-panel[hidden]{display:block;visibility:hidden;opacity:0;pointer-events:none}
.ft-tabs{min-height:66px}
@media(max-width:650px){.ft-tabs{min-height:54px}}

/* お困りごと：WEBはWORKだった濃い緑・WORKは「まずは相談してみる」の赤（地の緑は元のまま・2026-10-17 戻した） */
.worry-group.g1{--ac:#143a29;--ac2:#2c6b4b}
.worry-group.g3{--ac:#f4433e;--ac2:#f66a5e}
/* 開閉の矢印：グループの色の丸に白い矢印（開くと下向き） */
.worries .worry-groups .worry-card i{display:grid;place-items:center;width:24px;height:24px;margin-top:-12px;border-radius:50%;background:var(--ac);color:#fff;font-size:12px;line-height:1}
.worries .worry-groups .worry-card[open] i{transform:rotate(90deg)}
/* 電話で相談する：できることの「詳しく見る」と同じ形・色はグループの色 */
.worries .worry-group-cta.mt-pill{gap:12px;padding:12px 26px 12px 14px;border:2px solid var(--ac);background:#fff;color:#1d2a23;box-shadow:none;font-size:15px}
.worries .worry-group-cta.mt-pill .mt-pill-icon{background:var(--ac)}
.worries .worry-group-cta.mt-pill:hover{background:var(--ac);color:#fff;filter:none}
.worries .worry-group-cta.mt-pill:hover .mt-pill-icon{background:#fff;color:var(--ac)}

/* 強み：見出しを固定したまま、スクロールで01→02→03。カードは小さめの角丸の白に、写真を左・文章を右 */
.worries .strength-number::after,.worries .strength-slide .strength-number::after{display:none}
.worries .strength-stage{position:relative}
.worries .strength-slide{gap:clamp(24px,3vw,44px);padding:clamp(18px,1.8vw,28px);clip-path:none;border-radius:28px}
.worries .strength-slide .strength-photo{border-radius:18px;overflow:hidden}
.worries .strength-text{padding:20px clamp(10px,2.5vw,44px) 20px 0}
.worries .strength-slide .strength-number{font-size:clamp(46px,4.4vw,60px)}
@media(min-width:901px){
  .worries .strength-track{margin-top:0}
  .worries .strength-pin{display:flex;flex-direction:column;padding:clamp(124px,15vh,140px) 0 4vh;box-sizing:border-box}
  .worries .strength-pin .strengths-heading{flex:none;margin:0 0 clamp(18px,3vh,32px)}
  .worries .strength-stage{flex:1;width:100%;max-width:1100px;max-height:560px;margin:0 auto}
  .worries .strength-slide{top:0;bottom:0;left:0;right:0}
  .worries .strength-slide .strength-photo{width:46%}
  .worries .strength-text{width:54%}
  .worries .strength-pager{left:clamp(36px,3.4vw,52px);bottom:clamp(36px,3.4vw,52px)}
}
@media(max-width:900px){.worries .strength-stage{display:grid;gap:20px}.worries .strength-slide{padding:14px;border-radius:20px}.worries .strength-text{padding:18px 10px 14px}}

/* ページ案内（料金・相談の流れ…）：薄い緑の地を横に広げる（カードの幅は今のまま） */
.page-directory{padding-left:clamp(12px,2vw,32px);padding-right:clamp(12px,2vw,32px)}
.page-directory .dg-grid{max-width:1760px;padding-left:max(40px,calc((100% - 1320px) / 2));padding-right:max(40px,calc((100% - 1320px) / 2))}
@media(max-width:900px){.page-directory .dg-grid{padding-left:18px;padding-right:18px}}

/* 電話のCTA：地を白に（共通部品・全ページ） */
:root{--rn-cta-bg:#fff}
.rn-cta::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 200' preserveAspectRatio='none'%3E%3Cpath d='M0 200 Q500 -200 1000 200Z' fill='%23ffffff'/%3E%3C/svg%3E"),linear-gradient(to bottom,transparent calc(var(--rn-dome) - 1px),var(--rn-cta-bg) calc(var(--rn-dome) - 1px))}
.rn-cta-cal svg{width:40px;height:40px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.rn-cta-choices small{letter-spacing:.02em;line-height:1.6}

/* ABOUT：「私たちについて」を締めの一文と同じ高さに・ボタンを大きく（PC） */
@media(min-width:1001px){
  .about-panel .about-content{align-items:end}
  .about-panel .about-graphic .about-more{transform:translateY(calc(-1 * var(--rn-about-shift,0px)))}
}
.about-panel .about-more{gap:16px;padding:16px 36px 16px 18px;font-size:18px}
.about-panel .about-more .mt-pill-icon{width:36px;height:36px;font-size:24px}

/* 電話のCTA：吹き出しを薄い黄色に */
.rn-cta-speech,.rn-cta-speech::after{background:#fff4b8}

/* FVの緑の矢印（2026-10-17 デザイン担当のお手本どおり）：出だしの1区間だけを上げた道すじ（M-100 470 …）に合わせた
   線の長さ 2128.1904・線が伸びる動き・先端の動き。ベースの同名の設定を上書きする */
.scene-slide[data-scene="0"] .arrow-curve{stroke-dasharray:2128.1904 2400;stroke-dashoffset:2128.1904;animation-name:arrow-stroke-0;animation-duration:18.6s;animation-timing-function:linear;animation-iteration-count:infinite}

.scene-slide[data-scene="1"] .arrow-curve{stroke-dasharray:2128.1904 2400;stroke-dashoffset:2128.1904;animation-name:arrow-stroke-1;animation-duration:18.6s;animation-timing-function:linear;animation-iteration-count:infinite}

.scene-slide[data-scene="2"] .arrow-curve{stroke-dasharray:2128.1904 2400;stroke-dashoffset:2128.1904;animation-name:arrow-stroke-2;animation-duration:18.6s;animation-timing-function:linear;animation-iteration-count:infinite}

@keyframes arrow-stroke-0{0%,4.8387%{stroke-dashoffset:2185.1904}22.5806%,100%{stroke-dashoffset:57}}

@keyframes arrow-head-0{0%,4.8387%{transform:translate(-100.000px,470.000px) rotate(-4.639deg)}5.0605%{transform:translate(-73.379px,469.167px) rotate(-3.644deg)}5.2823%{transform:translate(-46.864px,470.754px) rotate(-0.824deg)}5.5040%{transform:translate(-20.377px,474.336px) rotate(3.477deg)}5.7258%{transform:translate(5.616px,479.477px) rotate(7.734deg)}5.9476%{transform:translate(31.399px,485.922px) rotate(11.216deg)}6.1694%{transform:translate(56.989px,493.440px) rotate(14.063deg)}6.3911%{transform:translate(82.265px,501.790px) rotate(16.392deg)}6.6129%{transform:translate(107.263px,510.803px) rotate(18.291deg)}6.8347%{transform:translate(132.163px,520.389px) rotate(19.826deg)}7.0565%{transform:translate(156.702px,530.298px) rotate(21.040deg)}7.2782%{transform:translate(181.324px,540.570px) rotate(21.960deg)}7.5000%{transform:translate(205.731px,550.937px) rotate(22.594deg)}7.7218%{transform:translate(230.280px,561.389px) rotate(22.931deg)}7.9435%{transform:translate(254.848px,571.675px) rotate(22.932deg)}8.1653%{transform:translate(279.478px,581.552px) rotate(22.518deg)}8.3871%{transform:translate(304.496px,590.755px) rotate(21.525deg)}8.6089%{transform:translate(329.848px,598.589px) rotate(19.618deg)}8.8306%{transform:translate(355.905px,603.787px) rotate(15.987deg)}9.0524%{transform:translate(382.296px,602.625px) rotate(8.184deg)}9.2742%{transform:translate(405.415px,589.588px) rotate(-7.839deg)}9.4960%{transform:translate(425.841px,572.570px) rotate(-25.486deg)}9.7177%{transform:translate(443.070px,552.387px) rotate(-40.622deg)}9.9395%{transform:translate(455.981px,529.229px) rotate(-50.722deg)}10.1613%{transform:translate(463.764px,503.796px) rotate(-61.897deg)}10.3831%{transform:translate(466.266px,477.340px) rotate(-73.644deg)}10.6048%{transform:translate(464.085px,450.921px) rotate(-84.898deg)}10.8266%{transform:translate(458.036px,424.992px) rotate(-94.851deg)}11.0484%{transform:translate(448.940px,400.044px) rotate(-103.216deg)}11.2702%{transform:translate(437.374px,376.067px) rotate(-110.123deg)}11.4919%{transform:translate(423.836px,353.189px) rotate(-115.867deg)}11.7137%{transform:translate(408.618px,331.348px) rotate(-120.752deg)}11.9355%{transform:translate(391.958px,310.571px) rotate(-125.031deg)}12.1573%{transform:translate(374.108px,290.973px) rotate(-128.907deg)}12.3790%{transform:translate(354.986px,272.393px) rotate(-132.542deg)}12.6008%{transform:translate(334.795px,255.100px) rotate(-136.103deg)}12.8226%{transform:translate(313.333px,239.418px) rotate(-139.956deg)}13.0444%{transform:translate(290.425px,225.949px) rotate(-144.585deg)}13.2661%{transform:translate(265.960px,215.590px) rotate(-150.555deg)}13.4879%{transform:translate(240.070px,209.602px) rotate(-158.392deg)}13.7097%{transform:translate(213.550px,209.433px) rotate(-168.586deg)}13.9315%{transform:translate(187.853px,215.938px) rotate(-181.152deg)}14.1532%{transform:translate(164.494px,228.598px) rotate(-195.111deg)}14.3750%{transform:translate(144.050px,245.545px) rotate(-208.426deg)}14.5968%{transform:translate(128.378px,266.942px) rotate(-221.504deg)}14.8185%{transform:translate(120.840px,292.266px) rotate(-236.590deg)}15.0403%{transform:translate(123.204px,318.633px) rotate(-255.435deg)}15.2621%{transform:translate(133.599px,343.029px) rotate(-275.381deg)}15.4839%{transform:translate(149.182px,364.563px) rotate(-292.645deg)}15.7056%{transform:translate(168.008px,383.335px) rotate(-305.601deg)}15.9274%{transform:translate(188.987px,399.647px) rotate(-315.023deg)}16.1492%{transform:translate(211.554px,413.792px) rotate(-322.209deg)}16.3710%{transform:translate(235.264px,425.828px) rotate(-328.121deg)}16.5927%{transform:translate(259.839px,435.873px) rotate(-333.282deg)}16.8145%{transform:translate(285.113px,444.071px) rotate(-337.954deg)}17.0363%{transform:translate(310.955px,450.541px) rotate(-342.214deg)}17.2581%{transform:translate(337.086px,455.354px) rotate(-346.122deg)}17.4798%{transform:translate(363.512px,458.627px) rotate(-349.738deg)}17.7016%{transform:translate(390.081px,460.427px) rotate(-353.113deg)}17.9234%{transform:translate(416.656px,460.821px) rotate(-356.293deg)}18.1452%{transform:translate(443.207px,459.871px) rotate(-359.318deg)}18.3669%{transform:translate(469.718px,457.617px) rotate(-362.223deg)}18.5887%{transform:translate(496.087px,454.096px) rotate(-365.036deg)}18.8105%{transform:translate(522.321px,449.344px) rotate(-367.769deg)}19.0323%{transform:translate(548.189px,443.426px) rotate(-370.439deg)}19.2540%{transform:translate(573.694px,435.977px) rotate(-373.340deg)}19.4758%{transform:translate(598.705px,426.733px) rotate(-376.725deg)}19.6976%{transform:translate(622.774px,415.499px) rotate(-380.812deg)}19.9194%{transform:translate(645.637px,401.970px) rotate(-385.641deg)}20.1411%{transform:translate(666.816px,385.899px) rotate(-391.340deg)}20.3629%{transform:translate(685.713px,367.148px) rotate(-397.994deg)}20.5847%{transform:translate(701.615px,345.899px) rotate(-405.585deg)}20.8065%{transform:translate(714.081px,322.403px) rotate(-413.927deg)}21.0282%{transform:translate(722.798px,297.320px) rotate(-422.644deg)}21.2500%{transform:translate(727.854px,271.196px) rotate(-431.258deg)}21.4718%{transform:translate(731.199px,244.824px) rotate(-438.070deg)}21.6935%{transform:translate(733.570px,218.334px) rotate(-442.561deg)}21.9153%{transform:translate(735.013px,191.782px) rotate(-444.978deg)}22.1371%{transform:translate(735.726px,165.181px) rotate(-446.884deg)}22.3589%{transform:translate(735.969px,138.568px) rotate(-448.385deg)}22.5806%,100%{transform:translate(736.000px,112.000px) rotate(-449.362deg)}}

@keyframes arrow-stroke-1{0%,4.8387%{stroke-dashoffset:2185.1904}22.5806%,100%{stroke-dashoffset:57}}

@keyframes arrow-head-1{0%,4.8387%{transform:translate(-100.000px,470.000px) rotate(-4.639deg)}5.0605%{transform:translate(-73.379px,469.167px) rotate(-3.644deg)}5.2823%{transform:translate(-46.864px,470.754px) rotate(-0.824deg)}5.5040%{transform:translate(-20.377px,474.336px) rotate(3.477deg)}5.7258%{transform:translate(5.616px,479.477px) rotate(7.734deg)}5.9476%{transform:translate(31.399px,485.922px) rotate(11.216deg)}6.1694%{transform:translate(56.989px,493.440px) rotate(14.063deg)}6.3911%{transform:translate(82.265px,501.790px) rotate(16.392deg)}6.6129%{transform:translate(107.263px,510.803px) rotate(18.291deg)}6.8347%{transform:translate(132.163px,520.389px) rotate(19.826deg)}7.0565%{transform:translate(156.702px,530.298px) rotate(21.040deg)}7.2782%{transform:translate(181.324px,540.570px) rotate(21.960deg)}7.5000%{transform:translate(205.731px,550.937px) rotate(22.594deg)}7.7218%{transform:translate(230.280px,561.389px) rotate(22.931deg)}7.9435%{transform:translate(254.848px,571.675px) rotate(22.932deg)}8.1653%{transform:translate(279.478px,581.552px) rotate(22.518deg)}8.3871%{transform:translate(304.496px,590.755px) rotate(21.525deg)}8.6089%{transform:translate(329.848px,598.589px) rotate(19.618deg)}8.8306%{transform:translate(355.905px,603.787px) rotate(15.987deg)}9.0524%{transform:translate(382.296px,602.625px) rotate(8.184deg)}9.2742%{transform:translate(405.415px,589.588px) rotate(-7.839deg)}9.4960%{transform:translate(425.841px,572.570px) rotate(-25.486deg)}9.7177%{transform:translate(443.070px,552.387px) rotate(-40.622deg)}9.9395%{transform:translate(455.981px,529.229px) rotate(-50.722deg)}10.1613%{transform:translate(463.764px,503.796px) rotate(-61.897deg)}10.3831%{transform:translate(466.266px,477.340px) rotate(-73.644deg)}10.6048%{transform:translate(464.085px,450.921px) rotate(-84.898deg)}10.8266%{transform:translate(458.036px,424.992px) rotate(-94.851deg)}11.0484%{transform:translate(448.940px,400.044px) rotate(-103.216deg)}11.2702%{transform:translate(437.374px,376.067px) rotate(-110.123deg)}11.4919%{transform:translate(423.836px,353.189px) rotate(-115.867deg)}11.7137%{transform:translate(408.618px,331.348px) rotate(-120.752deg)}11.9355%{transform:translate(391.958px,310.571px) rotate(-125.031deg)}12.1573%{transform:translate(374.108px,290.973px) rotate(-128.907deg)}12.3790%{transform:translate(354.986px,272.393px) rotate(-132.542deg)}12.6008%{transform:translate(334.795px,255.100px) rotate(-136.103deg)}12.8226%{transform:translate(313.333px,239.418px) rotate(-139.956deg)}13.0444%{transform:translate(290.425px,225.949px) rotate(-144.585deg)}13.2661%{transform:translate(265.960px,215.590px) rotate(-150.555deg)}13.4879%{transform:translate(240.070px,209.602px) rotate(-158.392deg)}13.7097%{transform:translate(213.550px,209.433px) rotate(-168.586deg)}13.9315%{transform:translate(187.853px,215.938px) rotate(-181.152deg)}14.1532%{transform:translate(164.494px,228.598px) rotate(-195.111deg)}14.3750%{transform:translate(144.050px,245.545px) rotate(-208.426deg)}14.5968%{transform:translate(128.378px,266.942px) rotate(-221.504deg)}14.8185%{transform:translate(120.840px,292.266px) rotate(-236.590deg)}15.0403%{transform:translate(123.204px,318.633px) rotate(-255.435deg)}15.2621%{transform:translate(133.599px,343.029px) rotate(-275.381deg)}15.4839%{transform:translate(149.182px,364.563px) rotate(-292.645deg)}15.7056%{transform:translate(168.008px,383.335px) rotate(-305.601deg)}15.9274%{transform:translate(188.987px,399.647px) rotate(-315.023deg)}16.1492%{transform:translate(211.554px,413.792px) rotate(-322.209deg)}16.3710%{transform:translate(235.264px,425.828px) rotate(-328.121deg)}16.5927%{transform:translate(259.839px,435.873px) rotate(-333.282deg)}16.8145%{transform:translate(285.113px,444.071px) rotate(-337.954deg)}17.0363%{transform:translate(310.955px,450.541px) rotate(-342.214deg)}17.2581%{transform:translate(337.086px,455.354px) rotate(-346.122deg)}17.4798%{transform:translate(363.512px,458.627px) rotate(-349.738deg)}17.7016%{transform:translate(390.081px,460.427px) rotate(-353.113deg)}17.9234%{transform:translate(416.656px,460.821px) rotate(-356.293deg)}18.1452%{transform:translate(443.207px,459.871px) rotate(-359.318deg)}18.3669%{transform:translate(469.718px,457.617px) rotate(-362.223deg)}18.5887%{transform:translate(496.087px,454.096px) rotate(-365.036deg)}18.8105%{transform:translate(522.321px,449.344px) rotate(-367.769deg)}19.0323%{transform:translate(548.189px,443.426px) rotate(-370.439deg)}19.2540%{transform:translate(573.694px,435.977px) rotate(-373.340deg)}19.4758%{transform:translate(598.705px,426.733px) rotate(-376.725deg)}19.6976%{transform:translate(622.774px,415.499px) rotate(-380.812deg)}19.9194%{transform:translate(645.637px,401.970px) rotate(-385.641deg)}20.1411%{transform:translate(666.816px,385.899px) rotate(-391.340deg)}20.3629%{transform:translate(685.713px,367.148px) rotate(-397.994deg)}20.5847%{transform:translate(701.615px,345.899px) rotate(-405.585deg)}20.8065%{transform:translate(714.081px,322.403px) rotate(-413.927deg)}21.0282%{transform:translate(722.798px,297.320px) rotate(-422.644deg)}21.2500%{transform:translate(727.854px,271.196px) rotate(-431.258deg)}21.4718%{transform:translate(731.199px,244.824px) rotate(-438.070deg)}21.6935%{transform:translate(733.570px,218.334px) rotate(-442.561deg)}21.9153%{transform:translate(735.013px,191.782px) rotate(-444.978deg)}22.1371%{transform:translate(735.726px,165.181px) rotate(-446.884deg)}22.3589%{transform:translate(735.969px,138.568px) rotate(-448.385deg)}22.5806%,100%{transform:translate(736.000px,112.000px) rotate(-449.362deg)}}

@keyframes arrow-stroke-2{0%,4.8387%{stroke-dashoffset:2185.1904}22.5806%,100%{stroke-dashoffset:57}}

@keyframes arrow-head-2{0%,4.8387%{transform:translate(-100.000px,470.000px) rotate(-4.639deg)}5.0605%{transform:translate(-73.379px,469.167px) rotate(-3.644deg)}5.2823%{transform:translate(-46.864px,470.754px) rotate(-0.824deg)}5.5040%{transform:translate(-20.377px,474.336px) rotate(3.477deg)}5.7258%{transform:translate(5.616px,479.477px) rotate(7.734deg)}5.9476%{transform:translate(31.399px,485.922px) rotate(11.216deg)}6.1694%{transform:translate(56.989px,493.440px) rotate(14.063deg)}6.3911%{transform:translate(82.265px,501.790px) rotate(16.392deg)}6.6129%{transform:translate(107.263px,510.803px) rotate(18.291deg)}6.8347%{transform:translate(132.163px,520.389px) rotate(19.826deg)}7.0565%{transform:translate(156.702px,530.298px) rotate(21.040deg)}7.2782%{transform:translate(181.324px,540.570px) rotate(21.960deg)}7.5000%{transform:translate(205.731px,550.937px) rotate(22.594deg)}7.7218%{transform:translate(230.280px,561.389px) rotate(22.931deg)}7.9435%{transform:translate(254.848px,571.675px) rotate(22.932deg)}8.1653%{transform:translate(279.478px,581.552px) rotate(22.518deg)}8.3871%{transform:translate(304.496px,590.755px) rotate(21.525deg)}8.6089%{transform:translate(329.848px,598.589px) rotate(19.618deg)}8.8306%{transform:translate(355.905px,603.787px) rotate(15.987deg)}9.0524%{transform:translate(382.296px,602.625px) rotate(8.184deg)}9.2742%{transform:translate(405.415px,589.588px) rotate(-7.839deg)}9.4960%{transform:translate(425.841px,572.570px) rotate(-25.486deg)}9.7177%{transform:translate(443.070px,552.387px) rotate(-40.622deg)}9.9395%{transform:translate(455.981px,529.229px) rotate(-50.722deg)}10.1613%{transform:translate(463.764px,503.796px) rotate(-61.897deg)}10.3831%{transform:translate(466.266px,477.340px) rotate(-73.644deg)}10.6048%{transform:translate(464.085px,450.921px) rotate(-84.898deg)}10.8266%{transform:translate(458.036px,424.992px) rotate(-94.851deg)}11.0484%{transform:translate(448.940px,400.044px) rotate(-103.216deg)}11.2702%{transform:translate(437.374px,376.067px) rotate(-110.123deg)}11.4919%{transform:translate(423.836px,353.189px) rotate(-115.867deg)}11.7137%{transform:translate(408.618px,331.348px) rotate(-120.752deg)}11.9355%{transform:translate(391.958px,310.571px) rotate(-125.031deg)}12.1573%{transform:translate(374.108px,290.973px) rotate(-128.907deg)}12.3790%{transform:translate(354.986px,272.393px) rotate(-132.542deg)}12.6008%{transform:translate(334.795px,255.100px) rotate(-136.103deg)}12.8226%{transform:translate(313.333px,239.418px) rotate(-139.956deg)}13.0444%{transform:translate(290.425px,225.949px) rotate(-144.585deg)}13.2661%{transform:translate(265.960px,215.590px) rotate(-150.555deg)}13.4879%{transform:translate(240.070px,209.602px) rotate(-158.392deg)}13.7097%{transform:translate(213.550px,209.433px) rotate(-168.586deg)}13.9315%{transform:translate(187.853px,215.938px) rotate(-181.152deg)}14.1532%{transform:translate(164.494px,228.598px) rotate(-195.111deg)}14.3750%{transform:translate(144.050px,245.545px) rotate(-208.426deg)}14.5968%{transform:translate(128.378px,266.942px) rotate(-221.504deg)}14.8185%{transform:translate(120.840px,292.266px) rotate(-236.590deg)}15.0403%{transform:translate(123.204px,318.633px) rotate(-255.435deg)}15.2621%{transform:translate(133.599px,343.029px) rotate(-275.381deg)}15.4839%{transform:translate(149.182px,364.563px) rotate(-292.645deg)}15.7056%{transform:translate(168.008px,383.335px) rotate(-305.601deg)}15.9274%{transform:translate(188.987px,399.647px) rotate(-315.023deg)}16.1492%{transform:translate(211.554px,413.792px) rotate(-322.209deg)}16.3710%{transform:translate(235.264px,425.828px) rotate(-328.121deg)}16.5927%{transform:translate(259.839px,435.873px) rotate(-333.282deg)}16.8145%{transform:translate(285.113px,444.071px) rotate(-337.954deg)}17.0363%{transform:translate(310.955px,450.541px) rotate(-342.214deg)}17.2581%{transform:translate(337.086px,455.354px) rotate(-346.122deg)}17.4798%{transform:translate(363.512px,458.627px) rotate(-349.738deg)}17.7016%{transform:translate(390.081px,460.427px) rotate(-353.113deg)}17.9234%{transform:translate(416.656px,460.821px) rotate(-356.293deg)}18.1452%{transform:translate(443.207px,459.871px) rotate(-359.318deg)}18.3669%{transform:translate(469.718px,457.617px) rotate(-362.223deg)}18.5887%{transform:translate(496.087px,454.096px) rotate(-365.036deg)}18.8105%{transform:translate(522.321px,449.344px) rotate(-367.769deg)}19.0323%{transform:translate(548.189px,443.426px) rotate(-370.439deg)}19.2540%{transform:translate(573.694px,435.977px) rotate(-373.340deg)}19.4758%{transform:translate(598.705px,426.733px) rotate(-376.725deg)}19.6976%{transform:translate(622.774px,415.499px) rotate(-380.812deg)}19.9194%{transform:translate(645.637px,401.970px) rotate(-385.641deg)}20.1411%{transform:translate(666.816px,385.899px) rotate(-391.340deg)}20.3629%{transform:translate(685.713px,367.148px) rotate(-397.994deg)}20.5847%{transform:translate(701.615px,345.899px) rotate(-405.585deg)}20.8065%{transform:translate(714.081px,322.403px) rotate(-413.927deg)}21.0282%{transform:translate(722.798px,297.320px) rotate(-422.644deg)}21.2500%{transform:translate(727.854px,271.196px) rotate(-431.258deg)}21.4718%{transform:translate(731.199px,244.824px) rotate(-438.070deg)}21.6935%{transform:translate(733.570px,218.334px) rotate(-442.561deg)}21.9153%{transform:translate(735.013px,191.782px) rotate(-444.978deg)}22.1371%{transform:translate(735.726px,165.181px) rotate(-446.884deg)}22.3589%{transform:translate(735.969px,138.568px) rotate(-448.385deg)}22.5806%,100%{transform:translate(736.000px,112.000px) rotate(-449.362deg)}}

/* ===== 2026-10-17 強み：右の余白に SCROLL 目印（縦線の上端・中央・下端に丸3つ。今何枚目かを白の塗りつぶしで表示）
   デザイン担当のお手本のまま。位置だけ今のカードに合わせた：
   目印はカードの器（.strength-stage）の中に置き、上下はカードと同じ（top:0／bottom:0）、
   横は「カードの右端から画面の右端まで」の余白のまん中（left:100%・幅＝(画面幅−カード幅)÷2）。 */
.worries .strength-scroll{position:absolute;z-index:3;top:0;bottom:0;left:100%;width:calc((100vw - 100%) / 2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;pointer-events:none;color:#fff}
.worries .strength-scroll-label{writing-mode:vertical-rl;font:500 11px/1 Roboto,Arial,sans-serif;letter-spacing:.3em}
.worries .strength-scroll-rail{position:relative;width:12px;height:180px}
.worries .strength-scroll-line{position:absolute;left:50%;top:6px;bottom:6px;width:1px;margin-left:-.5px;background:rgba(255,255,255,.5)}
.worries .strength-scroll-dots{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;align-items:center;margin:0;padding:0;list-style:none}
.worries .strength-scroll-dots li{width:12px;height:12px;border-radius:50%;background:var(--mt-green,#00843f);box-shadow:inset 0 0 0 1.5px #fff;transition:background-color .4s ease-out}
.worries .strength-scroll-dots li.current{background:#fff}
.worries .strength-scroll-chevron{display:block;width:14px;height:14px}
@media(max-width:900px){.worries .strength-scroll{display:none}}
/* 右の目印と役目がかぶるので、写真の上の 01 02 03 は出さない（お手本の指定） */
.worries .strength-pager{display:none}
@media(min-width:901px){.worries .strength-pager{display:none}}
/* ===== ここまで ===== */
/* ===== ここから下が今回の作業場所（検品のための目印。このファイルは上も下も全部、自由に直してよい） ===== */
/* 全体メニュー：左三分の二にページの一覧、右三分の一にお問い合わせ。スクロールせずに全部見える。親は太字＋丸い矢印、子は細い矢印で「押せる」を見せる */
.menu{padding:clamp(110px,15vh,150px) 6% 40px;display:none;flex-direction:column}
.menu.open{display:flex}
.menu-body{display:grid;grid-template-columns:2fr 1fr;column-gap:4%;width:100%;max-width:1150px;margin:0 auto;padding-top:clamp(16px,4vh,48px);border-top:1px solid #00a64f}
.menu-inner{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1fr);column-gap:5%;max-width:none;margin:0}
.menu-col{display:flex;flex-direction:column;gap:clamp(12px,2.6vh,26px)}
.menu .menu-parent{font-size:clamp(16px,1.4vw,20px);font-weight:700;padding:0 0 10px;border-bottom:2px solid #00a64f;display:flex;justify-content:space-between;align-items:center;gap:12px;transition:color .2s}
.menu .menu-parent::after{content:"";flex-shrink:0;width:26px;height:26px;border-radius:50%;background:#00a64f url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6l6 6-6 6' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;transition:transform .2s}
.menu .menu-parent:hover,.menu .menu-parent[aria-current]{color:#00a64f}
.menu .menu-parent:hover::after{transform:translateX(4px)}
.menu .menu-sub{list-style:none;margin:8px 0 0;padding:0}
.menu .menu-child{font-size:15px;font-weight:500;padding:8px 0;border-bottom:0;display:flex;align-items:center;gap:10px;transition:color .2s}
.menu .menu-child::before{content:"";flex-shrink:0;width:7px;height:7px;border-top:2px solid #00a64f;border-right:2px solid #00a64f;transform:rotate(45deg);margin-right:2px;transition:transform .2s}
.menu .menu-child:hover,.menu .menu-child[aria-current]{color:#00a64f}
.menu .menu-child:hover::before{transform:translateX(3px) rotate(45deg)}
.menu-main{display:flex;flex-direction:column}
.menu-legal{margin-top:auto;padding-top:clamp(20px,4vh,40px);display:flex;gap:24px}
.menu .menu-privacy{border-bottom:0;padding:0;font-size:12px;color:#5d7466}
.menu .menu-privacy:hover{color:#00a64f}
.menu-side{display:flex;flex-direction:column;padding:26px 26px 22px;background:#e8f6ee;border-radius:16px;align-self:start}
.menu-side-title{margin:0 0 6px;font-size:14px;font-weight:700;color:#143a29}
.menu .menu-tel{border-bottom:0;padding:0;font-size:clamp(24px,2.3vw,30px);font-weight:900;letter-spacing:.02em;color:#00a64f;gap:8px;white-space:nowrap}
.menu .menu-tel svg{width:.9em;height:.9em;flex-shrink:0}
.menu .menu-tel:hover{color:#00843f}
.menu-hours{margin:6px 0 18px;font-size:12px;line-height:1.6;color:#5d7466}
.menu .menu-choices{list-style:none;margin:0;padding:16px 0 0;border-top:1px solid #00a64f;display:flex;flex-direction:column;gap:8px}
.menu .menu-choices a{font-size:14px;font-weight:700;padding:11px 14px;border:1px solid #00a64f;border-radius:10px;background:#fff;display:flex;align-items:center;gap:10px;transition:background-color .2s,color .2s}
.menu .menu-choices a::after{content:"→";margin-left:auto;color:#00a64f;transition:transform .2s}
.menu .menu-choices a:hover{background:#00a64f;color:#fff}
.menu .menu-choices a:hover::after{color:#fff;transform:translateX(3px)}
.menu-choice-icon{width:20px;display:inline-flex;justify-content:center;color:#00a64f;font-size:16px;line-height:1}
.menu .menu-choices a:hover .menu-choice-icon{color:#fff}
.menu-choice-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(min-width:901px) and (max-width:1100px){
  .menu{padding-left:4%;padding-right:4%}
  .menu-body{grid-template-columns:1.75fr 1fr;column-gap:3%}
  .menu-inner{column-gap:4%}
  .menu .menu-parent{font-size:15px;gap:6px}
  .menu .menu-parent::after{width:20px;height:20px;background-size:13px}
  .menu .menu-child{font-size:13px;gap:7px}
  .menu-side{padding:20px 14px 16px}
  .menu .menu-tel{font-size:22px}
  .menu .menu-choices a{font-size:12.5px;padding:10px;gap:7px}
}
@media(max-width:900px){
  .menu-body{grid-template-columns:1fr;row-gap:28px}
}
@media(max-width:650px){
  .menu{padding:92px 20px 20px}
  .menu-body{padding-top:14px;row-gap:14px}
  .menu-inner{grid-template-columns:1fr 1fr;column-gap:16px;row-gap:18px}
  .menu-inner .menu-col:first-child{grid-row:span 2}
  .menu-col{gap:12px}
  .menu .menu-parent{font-size:15px;padding-bottom:7px}
  .menu .menu-parent::after{width:20px;height:20px;background-size:13px}
  .menu .menu-child{font-size:13px;padding:6px 0;gap:7px}
  .menu-legal{padding-top:10px;justify-content:center}
  .menu-side{padding:14px 16px;border-radius:12px}
  .menu-side-title{font-size:12px;text-align:center}
  .menu .menu-tel{font-size:24px;justify-content:center}
  .menu-hours{margin:4px 0 10px;font-size:11px;text-align:center}
  .menu .menu-choices{padding-top:10px;gap:6px}
  .menu .menu-choices a{font-size:13px;padding:7px 12px}
}
/* お困りごと：各お悩みの見出しの下の写真（横幅はお悩みの四角と同じ） */
.worries .worry-photo{margin:0 0 14px;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:3px;box-shadow:0 2px 10px #0000000f}
.worries .worry-photo img{display:block;width:100%;height:100%;object-fit:cover}
.worries .g1 .worry-photo img{object-position:50% 30%}
/* サイトマップのページ */
.sm-box{padding:44px 6%}
.sm-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 8%}
.sm-group{margin-bottom:22px}
.sm-parent{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:0 0 8px;border-bottom:2px solid #00a64f;font-size:17px;font-weight:700;color:#143a29;text-decoration:none}
.sm-parent::after{content:"";flex-shrink:0;width:22px;height:22px;border-radius:50%;background:#00a64f url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6l6 6-6 6' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.sm-parent:hover{color:#00a64f}
.sm-group ul{list-style:none;margin:6px 0 0;padding:0}
.sm-group li a{display:flex;align-items:baseline;gap:10px;padding:6px 0;font-size:14px;line-height:1.7;color:#143a29;text-decoration:none}
.sm-group li a::before{content:"";flex-shrink:0;width:6px;height:6px;border-top:2px solid #00a64f;border-right:2px solid #00a64f;transform:translateY(-2px) rotate(45deg)}
.sm-group li a:hover{color:#00a64f}
@media(max-width:650px){.sm-box{padding:28px 20px}.sm-grid{grid-template-columns:1fr}}

/* ---- 2026-10-18 WEBのかかりつけとは：「誰に聞けば」欄を写真背景に ---- */
.rn-why-photo{position:relative;isolation:isolate;overflow:hidden;margin:0;color:#fff}
.rn-why-photo .rn-why-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%;z-index:-2}
.rn-why-photo::before{content:'';position:absolute;inset:0;background:rgba(8,20,14,.66);z-index:-1}
.rn-why-photo .rn-why{color:#fff;text-align:center;padding:130px 5% 130px}
.rn-why-photo .rn-why .lower-big{color:#fff;margin-bottom:38px}
.rn-why-photo .rn-why p{margin-left:auto;margin-right:auto;max-width:780px;color:rgba(255,255,255,.92)}
@media(max-width:700px){.rn-why-photo .rn-why{padding:80px 6%;text-align:left}.rn-why-photo .rn-why .lower-big{text-align:center;font-size:27px;letter-spacing:-.02em}}

/* ===== 2026-10-18 強みのカード：ヨリソイ「成果が出る3つの理由」に寄せる
   太い薄緑のふち・白いカード・左上に大きな薄い英字「Reason 01」・写真は片側いっぱい（01と03は右、02は左）
   実測（1440px）：ふち9px・角22px・内側20px・写真はカード幅の約37%・英字66px・見出し30px/1.75・本文16px/1.8/字間.1em */
.worries .strength-slide{border:9px solid #7fe0ad;border-radius:22px;padding:20px;gap:0;background:#fff;box-sizing:border-box}
.worries .strength-slide:nth-child(odd){flex-direction:row-reverse}
.worries .strength-slide .strength-photo{border-radius:6px;overflow:hidden}
.worries .strength-text{position:relative;display:flex;flex-direction:column;justify-content:center;padding:30px clamp(24px,4vw,60px)}
.worries .strength-slide .strength-number{position:static;align-self:flex-start;margin:0 0 -20px calc(-1 * clamp(10px,1.6vw,26px));font:500 clamp(48px,4.6vw,66px)/1 Poppins,Roboto,Arial,sans-serif;letter-spacing:.05em;color:#e2f6ea;pointer-events:none;white-space:nowrap}
.worries .strength-slide .strength-number::before{content:'Reason '}
.worries .strength-slide:nth-child(even) .strength-number{align-self:flex-end;margin:0 calc(-1 * clamp(10px,1.6vw,26px)) -20px 0}
.worries .strength-text h3{position:relative;font-size:clamp(24px,2.2vw,30px);line-height:1.75;letter-spacing:.03em;margin:0 0 22px}
.worries .strength-text p{position:relative;font-size:16px;line-height:1.8;letter-spacing:.1em;margin:0}
@media(min-width:901px){
  .worries .strength-slide .strength-photo{width:37%;flex:none}
  .worries .strength-text{width:auto;flex:1}
}
@media(max-width:900px){
  .worries .strength-slide,.worries .strength-slide:nth-child(odd){flex-direction:column;border-width:6px;border-radius:18px;padding:12px}
  .worries .strength-text{padding:14px 8px 12px}
  .worries .strength-slide .strength-number,.worries .strength-slide:nth-child(even) .strength-number{align-self:flex-start;margin:0 0 -14px -4px;font-size:44px}
  .worries .strength-text p{font-size:15px;letter-spacing:.06em}
}

/* 2026-10-18 WEBのかかりつけとは：見出し写真のすぐ下から「誰に聞けば」の写真が始まる（すき間なし）
   見出しの下の部分（--rn-join）だけ地を透明にして、下の写真を見出し写真の裏に差し込む */
.rn-hero--joined{--rn-join:150px;z-index:1;padding-bottom:0;background:linear-gradient(#fff calc(100% - var(--rn-join)),transparent 0)}
.rn-hero--joined+.rn-why-photo{margin-top:calc(-1 * var(--rn-join,150px))}
.rn-hero--joined+.rn-why-photo .rn-why{padding-top:calc(130px + 150px)}
@media(max-width:700px){.rn-hero--joined{--rn-join:110px}.rn-hero--joined+.rn-why-photo{margin-top:-110px}.rn-hero--joined+.rn-why-photo .rn-why{padding-top:calc(80px + 110px)}}

/* ===== 2026-10-18 WEBのかかりつけとは：ワンストップ（お手本＝「すべてを一つの窓口に」のカード一覧） */
.rn-sp{display:none}
@media(max-width:650px){.rn-sp{display:inline}}
.rn-onestop{padding:110px 5% 120px;background:#f4f8f5;text-align:center;color:#1d2a23}
.rn-os-badge{display:inline-flex;flex-direction:column;align-items:center;gap:4px;margin:0 0 34px;padding:14px 46px 16px;border-radius:999px;background:#0f7a43;color:#fff;font-size:clamp(19px,1.7vw,24px);font-weight:900;letter-spacing:.12em;line-height:1.2}
.rn-os-badge span{font:600 11px/1 Roboto,Arial,sans-serif;letter-spacing:.2em;opacity:.85}
.rn-onestop h2{margin:0 0 18px;font-size:clamp(24px,2.4vw,34px);font-weight:900;line-height:1.6;letter-spacing:.04em}
.rn-os-lead{margin:0 0 56px;font-size:16px;line-height:1.9;color:#4a5a50}
.rn-os-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1180px;margin:0 auto;padding:0;list-style:none}
.rn-os-card{position:relative;display:flex;flex-direction:column;align-items:center;height:100%;box-sizing:border-box;padding:38px 24px 54px;border-radius:10px;background:#fff;box-shadow:0 6px 22px rgba(16,60,35,.07);color:inherit;text-decoration:none;transition:transform .25s,box-shadow .25s}
.rn-os-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(16,60,35,.12)}
.rn-os-icon{width:48px;height:48px;margin:0 0 20px;fill:none;stroke:#00a64f;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rn-os-card h3{margin:0 0 14px;font-size:18px;font-weight:900;line-height:1.5}
.rn-os-card p{margin:0;font-size:14px;line-height:1.85;letter-spacing:.04em;color:#5d6a62;text-align:left}
.rn-os-more{position:absolute;right:16px;bottom:16px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#00a64f;color:#fff;font-size:15px;line-height:1}
@media(max-width:1000px){.rn-os-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.rn-onestop{padding:70px 6% 80px}.rn-os-lead{margin-bottom:36px;font-size:15px}.rn-os-grid{grid-template-columns:1fr;gap:14px}.rn-os-card{padding:30px 22px 48px}}

/* ===== 2026-10-18 WEBのかかりつけとは：比べる表（お手本＝AFFEL HANSAの比較表）
   線なし・行ごとに交互の薄い地・真ん中はグレー・右の列は濃い緑の見出し＋薄い緑の列で目立たせる */
.rn-onewindow .rn-table-scroll{margin-top:10px}
.rn-onewindow .rn-compare{width:100%;border-collapse:collapse;border-spacing:0;border:0;background:none;box-shadow:none;border-radius:0;font-size:16px}
.rn-onewindow .rn-compare th,.rn-onewindow .rn-compare td{border:0;border-radius:0!important;padding:26px 32px;text-align:left;vertical-align:middle;line-height:1.75;letter-spacing:.06em;box-shadow:none}
.rn-onewindow .rn-compare thead th{padding:32px;font-size:clamp(18px,1.6vw,23px);font-weight:900;text-align:center;letter-spacing:.1em;background:#f0f2f1;color:#4d5952}
.rn-onewindow .rn-compare thead th:first-child{background:none}
.rn-onewindow .rn-compare thead th.is-us{background:#0f7a43;color:#fff}
.rn-onewindow .rn-compare tbody th{width:24%;font-weight:700;color:#1d2a23}
.rn-onewindow .rn-compare tbody td{width:38%;color:#3b4740;font-weight:500}
.rn-onewindow .rn-compare tbody tr:nth-child(odd) th,.rn-onewindow .rn-compare tbody tr:nth-child(odd) td{background:#f0f2f1}
.rn-onewindow .rn-compare tbody tr:nth-child(even) th,.rn-onewindow .rn-compare tbody tr:nth-child(even) td{background:#f8f9f8}
.rn-onewindow .rn-compare tbody tr:nth-child(odd) td.is-us{background:#e3f5ea}
.rn-onewindow .rn-compare tbody tr:nth-child(even) td.is-us{background:#f0faf4}
.rn-onewindow .rn-compare tbody td.is-us{color:#0b5a32;font-weight:700}
@media(max-width:700px){
  .rn-onewindow .rn-compare{font-size:14px;min-width:560px}
  .rn-onewindow .rn-compare th,.rn-onewindow .rn-compare td{padding:16px 14px}
  .rn-onewindow .rn-compare thead th{padding:18px 12px;font-size:15px}
  .rn-onewindow .rn-compare tbody th{width:24%}
}

/* ===== 2026-10-18 WEBのかかりつけとは：大切にしている3つのこと
   右＝三つの丸が三角に並び、太い帯でつながる図（お手本＝3要素のフロー図）／左＝01〜03の番号つきで3つをひと目で */
.ab-approach .about-graphic svg{max-width:560px;margin:0 auto;display:block}
.ab-approach .about-graphic text.ab3-center{font-size:20px;font-weight:900;fill:#0f5a35;letter-spacing:.08em;text-anchor:middle}
.ab-approach .about-graphic text.ag-en{text-anchor:middle;font-size:12px}
.about-panel.ab-approach .about-graphic .about-more{transform:none}
.ab-approach .ab3-list{list-style:none;margin:30px 0 34px;padding:0;display:grid;gap:14px;counter-reset:none}
.ab-approach .ab3-list li{display:flex;align-items:center;gap:22px;padding:20px 26px;border-radius:14px;background:#fff;border:2px solid #d6f3e3;box-shadow:0 6px 18px rgba(16,60,35,.05)}
.ab-approach .ab3-num{flex:none;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#00a64f;color:#fff;font:700 18px/1 Roboto,Arial,sans-serif;letter-spacing:.04em}
.ab-approach .ab3-list strong{display:block;margin:0 0 4px;font-size:22px;font-weight:900;letter-spacing:.12em;color:#0f5a35}
.ab-approach .ab3-list p{margin:0;font-size:15px;line-height:1.8;color:#3b4740}
.ab-approach .about-last{display:inline-block;margin:0;padding:6px 0;border-bottom:3px solid #7fe0ad;font-weight:900}
@media(max-width:650px){.ab-approach .ab3-list li{gap:16px;padding:16px 16px}.ab-approach .ab3-num{width:44px;height:44px;font-size:15px}.ab-approach .ab3-list strong{font-size:19px}.ab-approach .ab3-list p{font-size:14px}}

/* ===== 2026-10-18（2回目）強みのカード：ヨリソイにさらに寄せる
   ・英字「Reason 01」はカードの左上の角に大きく（02は右上）　・見出しはPCで1行
   ・本文を2段に　・下に「関連事例をチェック!」の箱（左に写真＋詳しく見る、右に名前・場所・チェックつきの3行） */
@media(min-width:901px){
  .worries .strength-stage{max-height:680px}
  .worries .strength-text h3 br{display:none}
}
.worries .strength-slide{position:relative}
@media(min-width:901px){.worries .strength-slide{position:absolute}}
.worries .strength-text{position:static;justify-content:center;padding:84px clamp(24px,3.4vw,52px) 26px}
.worries .strength-slide .strength-number,.worries .strength-slide:nth-child(even) .strength-number{position:absolute;top:8px;left:22px;right:auto;margin:0;align-self:auto;font-size:clamp(52px,5.6vw,80px);line-height:1;color:#e4f6ec;z-index:0}
.worries .strength-slide:nth-child(even) .strength-number{left:auto;right:22px}
.worries .strength-text h3{z-index:1;margin:0 0 18px;font-size:clamp(23px,2.1vw,30px);line-height:1.6;white-space:nowrap}
.worries .strength-text p{z-index:1;font-size:15px;line-height:1.85;letter-spacing:.08em}
.worries .strength-text p.rs-more{margin-top:4px}
/* 関連事例の箱 */
.rs-case{position:relative;display:flex;align-items:center;gap:22px;margin:26px 0 0 10px;padding:16px 18px 16px 16px;border:5px solid #e4f6ec;border-radius:8px;background:#f5fbf7;color:#1d2a23;text-decoration:none;transition:border-color .2s}
.rs-case:hover{border-color:#bfe9d2}
.rs-case-badge{position:absolute;z-index:2;top:-26px;left:-26px;display:grid;place-content:center;width:84px;height:84px;border-radius:50%;background:#0f7a43;color:#fff;font-size:15px;font-weight:900;line-height:1.25;text-align:center;letter-spacing:.04em}
.rs-case-badge::after{content:'';position:absolute;right:4px;bottom:2px;border:9px solid transparent;border-top-color:#0f7a43;border-left-color:#0f7a43;transform:rotate(-10deg)}
.rs-case-badge small{display:block;font-size:11px;font-weight:700}
.rs-case-photo{position:relative;flex:none;width:40%;aspect-ratio:1.6;border-radius:6px;overflow:hidden;background:#dfe9e3}
.rs-case-photo img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.rs-case-more{position:absolute;right:0;bottom:0;display:flex;align-items:center;gap:8px;padding:8px 12px 6px 16px;border-radius:12px 0 0 0;background:#fff;font-size:12.5px;font-weight:900;letter-spacing:.12em}
.rs-case-more i{font-style:normal;color:#00a64f}
.rs-case-body{min-width:0}
.rs-case-name{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;margin:0 0 8px;font-size:12px;font-weight:700}
.rs-case-name b{font-size:18px;font-weight:900;letter-spacing:.02em}
.rs-case-place{display:inline-flex;align-items:center;gap:4px;font-size:14px;color:#0f7a43}
.rs-pin{width:12px;height:15px;fill:#00a64f}.rs-pin circle{fill:#fff}
.rs-case ul{margin:0;padding:0;list-style:none;display:grid;gap:4px}
.rs-case li{display:flex;gap:7px;font-size:13px;line-height:1.6;letter-spacing:.02em}
.rs-check{flex:none;width:15px;height:15px;margin-top:3px}.rs-check circle{fill:#00a64f}.rs-check path{fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:900px){
  .worries .strength-text{padding:58px 8px 12px}
  .worries .strength-slide .strength-number,.worries .strength-slide:nth-child(even) .strength-number{top:auto;left:14px;right:auto;font-size:44px;transform:translateY(-6px)}
  .worries .strength-text h3{white-space:normal}
  .rs-case{flex-direction:column;align-items:stretch;gap:14px;margin:30px 0 0;padding:14px}
  .rs-case-photo{width:100%}
  .rs-case-badge{top:-22px;left:-10px;width:70px;height:70px;font-size:13px}
}

/* ===== 2026-10-18（3回目）WEBのかかりつけとは */
/* 比べる表：大きな白い角丸の箱に入れる */
.rn-onewindow .rn-table-box{margin-top:10px;padding:clamp(22px,3.4vw,52px);border-radius:28px;background:#fff;box-shadow:0 10px 36px rgba(16,60,35,.06)}
.rn-onewindow .rn-table-box .rn-table-scroll{margin-top:0}
@media(max-width:700px){.rn-onewindow .rn-table-box{padding:16px;border-radius:20px}}
/* 3つの丸の図：文字 */
.ab-approach .about-graphic text.ab3-l{font-size:24px;font-weight:900;fill:#1d2a23;letter-spacing:.1em;text-anchor:middle}
.ab-approach .about-graphic text.ab3-e{font:700 11px Roboto,Arial,sans-serif;fill:#0f7a43;letter-spacing:.2em;text-anchor:middle}
/* 3つのこと：縦幅を詰める（1行＝番号・言葉・説明を横に並べる） */
.ab-approach .ab3-list{margin:22px 0 22px;gap:8px}
.ab-approach .ab3-list li{gap:16px;padding:12px 18px;border-width:1.5px;border-radius:12px}
.ab-approach .ab3-list li>div{display:flex;align-items:center;gap:16px}
.ab-approach .ab3-num{width:38px;height:38px;font-size:14px}
.ab-approach .ab3-list strong{flex:none;width:4.2em;margin:0;font-size:19px}
.ab-approach .ab3-list p{font-size:14.5px;line-height:1.7}
.ab-approach .ab3-list p br{display:none}
@media(max-width:650px){.ab-approach .ab3-list li>div{display:block}.ab-approach .ab3-list strong{width:auto;margin-bottom:2px;font-size:18px}}
/* ワンストップ：10個（PC 5列×2段） */
.rn-os-grid--10{grid-template-columns:repeat(5,1fr);gap:16px;max-width:1240px}
.rn-os-grid--10 .rn-os-card{padding:30px 18px 28px}
.rn-os-grid--10 .rn-os-icon{width:44px;height:44px;margin-bottom:16px}
.rn-os-grid--10 .rn-os-card h3{font-size:16px;line-height:1.55;min-height:3.1em;display:flex;align-items:center;justify-content:center}
.rn-os-grid--10 .rn-os-card p{font-size:13px;line-height:1.85}
@media(max-width:1100px){.rn-os-grid--10{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.rn-os-grid--10{grid-template-columns:repeat(2,1fr);gap:10px}.rn-os-grid--10 .rn-os-card{padding:22px 12px}.rn-os-grid--10 .rn-os-card h3{font-size:14px}.rn-os-grid--10 .rn-os-card p{font-size:12.5px}}
.ab-approach .about-body .ab3-list p{margin:0;line-height:1.6;letter-spacing:.04em}.ab-approach .about-body .ab3-list li{min-height:0}

/* ===== 2026-10-18（4回目）大切にしている3つのこと：見本（つながる3つの輪＋説明カード）どおりに作り直し */
.ab-philo{--g1:#0aa55a;--g2:#3fcf8f;--g3:#d2ec72;position:relative;z-index:8;overflow:hidden;background:#f1f5f2;color:#1d2a23;padding:120px 6% 110px}
.ab-philo::before{content:"";position:absolute;top:0;right:0;width:min(30vw,380px);aspect-ratio:1.6;background:#fff;clip-path:polygon(0 0,100% 0,100% 100%);opacity:.9}
.ph-inner{position:relative;max-width:1180px;margin:0 auto;text-align:center}
.ph-label{margin:0 0 16px;font:700 14px/1 Roboto,Arial,sans-serif;letter-spacing:.24em;color:#0f7a43}
.ph-title{margin:0;font-size:clamp(28px,3.4vw,46px);font-weight:900;line-height:1.45;letter-spacing:.14em;color:#2b3a32}
/* 3つの輪：一筆書きのようにつながる（あとの輪が前の輪に重なる） */
.ph-rings{--d:clamp(210px,27vw,330px);--w:clamp(16px,1.9vw,24px);--pad:clamp(14px,1.7vw,22px);--ov:clamp(10px,1.4vw,20px);list-style:none;margin:64px 0 0;padding:0;display:flex;justify-content:center;isolation:isolate}
.ph-ring{position:relative;flex:none;width:var(--d);aspect-ratio:1;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:radial-gradient(circle closest-side,#fff calc(100% - var(--w)),transparent calc(100% - var(--w) + 1px)),linear-gradient(125deg,var(--g1) 8%,var(--g2) 50%,var(--g3) 92%)}
.ph-ring+.ph-ring{margin-left:calc(var(--ov) * -1)}
.ph-ring::before{content:"";position:absolute;inset:calc(var(--pad) * -1);z-index:-1;border-radius:50%;background:#fff;box-shadow:0 14px 40px rgba(16,60,35,.07)}
.ph-num{font:300 clamp(26px,2.6vw,34px)/1 Roboto,Arial,sans-serif;color:var(--g2);margin-bottom:clamp(10px,1.2vw,16px)}
.ph-ring strong{font-size:clamp(24px,2.5vw,34px);font-weight:900;letter-spacing:.24em;padding-left:.24em;color:#2b3a32;line-height:1.2}
.ph-en{margin-top:clamp(8px,1vw,14px);font:400 clamp(13px,1.2vw,16px)/1 Roboto,Arial,sans-serif;letter-spacing:.16em;color:#7d8a83}
/* 説明カード3枚＋下の波 */
.ph-cards-wrap{position:relative;margin-top:56px}
.ph-wave{position:absolute;left:50%;bottom:-110px;width:100vw;height:clamp(200px,22vw,300px);transform:translateX(-50%);z-index:0}
.ph-cards{position:relative;z-index:1;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.2vw,30px);text-align:left}
.ph-card{padding:26px 26px 30px;border-radius:24px;background:#fff;box-shadow:0 10px 30px rgba(16,60,35,.07)}
.ph-card-head{display:flex;align-items:center;gap:14px;padding-bottom:16px;border-bottom:2px dotted #8a958f}
.ph-card-num{flex:none;font:300 46px/1 Roboto,Arial,sans-serif;background:linear-gradient(160deg,var(--g1),var(--g3));-webkit-background-clip:text;background-clip:text;color:transparent}
.ph-card h3{margin:0;font-size:17px;font-weight:900;line-height:1.7;letter-spacing:.02em;color:#2b3a32}
.ph-card p{margin:16px 0 0;font-size:14.5px;line-height:1.95;letter-spacing:.06em;color:#4a554f}
.ph-foot{position:relative;z-index:1;margin-top:150px}
.ph-lead{margin:0;font-size:clamp(20px,2vw,26px);font-weight:900;letter-spacing:.08em;line-height:1.7}
.ph-lead span{display:inline-block;color:#0f7a43}
.ph-last{margin:10px 0 30px;font-size:clamp(15px,1.4vw,18px);font-weight:700;letter-spacing:.06em;color:#4a554f}
.ph-more{gap:16px;padding:16px 36px 16px 18px;font-size:18px}
.ph-more .mt-pill-icon{width:36px;height:36px;font-size:24px}
@media(max-width:900px){.ph-cards{grid-template-columns:1fr;max-width:560px;margin:0 auto}}
@media(max-width:650px){
  .ab-philo{padding:84px 16px 80px}
  .ph-title{letter-spacing:.08em}
  .ph-rings{--d:min(66vw,250px);--w:16px;--pad:13px;--ov:12px;flex-direction:column;align-items:center;margin-top:46px}
  .ph-ring+.ph-ring{margin-left:0;margin-top:calc(var(--ov) * -1)}
  .ph-card{padding:22px 20px 24px;border-radius:20px}
  .ph-card-num{font-size:40px}
  .ph-card h3{font-size:16px}
  .ph-card p{font-size:14px}
  .ph-wave{bottom:-80px;height:180px}
  .ph-foot{margin-top:110px}
  .ph-more{font-size:16px;padding:12px 28px 12px 14px}
}
.ph-card{padding:26px 22px 30px}.ph-card-head{gap:10px}.ph-card h3{font-size:16px;letter-spacing:0}

/* ===== 2026-10-18（5回目）背景の流れ：白→グレー→グレー→（波）→白→白→グレー（流れる文字）→CTA */
#about-details .ad-purpose{background:#fff}
.ab-philo{background:#f2f2f2;padding-bottom:0}
.ab-philo::before{content:none}
.ph-foot{margin:64px 0 0}
.ph-last{margin:10px 0 0}
/* 境目の波：横にゆらめく */
.ph-wave{position:relative;left:50%;width:100vw;margin-left:-50vw;margin-top:40px;height:clamp(120px,14vw,200px);overflow:hidden}
.ph-wave svg{display:block;width:100%;height:100%}
.ph-wave g{animation:ph-sway 14s linear infinite}
.ph-wave .ph-w2{animation-duration:19s;animation-direction:reverse}
.ph-wave .ph-w3{animation-duration:11s}
.ph-wave .ph-w4{animation-duration:24s;animation-direction:reverse}
@keyframes ph-sway{from{transform:translateX(0)}to{transform:translateX(-720px)}}
@media(prefers-reduced-motion:reduce){.ph-wave g{animation:none}}
/* 窓口ひとつ：白い背景＋大きな緑の角丸の箱 */
.rn-onestop{background:#fff;padding-top:60px}
.rn-os-box{max-width:1320px;margin:0 auto;padding:clamp(22px,3.6vw,56px);border-radius:clamp(24px,3vw,40px);background:linear-gradient(135deg,#0aa55a,#3fcf8f 60%,#8fdc7e)}
.rn-os-box .rn-os-grid{max-width:none}
.rn-os-box .rn-os-card{box-shadow:0 8px 22px rgba(0,60,30,.12)}
/* 代表メッセージ：白で地続き／流れる文字からグレー */
#about-details .ad-message{background:#fff}
#about-details .ad-message-marquee{background:#f2f2f2;padding-top:70px}
@media(max-width:650px){.ph-foot{margin-top:44px}.ph-wave{margin-top:28px}.rn-onestop{padding-top:40px}#about-details .ad-message-marquee{padding-top:50px}}
.ab-philo{padding-bottom:clamp(150px,17vw,240px)}
.ph-wave{position:absolute;left:0;right:0;bottom:-1px;width:auto;margin:0;transform:none;z-index:0}

/* ===== 2026-10-18（6回目）WEBのかかりつけとは：アニメーションを増やす */
.rv{transition:opacity .9s cubic-bezier(.16,1,.3,1),translate 1s cubic-bezier(.16,1,.3,1),scale 1s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--rv-i,0) * 110ms)}
.rv:not(.rv-in){opacity:0;translate:0 40px}
/* 表の行：左からすべり込む */
.rn-compare tbody tr.rv:not(.rv-in){translate:-40px 0}
.rn-compare tbody tr.rv{transition-delay:calc(var(--rv-i,0) * 90ms + 200ms)}
/* 説明カード：ふわっと＋ホバーで浮く */
.ph-card{transition:opacity .9s cubic-bezier(.16,1,.3,1),translate 1s cubic-bezier(.16,1,.3,1),transform .35s,box-shadow .35s;transition-delay:calc(var(--rv-i,0) * 140ms),calc(var(--rv-i,0) * 140ms),0s,0s}
.ph-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(16,60,35,.12)}
.ph-card-head{position:relative}
.ph-card-head::after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:2px;background:linear-gradient(90deg,#0aa55a,#d2ec72);transform:scaleX(0);transform-origin:left;transition:transform .8s cubic-bezier(.77,0,.18,1)}
.ph-card:hover .ph-card-head::after{transform:scaleX(1)}
/* 緑の箱：グラデーションがゆっくり流れる */
.rn-os-box{background:linear-gradient(120deg,#0aa55a,#3fcf8f,#8fdc7e,#3fcf8f,#0aa55a);background-size:300% 300%;animation:rn-os-flow 14s ease-in-out infinite}
@keyframes rn-os-flow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.rn-os-box.rv:not(.rv-in){scale:.96}
/* 10枚のカード：順番に */
.rn-os-card.rv:not(.rv-in){translate:0 30px;scale:.94}
.rn-os-grid--10 .rn-os-card{transition:opacity .8s cubic-bezier(.16,1,.3,1),translate .9s cubic-bezier(.16,1,.3,1),scale .9s cubic-bezier(.16,1,.3,1),transform .3s,box-shadow .3s;transition-delay:calc(var(--rv-i,0) * 70ms + 250ms),calc(var(--rv-i,0) * 70ms + 250ms),calc(var(--rv-i,0) * 70ms + 250ms),0s,0s}
.rn-os-box .rn-os-card:hover{transform:translateY(-6px);box-shadow:0 16px 30px rgba(0,60,30,.22)}
.rn-os-box .rn-os-card:hover .rn-os-icon{animation:rn-os-wiggle .6s ease}
@keyframes rn-os-wiggle{0%,100%{rotate:0deg}30%{rotate:-10deg}60%{rotate:8deg}}
/* 誰に聞けば（写真の背景）：ゆっくり寄っていく */
.rn-why-bg{animation:rn-why-zoom 22s ease-in-out infinite alternate}
@keyframes rn-why-zoom{from{scale:1}to{scale:1.08}}
@media(prefers-reduced-motion:reduce){.rv{opacity:1!important;translate:none!important;scale:none!important}.rn-os-box,.rn-why-bg{animation:none!important}}

/* ===== 2026-10-18（7回目）波をやめて、写真4枚をサイズ・高さバラバラに */
.ab-philo{padding-bottom:110px}
.ph-photos{display:flex;align-items:flex-start;justify-content:center;gap:clamp(14px,2vw,28px);margin:56px auto 0;max-width:1180px}
.ph-photo{margin:0;overflow:hidden;border-radius:clamp(16px,1.8vw,24px);box-shadow:0 14px 34px rgba(16,60,35,.12)}
.ph-photo img{display:block;width:100%;height:100%;object-fit:cover;transition:scale 1.2s cubic-bezier(.16,1,.3,1)}
.ph-photo:hover img{scale:1.05}
.ph-photo--1{width:30%;aspect-ratio:4/3;margin-top:50px}
.ph-photo--2{width:21%;aspect-ratio:3/4}
.ph-photo--2 img{object-position:72% 50%}
.ph-photo--3{width:25%;aspect-ratio:1;margin-top:110px}
.ph-photo--3 img{object-position:40% 50%}
.ph-photo--4{width:19%;aspect-ratio:4/5;margin-top:24px}
.ph-photo--4 img{object-position:60% 50%}
@media(max-width:650px){
  .ab-philo{padding-bottom:70px}
  .ph-photos{flex-wrap:wrap;gap:12px;margin-top:40px}
  .ph-photo{border-radius:14px}
  .ph-photo--1{width:56%;margin-top:0}
  .ph-photo--2{width:36%;margin-top:30px}
  .ph-photo--3{width:40%;margin-top:-30px}
  .ph-photo--4{width:50%;margin-top:6px}
}
/* 2026-10-18（8回目）写真も波もなし：ひとことの下で区切る */
.ab-philo{padding-bottom:120px}
@media(max-width:650px){.ab-philo{padding-bottom:80px}}

/* ===== 2026-10-18 会社概要・代表挨拶：見本（id-frontier 会社情報／代表メッセージ）の実測値で作り直し */
.co-visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.co-wrap,.msg-wrap{position:relative;z-index:1;max-width:1017px;margin:0 auto;padding:70px 20px 120px;color:#3b4740;font-size:15.6px;line-height:1.8;letter-spacing:.05em}
.co-pic{margin:0 0 72px}
.co-pic img{display:block;width:100%;aspect-ratio:1017/458;object-fit:cover;object-position:50% 45%;border-radius:10px}
/* 表：左＝緑の太字＋緑の太線、右＝グレーの細線 */
.co-table{width:100%;border-collapse:collapse;margin:0 0 20px}
.co-table th,.co-table td{padding:18.7px;border-bottom:1px solid #b3bab8;font-size:15.6px;line-height:1.8}
.co-table th{width:150px;color:#00a64f;font-weight:700;text-align:center;vertical-align:middle;border-bottom:3px solid #00a64f;white-space:nowrap}
.co-table td{vertical-align:top}
.co-table td a{color:#0f7a43}
.co-list{list-style:none;margin:0 -15px;padding:0;display:flex;flex-wrap:wrap}
.co-list li{position:relative;width:calc(100% / 3);padding:0 15px 0 30px;margin:0 0 9.5px;box-sizing:border-box}
.co-list li::before{content:"";position:absolute;left:15px;top:.9em;width:7px;height:1px;background:#8a958f}
/* 地図 */
.co-map{margin:62px 0 0}
.co-map-note{margin:0 0 16px;font-weight:700;color:#1d2a23}
.co-map-frame{overflow:hidden;border-radius:10px;height:287px}
.co-map-frame iframe{display:block;width:100%;height:100%;border:0}
/* 関連ページのタイル：写真＋緑の重ね・2×2＋横長1枚 */
.co-tiles{margin:84px 0 0}
.co-tiles ul{list-style:none;margin:0 -15px;padding:0;display:flex;flex-wrap:wrap;row-gap:26px}
.co-tiles li{width:50%;padding:0 15px;box-sizing:border-box}
.co-tiles li.co-tile--wide{width:100%}
.co-tile{position:relative;isolation:isolate;display:flex;align-items:center;gap:14px;height:140px;padding:0 59px;border-radius:10px;overflow:hidden;color:#fff;text-decoration:none}
.co-tile--wide .co-tile{height:149px}
.co-tile img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;filter:grayscale(.3);transition:scale .8s cubic-bezier(.16,1,.3,1)}
.co-tile::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,150,72,.9),rgba(0,166,79,.72));transition:opacity .4s}
.co-tile--wide .co-tile::before{background:linear-gradient(90deg,rgba(0,140,68,.9),rgba(63,207,143,.7))}
.co-tile-ttl{font-size:22px;font-weight:700;letter-spacing:.06em}
.co-tile-en{font:700 11px/1 Roboto,Arial,sans-serif;letter-spacing:.12em;opacity:.9}
.co-tile-arrow{margin-left:auto;font-style:normal;font-size:18px;transition:translate .4s}
.co-tile:hover img{scale:1.06}
.co-tile:hover::before{opacity:.82}
.co-tile:hover .co-tile-arrow{translate:8px 0}
/* 代表挨拶：写真＋右下の緑の帯のキャッチ */
.msg-wrap{max-width:843px}
.msg-head{position:relative;padding:0 0 13px;margin:0 0 58px}
.msg-head-pic{margin:0;width:70.7%}
.msg-head-pic img{display:block;width:100%;aspect-ratio:596/422;object-fit:cover;object-position:40% 40%;border-radius:10px}
.msg-catch{position:absolute;right:12%;bottom:13px;margin:0;display:flex;flex-direction:column;align-items:flex-start;gap:9px;font-size:33.8px;font-weight:700;line-height:1.2;letter-spacing:.05em}
.msg-catch span{display:inline-block;padding:8.4px;background:#00a64f;color:#fff}
.msg-body .lower-kicker{margin:0 0 18px}
.msg-body h3{margin:56px 0 29px;font-size:19.5px;font-weight:700;line-height:1.4;color:#00a64f;letter-spacing:.05em}
.msg-body .lower-kicker+h3{margin-top:0}
.msg-body p{margin:0 0 23.6px;font-size:15.7px;line-height:2;letter-spacing:.03em}
.msg-body .message-lead{font-weight:700;color:#1d2a23}
.msg-body .rn-msg-list{margin:0 0 23.6px}
.msg-wide{margin:58px 0}
.msg-wide img{display:block;width:100%;aspect-ratio:843/360;object-fit:cover;object-position:50% 35%;border-radius:10px}
.msg-sign{margin:40px 0 0!important;text-align:right}
.msg-sign strong{margin-left:14px;font-size:19.7px;font-weight:700;color:#1d2a23}
.msg-profile{margin:80px 0 0}
.msg-profile-ttl{display:flex;align-items:baseline;gap:14px;margin:0 0 18px;font-size:19.5px;font-weight:700;color:#1d2a23}
.msg-profile-ttl span{font:700 13px/1 Roboto,Arial,sans-serif;letter-spacing:.15em;color:#00a64f}
.msg-wrap .co-tiles{margin-left:-87px;margin-right:-87px}
@media(max-width:1060px){.msg-wrap .co-tiles{margin-left:0;margin-right:0}}
@media(max-width:767px){
  .co-wrap,.msg-wrap{padding:44px 16px 90px;font-size:15px}
  .co-pic{margin-bottom:40px}
  .co-pic img{aspect-ratio:3/2}
  .co-table th,.co-table td{display:block;width:auto;padding:12px 4px}
  .co-table th{text-align:left;padding-bottom:8px;border-bottom-width:2px}
  .co-table td{border-bottom:none;padding-bottom:20px}
  .co-list li{width:100%}
  .co-tiles{margin-top:56px}
  .co-tiles ul{row-gap:14px}
  .co-tiles li{width:100%}
  .co-tile,.co-tile--wide .co-tile{height:96px;padding:0 24px}
  .co-tile-ttl{font-size:18px}
  .msg-head{margin-bottom:40px}
  .msg-head-pic{width:100%}
  .msg-catch{position:relative;right:auto;bottom:auto;margin:-34px 0 0 14px;font-size:24px;gap:6px}
  .msg-body h3{margin:44px 0 18px;font-size:18px}
  .msg-body p{font-size:15px}
  .msg-wide{margin:40px 0}
  .msg-wide img{aspect-ratio:3/2}
}
/* 写真の形は枠で決める（img の height 指定に負けないように） */
.co-pic,.msg-head-pic,.msg-wide{overflow:hidden;border-radius:10px}
.co-pic{aspect-ratio:1017/458}
.msg-head-pic{aspect-ratio:596/422}
.msg-wide{aspect-ratio:843/360}
.co-pic img,.msg-head-pic img,.msg-wide img{width:100%;height:100%!important;aspect-ratio:auto;border-radius:0}
.co-list li{width:50%}
@media(max-width:767px){.co-pic,.msg-wide{aspect-ratio:3/2}.co-list li{width:100%}}

/* ===== 2026-10-19 WEBのかかりつけとは：3つのことの背景にTOPの緑の矢印を薄く */
/* 3つのこと：TOPの「私たちについて」と同じ矢印を、もっと薄く */
.ab-philo .ph-arrow{z-index:0;opacity:.08}

/* ===== 2026-10-19（2回目）OUR PURPOSE：左右に見切れる図形（見本＝recruit.iij-engineering.co.jp の concept：図形を左右に固めて置く）
   点々の円・中が空いたグラデの輪がくるくる回る／同心円・点のマス・小さな丸。色はサイトの緑 */
.ad-purpose{position:relative;isolation:isolate}
.ad-purpose>*:not(.ad-shapes){position:relative;z-index:1}
.ad-shapes{position:absolute;inset:0;z-index:0;pointer-events:none}
.ad-shapes i{position:absolute;display:block;aspect-ratio:1;border-radius:50%}
.ads-l,.ads-r{position:absolute;inset:0}
/* 点で埋めたドーナツ（薄く・ゆっくり回る） */
.ads-dots{background:radial-gradient(circle,#0aa55a 1.7px,transparent 2.2px) 0 0/13px 13px;-webkit-mask:radial-gradient(farthest-side,transparent 46%,#000 47%);mask:radial-gradient(farthest-side,transparent 46%,#000 47%);opacity:.32;animation:ads-spin 70s linear infinite}
/* 中が空いたグラデーションの輪（くるくる） */
.ads-ring{background:conic-gradient(from 0deg,#0aa55a,#3fcf8f 30%,#d2ec72 55%,rgba(210,236,114,0) 78%,#0aa55a);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - var(--w,28px)),#000 calc(100% - var(--w,28px) + 1px));mask:radial-gradient(farthest-side,transparent calc(100% - var(--w,28px)),#000 calc(100% - var(--w,28px) + 1px));opacity:.55;animation:ads-spin 16s linear infinite}
/* 点線の円（くるくる） */
.ads-dotline{border:3px dotted #0aa55a;opacity:.4;animation:ads-spin 40s linear infinite reverse}
/* 同心円 */
.ads-rings{background:repeating-radial-gradient(circle,transparent 0 13px,rgba(10,165,90,.45) 13px 14.5px);-webkit-mask:radial-gradient(farthest-side,#000 99%,transparent);mask:radial-gradient(farthest-side,#000 99%,transparent);opacity:.6}
/* 小さなグラデの丸 */
.ads-ball{background:linear-gradient(140deg,#3fcf8f,#d2ec72);opacity:.75}
/* 点のマス */
.ads-grid{border-radius:0;background:radial-gradient(circle,#3fcf8f 2.4px,transparent 3px) 0 0/22px 22px;opacity:.5}
@keyframes ads-spin{to{rotate:360deg}}
@keyframes ads-float{0%,100%{translate:0 0}50%{translate:0 -18px}}
/* 左：下のほうに固めて、左へ見切れる */
.ads-l1{width:440px;left:-120px;bottom:20px;opacity:.5}
.ads-l2{width:210px;left:-70px;bottom:150px;--w:26px;animation-duration:18s}
/* 右：上のほうに固めて、右へ見切れる */
.ads-r1{width:380px;right:-200px;top:-150px;--w:64px;animation-direction:reverse;animation-duration:22s}
.ads-r2{width:250px;right:-60px;top:-60px}
.ads-r3{width:230px;right:-70px;bottom:-115px;animation-direction:reverse;opacity:.45}
.ads-r5{width:132px;right:30px;bottom:70px}
@media(max-width:1000px){.ads-l,.ads-r{scale:.75}.ads-l{transform-origin:left bottom}.ads-r{transform-origin:right top}}
@media(max-width:650px){.ads-l,.ads-r{scale:.5}.ads-r5{display:none}}
/* 右下の点の輪を、次のブロックとの境目にまたがせる（横だけ切る） */
#about-details .ad-purpose{overflow:visible;overflow-x:clip}
.ad-shapes{clip-path:inset(0 0 -300px 0)}
@media(prefers-reduced-motion:reduce){.ad-shapes i{animation:none}}

/* ===== 2026-10-19（3回目）「誰に聞けば」に白い矢印／PURPOSEの図形を整理 */
/* 誰に聞けば：写真の手前・文字の奥に、TOPと同じ矢印を白で薄く */
.rn-why-photo .why-arrow{z-index:0;opacity:.14}
.rn-why-photo .why-arrow .about-arrow-curve{stroke:#fff}
.rn-why-photo .why-arrow .about-arrow-head{fill:#fff}
.rn-why-photo .rn-why{position:relative;z-index:1}
/* PURPOSE：左は点の輪を上（見出し〜「WEBにも、」の高さ）に。右は下に、太いグラデの輪と点のマス（写真の手前） */
.ad-shapes{z-index:auto;clip-path:none}
.ads-l,.ads-r{clip-path:inset(0 0 -300px 0)}
.ads-l{z-index:0}
.ads-r{z-index:2}
.ads-l1{width:540px;left:-230px;top:0;bottom:auto;opacity:.45}
.ads-r3{width:280px;right:-110px;top:auto;bottom:40px;--w:60px;opacity:.6;animation-direction:normal;animation-duration:18s}
.ads-r5{right:70px;bottom:340px}

/* ===== 2026-10-19（4回目）「誰に聞けば」の矢印を全部見せる／PURPOSE右下を「グラデ色の点の輪（くるくる）」に */
/* 矢印：切り取らずに枠内へ収める。上は見出し写真が重なる110pxを避ける */
.rn-why-photo .why-arrow{top:140px;bottom:auto;height:calc(100% - 180px)}
@media(max-width:650px){.rn-why-photo .why-arrow{top:120px;height:calc(100% - 140px)}}
/* 点で埋めた太い輪を、緑→黄緑のグラデ色にして回す */
.ads-gdots{background:conic-gradient(from 0deg,#0aa55a,#3fcf8f 35%,#d2ec72 65%,#0aa55a);
 -webkit-mask:radial-gradient(circle,#000 2.6px,transparent 3.2px) 0 0/14px 14px,radial-gradient(farthest-side,transparent 52%,#000 53%);-webkit-mask-composite:source-in;
 mask:radial-gradient(circle,#000 2.6px,transparent 3.2px) 0 0/14px 14px,radial-gradient(farthest-side,transparent 52%,#000 53%);mask-composite:intersect;
 opacity:.8;animation:ads-spin 30s linear infinite}

/* ===== 2026-10-19（5回目）矢印を画面の左はしから／PURPOSE右下＝太いグラデの輪＋その後ろで点の輪がくるくる */
.rn-why-photo .why-arrow{overflow:visible}
.ads-r3{opacity:.6;animation:ads-spin 18s linear infinite}
.ads-r6{width:300px;right:40px;bottom:-30px;opacity:.4;animation:ads-spin 50s linear infinite reverse}
/* 2026-10-19（6回目）右下：グラデの輪を小さく、点の輪を大きく */
.ads-r3{width:220px;right:-70px;bottom:60px;--w:50px}
.ads-r6{width:400px;right:0;bottom:-60px}
/* 2026-10-19（6回目）右下：グラデの輪を小さく、点の輪を大きく */
.ads-r3{width:220px;right:-70px;bottom:60px;--w:50px}
.ads-r6{width:400px;right:0;bottom:-60px}
/* 2026-10-19（7回目）右下：グラデの輪を上へ、点の輪を下へ */
.ads-r3{bottom:150px}
.ads-r6{bottom:-150px}

/* ===== 2026-10-19 ONE WINDOW・窓口ひとつにも、PURPOSEと同じ図形（太いグラデの輪／緑の点の輪・くるくる・はしで見切れる） */
#about-details{overflow-x:clip}
.bg-shapes{position:absolute;top:0;bottom:0;left:50%;width:100vw;translate:-50% 0;z-index:0;pointer-events:none}
.bg-shapes i{position:absolute;display:block;aspect-ratio:1;border-radius:50%}
.rn-onewindow{position:relative}
.rn-onewindow>*:not(.bg-shapes),.rn-onestop>*:not(.bg-shapes){position:relative;z-index:1}
.rn-onestop{position:relative;overflow-x:clip}
/* ONE WINDOW：左にグラデの輪、右下に点の輪 */
.ow1{width:260px;left:-110px;top:34%;--w:56px;opacity:.6;animation-duration:20s}
.ow2{width:360px;right:-170px;bottom:30px;opacity:.4;animation-direction:reverse;animation-duration:55s}
/* 窓口ひとつ：左上に点の輪、右下にグラデの輪（下のブロックにまたがる） */
.os1{width:340px;left:-170px;top:-30px;opacity:.4;animation-duration:60s}
.os2{width:240px;right:-100px;bottom:-90px;--w:52px;opacity:.6;animation-direction:reverse;animation-duration:20s}
@media(max-width:1000px){.bg-shapes i{scale:.7}}
@media(max-width:650px){.bg-shapes i{scale:.5}}
@media(prefers-reduced-motion:reduce){.bg-shapes i{animation:none}}
/* 2026-10-19 図形の位置調整：ONE WINDOW左の輪を見出し〜白い箱の上部へ・回転を速めに／窓口ひとつの左右を下へ、右は下のブロックの手前にまたがる */
.ow1{top:140px;animation-duration:12s}
.os1{top:120px}
.os2{bottom:-150px}
.rn-onestop{z-index:2}

/* ===== 2026-10-19 TOP：できること／お困りごと／OUR STRENGTHS にも図形（WEBのかかりつけとはと同じ：太いグラデの輪・点の輪・くるくる・はしで見切れる） */
/* 点の輪・グラデの輪の形は、どのページでも使えるように（.ad-shapes 以外でも） */
.bg-shapes .ads-dots{background:radial-gradient(circle,#0aa55a 1.7px,transparent 2.2px) 0 0/13px 13px;-webkit-mask:radial-gradient(farthest-side,transparent 46%,#000 47%);mask:radial-gradient(farthest-side,transparent 46%,#000 47%);animation:ads-spin 60s linear infinite}
/* 緑の背景の上は白い図形 */
.bg-shapes .ads-dots.ads-w{background:radial-gradient(circle,#fff 1.7px,transparent 2.2px) 0 0/13px 13px;opacity:.35}
.bg-shapes .ads-ring.ads-w{background:conic-gradient(from 0deg,#fff,#eaffc0 35%,#d2ec72 55%,rgba(210,236,114,0) 78%,#fff);opacity:.4}
/* できること：右上に点の輪、左下にグラデの輪 */
.ft-shapes{z-index:0}
.fs1{width:380px;right:-200px;top:-140px;opacity:.4}
.fs2{width:280px;left:-120px;bottom:40px;--w:56px;opacity:.6;animation-duration:14s;animation-direction:reverse}
/* お困りごと：左上に白い点の輪、右に白いグラデの輪 */
.worries-inner{position:relative;z-index:1}
.wo1{width:380px;left:-190px;top:40px}
.wo2{width:260px;right:-110px;top:300px;--w:52px;animation-duration:14s}
/* OUR STRENGTHS（スクロール中ずっと見える）：左下に白いグラデの輪、右上に白い点の輪 */
.st-shapes{z-index:0}
.strength-pin>.strengths-heading{position:relative;z-index:1}.strength-pin>.strength-stage{z-index:1}
.st1{width:260px;left:-110px;bottom:40px;--w:52px;animation-duration:14s;animation-direction:reverse}
.st2{width:380px;right:-190px;top:20px}
/* 2026-10-19（TOP図形2回目） */
/* できること：上の境目をまたげるよう縦は切らない（横だけ切る） */
.file-tabs{overflow:visible;overflow-x:clip}
.file-tabs .ft-bg{overflow:hidden}
.fs1{top:-190px}
/* 左のグラデの輪：大きく。「できること」の「こ」と「と」の間 → 白い箱の左下の角の奥 → 「WEBのことは」のW → 写真の奥 を通る円 */
@media(min-width:1001px){.fs2{width:660px;left:175px;top:281px;bottom:auto;--w:70px;opacity:.5}}
/* お困りごと：左の点の輪を上へ（上の写真の帯にかかったら手前）。右のグラデの輪は削除 */
.wo1{top:-120px;opacity:.45}
/* OUR STRENGTHS：右の点の輪を大きく・上の境目をまたぐ／左のグラデの輪を白い箱の左下の角あたりへ・濃く */
.st2{width:540px;right:-260px;top:-240px;opacity:.45}
.st1{width:300px;left:30px;bottom:-40px}
.bg-shapes .ads-ring.ads-w.st1{opacity:.85;background:conic-gradient(from 0deg,#fff,#f4ffd0 30%,#e4ff7a 55%,rgba(228,255,122,0) 80%,#fff)}
/* 2026-10-19（TOP図形3回目） */
/* できること：右の点の輪を少し下へ。左のグラデの輪は左下に大きく置き、左は画面の外・下は次の写真の帯の奥へ隠れる（下の境目で切る） */
.fs1{top:-100px}
.ft-shapes{clip-path:inset(-400px 0 0 0)}
.fs2,.bg-shapes .fs2{width:520px;left:-230px;top:auto;bottom:-230px;--w:70px;opacity:.55}
@media(min-width:1001px){.fs2{width:520px;left:-230px;top:auto;bottom:-230px}}
@media(max-width:1000px){.fs2{width:360px;left:-170px;bottom:-160px}}
/* お困りごと：左の点の輪を大きく・濃く */
.wo1{width:480px;left:-230px}
.bg-shapes .ads-dots.ads-w.wo1{opacity:.55}
/* OUR STRENGTHS：左のグラデの輪をもっと左へ（画面の外へ見切れる） */
.st1{left:-130px}
/* 2026-10-19 できること：左下のグラデの輪を太く・濃く */
.bg-shapes .ads-ring.fs2{--w:100px;opacity:.85}

/* ==== 2026-10-19 できること（/service/）作り直し：svx-（2回目・添付に寄せた版） ==== */
/* 4つのサービス：添付1と同じ4色・見出し＋リード付き */
.sv2-wrap.svx-svc{padding-bottom:40px}
.svx-svc-head{text-align:center;margin-bottom:48px}
.svx-svc-head .lower-kicker{margin-bottom:10px}
.svx-svc-ttl{margin:0 0 30px;font:700 clamp(24px,2.4vw,30px)/1.4 var(--display-font);color:#143a29;letter-spacing:.06em}
.svx-svc-lead{margin:0;font:700 clamp(19px,2.3vw,30px)/1.75 var(--display-font);color:#1d2a23;letter-spacing:.02em;word-break:auto-phrase;text-wrap:balance}
.svx-panel{display:grid;grid-template-columns:repeat(4,1fr);padding:14px;border-radius:24px;background:#fff;box-shadow:0 18px 50px rgba(16,60,35,.08)}
.svx-col{display:flex;flex-direction:column;align-items:center;gap:12px;padding:44px 26px 38px;color:#fff;text-align:center;text-decoration:none;background:var(--c);transition:filter .3s}
.svx-col:nth-child(1){--c:#2e657e;border-radius:14px 0 0 14px}
.svx-col:nth-child(2){--c:#367481}
.svx-col:nth-child(3){--c:#478c87}
.svx-col:nth-child(4){--c:#539f8a;border-radius:0 14px 14px 0}
.svx-col:hover{filter:brightness(1.08)}
.svx-icon{display:grid;place-items:center;width:92px;height:92px;margin-bottom:6px;border-radius:50%;background:rgba(255,255,255,.12);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.svx-icon svg{width:42px;height:42px;fill:none;stroke:#fff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.svx-en{font:700 12px/1.4 Roboto,Arial,sans-serif;letter-spacing:.16em;opacity:.85}
.svx-ttl{font:700 clamp(19px,1.75vw,23px)/1.45 var(--display-font);letter-spacing:.02em;word-break:auto-phrase;white-space:nowrap}
.svx-txt{font-size:14px;line-height:1.95;font-weight:500;text-align:left;word-break:auto-phrase;text-wrap:pretty}
.svx-price{margin-top:auto;padding-top:14px;width:100%;border-top:1px solid rgba(255,255,255,.35);font-size:13px;line-height:1.8;font-weight:700;text-align:left}
.svx-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:170px;margin-top:10px;padding:14px 22px;border-radius:12px;background:#fff;color:#2e657e;font-size:14px;font-weight:900;box-shadow:0 6px 16px rgba(0,0,0,.12);transition:transform .3s}
.svx-btn i{font-style:normal;font-size:18px;line-height:1}
.svx-col:hover .svx-btn{transform:translateY(-2px)}
@media(max-width:1000px){.svx-panel{grid-template-columns:repeat(2,1fr)}.svx-col:nth-child(1){border-radius:14px 0 0 0}.svx-col:nth-child(2){border-radius:0 14px 0 0}.svx-col:nth-child(3){border-radius:0 0 0 14px}.svx-col:nth-child(4){border-radius:0 0 14px 0}}
@media(max-width:600px){.svx-svc-head{margin-bottom:32px}.svx-svc-ttl{margin-bottom:18px}.svx-panel{grid-template-columns:1fr;padding:10px;border-radius:20px}.svx-col{padding:34px 22px 30px}.svx-col:nth-child(n){border-radius:0}.svx-col:first-child{border-radius:12px 12px 0 0}.svx-col:last-child{border-radius:0 0 12px 12px}.svx-ttl{font-size:21px}}

/* ONE WINDOW：左に図（添付2・3＝重なる丸＋グラデの札＋中央の白い丸）、右に文章とリンク一覧 */
.svx-window{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(30px,5vw,80px);align-items:center;padding-top:90px}
.svx-window-text p{word-break:auto-phrase;text-wrap:pretty}
.svx-window-text h2{margin-bottom:34px}
.svx-chart{position:relative;width:100%;max-width:580px;aspect-ratio:1;margin:0 auto}
.svx-sat{position:absolute;width:46.5%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:#e3f2e9;color:#143a29;text-align:center}
.svx-sat1{left:25.5%;top:25.5%}.svx-sat2{left:74.5%;top:25.5%}.svx-sat3{left:25.5%;top:74.5%}.svx-sat4{left:74.5%;top:74.5%}
.svx-sat-in{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;gap:12px}
.svx-sat1 .svx-sat-in,.svx-sat2 .svx-sat-in{justify-content:flex-start;padding-top:19%}
.svx-sat3 .svx-sat-in,.svx-sat4 .svx-sat-in{justify-content:flex-end;padding-bottom:19%}
.svx-sat1 .svx-sat-in,.svx-sat3 .svx-sat-in{translate:-10% 0}
.svx-sat2 .svx-sat-in,.svx-sat4 .svx-sat-in{translate:10% 0}
.svx-sat-desc{font-size:13px;line-height:1.6;font-weight:700;color:#2b3a32}
.svx-ill{width:27%;height:auto}
.svx-pill{position:absolute;left:50%;translate:-50% 0;z-index:2;padding:9px 24px;border-radius:999px;background:linear-gradient(100deg,#0a6b3a 0%,#11a05a 72%,#c8e86a 100%);color:#fff;font-size:15px;font-weight:900;letter-spacing:.04em;white-space:nowrap;box-shadow:0 6px 14px rgba(10,107,58,.18)}
.svx-sat1 .svx-pill,.svx-sat2 .svx-pill{top:-3%}
.svx-sat3 .svx-pill,.svx-sat4 .svx-pill{bottom:-3%}
.svx-hub{position:absolute;left:50%;top:50%;translate:-50% -50%;display:flex;flex-direction:column;align-items:center;justify-content:center;width:37%;aspect-ratio:1;border-radius:50%;background:#fff;box-shadow:0 0 0 18px rgba(255,255,255,.6),0 0 0 19px rgba(15,122,67,.12),0 16px 40px rgba(16,60,35,.12);color:#0f7a43;text-align:center;z-index:1}
.svx-hub-en{font:700 13px/1.4 Roboto,Arial,sans-serif;letter-spacing:.14em}
.svx-hub strong{margin-top:6px;font:900 clamp(20px,2.3vw,30px)/1.4 var(--display-font);letter-spacing:.04em}
.svx-links{margin:34px 0 0;padding:0;list-style:none;border-top:1px solid #cfe0d6}
.svx-links a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 4px;border-bottom:1px solid #cfe0d6;color:#143a29;font-size:18px;font-weight:900;text-decoration:none;transition:color .3s}
.svx-links i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #cfe0d6;color:#0f7a43;font-style:normal;font-size:20px;transition:background .3s,color .3s}
.svx-links a:hover{color:#0f7a43}
.svx-links a:hover i{background:#0f7a43;color:#fff}
@media(max-width:1000px){.svx-sat-desc{font-size:12px}.svx-pill{font-size:13px;padding:8px 18px}}
@media(max-width:900px){.svx-window{grid-template-columns:1fr;gap:56px}.svx-chart{max-width:520px}.svx-window-text{order:-1}}
@media(max-width:600px){.svx-window{padding-top:50px}.svx-sat-desc{display:none}.svx-ill{width:32%}.svx-pill{font-size:12px;padding:7px 12px}.svx-hub{box-shadow:0 0 0 10px rgba(255,255,255,.6),0 0 0 11px rgba(15,122,67,.12),0 10px 26px rgba(16,60,35,.12)}.svx-hub-en{font-size:10px;letter-spacing:.08em}.svx-links a{font-size:16px;padding:16px 2px}}

/* ONE PARTNER：添付4＝一筆書きでつながる輪（線が左から右へ描かれる）＋点線＋カード */
.svx-partner{padding-top:70px;padding-bottom:200px}
.svx-partner-head{display:grid;grid-template-columns:auto 1fr;gap:clamp(30px,6vw,90px);align-items:center;margin-bottom:50px}
.svx-partner-head h2{margin:0}
.svx-partner-head>p{margin:0;max-width:520px;justify-self:end;word-break:auto-phrase;text-wrap:pretty}
.svx-flow{padding:clamp(28px,5vw,70px) clamp(14px,5vw,70px);background:#fff;box-shadow:0 18px 50px rgba(16,60,35,.06)}
.svx-chain{position:relative;max-width:694px;margin:0 auto}
.svx-chain svg{display:block;width:100%;height:auto}
.svx-steps{position:absolute;inset:0;margin:0;padding:0;list-style:none}
.svx-step{position:absolute;left:var(--x);top:50%;translate:-50% -50%;display:flex;flex-direction:column;align-items:center;width:28%;text-align:center;color:#143a29}
.svx-step-num{font:700 14px/1.2 Roboto,Arial,sans-serif;letter-spacing:.1em;color:#0f9a55}
.svx-step b{margin-top:6px;font:700 clamp(13px,2.4vw,22px)/1.4 var(--display-font);word-break:auto-phrase}
.svx-step-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(8px,2vw,22px);max-width:694px;margin:0 auto;padding:0 2.02%}
.svx-step-cards p{position:relative;margin:44px 0 0;padding:20px 16px;border:1px solid #e3ebe6;border-radius:6px;background:#fff;font-size:15px;line-height:1.85;font-weight:700;text-align:center;color:#2b3a32;word-break:auto-phrase}
.svx-step-cards p::before{content:"";position:absolute;left:50%;bottom:100%;height:36px;border-left:2px dotted #6fcf9b;translate:-1px -4px}
.svx-price-link{margin-top:50px;text-align:center}
.svx-price-link p{margin:0 0 22px}
.svx-price-btn{--ac:#00a64f}
@media(max-width:700px){.svx-partner-head{grid-template-columns:1fr;gap:20px;margin-bottom:34px}.svx-partner-head>p{justify-self:start}.svx-step-num{font-size:12px}.svx-step-cards p{margin-top:30px;padding:12px 6px;font-size:12px;line-height:1.7}.svx-step-cards p::before{height:24px}}
@media(max-width:600px){.svx-partner-head h2,.svx-window-text h2{font-size:26px}}

@media(max-width:700px){.svx-step{width:19%}.svx-step b{font-size:12px;margin-top:2px}.svx-step-num{font-size:11px}}

/* 3回目：ONE PARTNER＝輪は接するだけ・線は輪ごとに左上→右下の弧（添付4）。1つ目から順に描かれる */
.svx-chain.is-ready .svx-arc{stroke-dasharray:1;stroke-dashoffset:1}
.svx-chain.is-in .svx-arc{stroke-dashoffset:0;transition:stroke-dashoffset .9s cubic-bezier(.45,.05,.4,1)}
.svx-chain.is-in .svx-arc2{transition-delay:.75s}
.svx-chain.is-in .svx-arc3{transition-delay:1.45s}
/* ONE WINDOW：4つの丸にすき間。離れた所から、にゅっと真ん中へ寄ってくる */
.svx-chart.is-ready .svx-sat{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.86)}
.svx-chart.is-ready .svx-hub{opacity:0;transform:scale(.6)}
.svx-chart.is-in .svx-sat,.svx-chart.is-in .svx-hub{opacity:1;transform:none;transition:transform 1s cubic-bezier(.34,1.45,.55,1),opacity .5s ease-out}
.svx-sat1{--dx:-34%;--dy:-34%}.svx-sat2{--dx:34%;--dy:-34%}.svx-sat3{--dx:-34%;--dy:34%}.svx-sat4{--dx:34%;--dy:34%}
.svx-chart.is-in .svx-sat2{transition-delay:.08s}.svx-chart.is-in .svx-sat3{transition-delay:.16s}.svx-chart.is-in .svx-sat4{transition-delay:.24s}
.svx-chart.is-in .svx-hub{transition-delay:.5s}
@media(prefers-reduced-motion:reduce){.svx-chain.is-ready .svx-arc{stroke-dashoffset:0}.svx-chart.is-ready .svx-sat,.svx-chart.is-ready .svx-hub{opacity:1;transform:none}}
.svx-window{overflow-x:clip}
/* 4つのサービス：アイコンをイラストに（2026-10-19） */
.svx-illust{display:block;width:auto;max-width:88%;height:150px;object-fit:contain;margin:-8px auto 8px;filter:drop-shadow(0 8px 14px rgba(0,0,0,.12))}
@media(max-width:600px){.svx-illust{height:130px}}
.svx-price{min-height:62px}
/* イラストの後ろに白い丸 */
.svx-illust{width:172px;height:172px;max-width:none;padding:20px;margin:0 auto 10px;border-radius:50%;background:#fff;object-fit:contain;filter:none;box-shadow:0 10px 24px rgba(0,0,0,.12)}
@media(max-width:600px){.svx-illust{width:150px;height:150px;padding:18px}}

/* ONE PARTNER：インフォグラフィック */
.mt-connect{--mt-ink:#193c2c;color:var(--mt-ink);font-family:"Zen Kaku Gothic New","Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;background:#f2f3f0;padding:clamp(32px,5vw,76px) clamp(16px,5vw,72px)}
.mt-connect *{box-sizing:border-box}.mt-connect .mt-inner{max-width:1280px;margin:auto}.mt-connect .mt-kicker{font-size:16px;letter-spacing:.13em;color:#00a153;font-weight:800;margin:0 0 30px}.mt-connect .mt-heading{display:grid;grid-template-columns:1.15fr 1fr;gap:60px;margin-bottom:54px}.mt-connect h2{font-size:clamp(26px,3.2vw,44px);line-height:1.65;font-weight:900;margin:0}.mt-connect .mt-lead{font-size:clamp(16px,1.5vw,20px);font-weight:700;line-height:2;margin:6px 0 0}
.mt-connect .mt-panel{background:#fff;padding:48px clamp(16px,5vw,76px) 54px}.mt-connect .mt-diagram{max-width:1000px;margin:auto}.mt-connect .mtc-svg{display:block;width:100%;height:auto;overflow:visible}.mt-connect .mtc-mobile{display:none}.mt-connect .mtc-title{fill:#193c2c;font-size:21px;font-weight:900}.mt-connect .mtc-number{fill:#009e56;font-size:14px;letter-spacing:1px;font-weight:800}.mt-connect .mtc-desc{fill:#193c2c;font-size:13px;font-weight:700}
.mt-connect .mt-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:-3px 2.63% 0;list-style:none;padding:0}.mt-connect .mt-card{padding-top:23px;position:relative}.mt-connect .mt-card:before{content:"";position:absolute;left:50%;top:-5px;height:28px;border-left:2px dotted #8cc899}.mt-connect .mt-card p{border:1px solid #e2e8e1;border-radius:6px;margin:0;padding:20px 8px;text-align:center;font-weight:700;font-size:clamp(14px,1.4vw,18px);line-height:1.9}.mt-connect .mt-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
/* 外周線を接点で次の円へつなぐ。円自体は回転させない。表示時に一度だけ描画。 */
.mt-connect.mtc-animate .mtc-line{stroke-dasharray:100;animation:mtc-draw 2.4s cubic-bezier(.35,0,.2,1) both}.mt-connect.mtc-animate .mtc-line-1{animation-delay:1.05s}.mt-connect.mtc-animate .mtc-label{animation:mtc-in .7s ease both;animation-delay:.25s}.mt-connect.mtc-animate .mtc-label-1{animation-delay:.9s}.mt-connect.mtc-animate .mtc-label-2{animation-delay:1.6s}
/* 矢印は線が届くタイミングで表示。回転・帯の形状は変更しない。 */
.mt-connect.mtc-animate .mtc-arrow{animation:mtc-in .25s ease both;animation-delay:var(--mtc-delay)}
@keyframes mtc-draw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}@keyframes mtc-in{from{opacity:0}to{opacity:1}}
@media(max-width:640px){.mt-connect .mt-heading{grid-template-columns:1fr;gap:18px;margin-bottom:30px}.mt-connect .mt-kicker{font-size:13px;margin-bottom:18px}.mt-connect .mt-panel{padding:24px 18px}.mt-connect .mtc-desktop{display:none}.mt-connect .mtc-mobile{display:block;max-width:350px;margin:auto}.mt-connect .mt-cards{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}}
@media(prefers-reduced-motion:reduce){.mt-connect .mtc-line,.mt-connect .mtc-label,.mt-connect .mtc-arrow{animation:none!important}}
/* ページに合わせる：外側の背景・余白・書体はページ側のものを使う */
.mt-connect.mtc-embed{background:none;padding:0;font-family:inherit}
/* イラストが白い丸のふちで切れないように：丸を少し大きく・内側の余白を広く（絵の四角の角が丸の内側に入る） */
.svx-illust{width:184px;height:184px;padding:30px}
@media(max-width:600px){.svx-illust{width:160px;height:160px;padding:26px}}
/* 白い丸は器（span）に持たせ、イラスト自体は切り抜かない（img に border-radius を付けると余白の内側の小さい丸で切れるため） */
.svx-illust{display:grid;place-items:center;flex:none;width:184px;height:184px;padding:0;margin:0 auto 10px;border-radius:50%;background:#fff;box-shadow:0 10px 24px rgba(0,0,0,.12)}
.svx-illust img{display:block;width:136px;height:136px;object-fit:contain;border-radius:0}
@media(max-width:600px){.svx-illust{width:160px;height:160px}.svx-illust img{width:118px;height:118px}}
/* ONE WINDOW：丸の中の文字とアイコンを、丸（と札）の左右の真ん中にそろえる */
.svx-sat1 .svx-sat-in,.svx-sat2 .svx-sat-in,.svx-sat3 .svx-sat-in,.svx-sat4 .svx-sat-in{translate:none}
.svx-sat1 .svx-sat-in,.svx-sat2 .svx-sat-in{padding-top:21%}
.svx-sat3 .svx-sat-in,.svx-sat4 .svx-sat-in{padding-bottom:21%}
.svx-sat3 .svx-sat-in,.svx-sat4 .svx-sat-in{padding-bottom:15%}
/* ONE WINDOW：説明文なし。アイコンを花びら（真ん中の丸に隠れていない部分）の中心へ */
.svx-sat .svx-sat-in,.svx-sat1 .svx-sat-in,.svx-sat2 .svx-sat-in,.svx-sat3 .svx-sat-in,.svx-sat4 .svx-sat-in{display:grid;place-items:center;padding:0}
.svx-sat1 .svx-sat-in{translate:-3.6% -3.6%}.svx-sat2 .svx-sat-in{translate:3.6% -3.6%}.svx-sat3 .svx-sat-in{translate:-3.6% 3.6%}.svx-sat4 .svx-sat-in{translate:3.6% 3.6%}
.svx-ill,.svx-sat .svx-ill{width:36%}
/* アイコンは丸そのものの中心（隠れている部分も含めて計算） */
.svx-sat1 .svx-sat-in,.svx-sat2 .svx-sat-in,.svx-sat3 .svx-sat-in,.svx-sat4 .svx-sat-in{translate:none}

/* ==== 2026-10-19 できること 4回目 ==== */
/* タイトル（写真）〜OUR SERVICE を同じ背景で地続きに（このページだけ） */
.svx-page .rn-hero{background:none}
/* 「4つのできること」：他の見出しと同じ大きさにそろえる */
.svx-svc-ttl{margin:0 0 22px;font:900 38px/1.5 var(--display-font);letter-spacing:normal}
.svx-svc-lead{font:700 18px/2 var(--body-font,inherit);letter-spacing:.04em}
@media(max-width:700px){.svx-svc-ttl{font-size:26px}.svx-svc-lead{font-size:16px}}
/* 4つのカードのボタン：TOPの「詳しく見る」（mt-pill）と同じ形 */
.svx-more{margin-top:12px;cursor:pointer}
.svx-col:hover .svx-more{background:var(--ac,#00a64f);color:#fff}
.svx-col:hover .svx-more .mt-pill-icon{background:#fff;color:var(--ac,#00a64f)}
/* ONE WINDOW：背景を白に（画面いっぱい） */
.svx-band-white{background:#fff}
.svx-band-white .svx-window{padding-bottom:110px}
/* ONE PARTNER：番号なし・カードを長めの文章に */
.mt-connect .mt-card-ttl{display:none}
.mt-connect .mt-card p{padding:20px 22px;text-align:left;font-size:15px;line-height:1.95;font-weight:500;word-break:auto-phrase;text-wrap:pretty}
@media(max-width:640px){
  .mt-connect .mt-cards{position:static;width:auto;height:auto;overflow:visible;clip-path:none;grid-template-columns:1fr;gap:14px;margin:26px 0 0}
  .mt-connect .mt-card{padding-top:0}.mt-connect .mt-card:before{display:none}
  .mt-connect .mt-card-ttl{display:block;margin:0 0 8px;font-weight:900;font-size:16px;color:#0f7a43}
  .mt-connect .mt-card p{border:0;padding:0 0 14px;border-bottom:1px solid #e2e8e1;border-radius:0}
}
/* OUR SERVICE の終わり・ONE WINDOW の始まりに余白を足す */
.sv2-wrap.svx-svc{padding-bottom:110px}
.svx-band-white .svx-window{padding-top:130px}
@media(max-width:700px){.sv2-wrap.svx-svc{padding-bottom:70px}.svx-band-white .svx-window{padding-top:80px}}
/* 2026-10-19 できること：見切れた大きい輪（くるくる）①OUR SERVICE右 ②OUR SERVICE/ONE WINDOW境目の左 ③ONE WINDOW/ONE PARTNER境目の右（グラデ＋点々） */
.svx-page{overflow-x:clip}
.svx-svc,.svx-band-white,.svx-partner{position:relative}
.svx-svc>*:not(.bg-shapes),.svx-band-white>*:not(.bg-shapes),.svx-partner>*{position:relative;z-index:1}
.svx-s1{width:460px;right:-230px;top:-40px;opacity:.32}
.svx-s2{width:480px;left:-250px;top:-240px;opacity:.32;animation-direction:reverse}
.svx-s3{width:400px;right:-170px;bottom:-200px;--w:80px;opacity:.6;animation-duration:18s}
.svx-s4{width:520px;right:-300px;bottom:-330px;opacity:.32;animation-direction:reverse}
/* なおた様調整：グラデの輪を小さく・上へ／近くの点々を左へ／料金の段の左はしに点々 */
.svx-partner>*:not(.bg-shapes){position:relative;z-index:1}
.svx-partner>.bg-shapes{position:absolute;z-index:0}
.svx-s3{width:320px;right:-140px;bottom:-110px;--w:66px}
.svx-s4{right:-200px}
.svx-s5{width:440px;left:-220px;top:800px;opacity:.32;animation-duration:65s}
.svx-s4{bottom:-430px}
/* なおた様：ONE PARTNER の3つの白い四角を角丸に */
@media(min-width:641px){.mt-connect .mt-card p{border-radius:16px}}
/* ===== 2026-10-19 料金：パターン別の料金のめやす（pcx-）添付の料金表を参考に。タブを押すと中身が切りかわる */
.pcx{background:#eef1ee;padding:110px 0 130px}
.pcx-wrap{max-width:1200px;margin:auto;padding:0 5%;color:#192820}
.pcx-wrap>.lower-kicker{text-align:center;margin-bottom:10px}
.pcx-ttl{text-align:center;font-weight:900;font-size:38px;line-height:1.5;margin:0 0 18px}
.pcx-lead{text-align:center;line-height:2;margin:0 0 70px}
.pcx-svc{margin-top:100px}
.pcx-svc:first-of-type{margin-top:0}
.pcx-name{position:relative;display:flex;align-items:center;justify-content:center;width:min(600px,100%);min-height:66px;margin:0 auto 74px;padding:12px 30px 12px 120px;border-radius:40px;background:#1f3a2d;color:#fff;font-size:26px;font-weight:900;letter-spacing:.04em}
.pcx-name-ill{position:absolute;left:28px;bottom:6px;display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:#fff;box-shadow:0 6px 16px rgba(16,60,35,.18)}
.pcx-name-ill img{width:76%;height:auto}
.pcx-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;align-items:end}
.pcx-tab{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:168px;padding:34px 16px 22px;border:0;border-radius:6px 6px 0 0;background:#3d5a4b;color:#fff;font:inherit;cursor:pointer;transition:background .2s}
.pcx-tab:hover{background:#476958}
.pcx-tab strong{font-size:22px;font-weight:900;line-height:1.6;letter-spacing:.03em}
.pcx-no{position:absolute;top:-17px;left:50%;translate:-50% 0;white-space:nowrap;padding:6px 44px;border-radius:20px;background:#1f3a2d;color:#fff;font-size:15px;font-weight:900;letter-spacing:.06em}
.pcx-arrow{width:10px;height:10px;border-right:2.5px solid;border-bottom:2.5px solid;rotate:45deg;margin-top:2px}
.pcx-tab.is-active{min-height:198px;background:#fff;color:#192820;cursor:default}
.pcx-tab.is-active .pcx-arrow{visibility:hidden}
.pcx-pop{position:absolute;top:-102px;left:50%;translate:-50% 0;white-space:nowrap;padding:8px 40px;border-radius:4px;background:#0aa55a;color:#fff;font-size:15px;font-weight:900;letter-spacing:.04em}
.pcx-pop::after{content:"";position:absolute;left:50%;bottom:-9px;translate:-50% 0;border:9px solid transparent;border-bottom:0;border-top-color:#0aa55a}
.pcx-tab.is-active .pcx-pop{top:-72px}
.pcx-card{background:#fff;padding:40px 40px 46px;border-radius:0 0 10px 10px}
.pcx-ph{margin:0 0 30px;padding:16px 30px;border-left:5px solid #c9d3cc;background:#f5f7f5;font-size:24px;font-weight:900;line-height:1.5}
.pcx-ph small{font-size:15px;margin-left:6px}
.pcx-body{display:grid;grid-template-columns:minmax(0,390px) 1fr;gap:32px;align-items:start}
.pcx-kosei{border:3px solid #eef1ee;border-radius:10px;overflow:hidden}
.pcx-kosei-h,.pcx-sh{margin:0;padding:9px 18px;background:#eef1ee;font-size:15px;font-weight:900}
.pcx-kosei-h{text-align:center}
.pcx-kosei ul,.pcx-spec ul{list-style:none;margin:0;padding:0}
.pcx-kosei ul{padding:16px 22px 20px}
.pcx-kosei li{display:flex;align-items:center;gap:10px;padding:6px 0;font-weight:700;font-size:15px;line-height:1.6}
.pcx-kosei svg{flex:none;width:20px;height:20px;fill:none;stroke:#0f7a43;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.pcx-who{border:3px solid #6fd19c;border-radius:8px;padding:20px 26px 18px}
.pcx-who p{margin:0;font-size:14px;line-height:1.95}
.pcx-who .pcx-who-h{margin-bottom:6px;color:#0aa55a;font-size:17px;font-weight:900}
.pcx-spec{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:20px}
.pcx-sh{border-radius:4px}
.pcx-spec ul{padding:12px 12px 0}
.pcx-spec li{font-size:14px;line-height:1.9}
.pcx-price{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:16px;margin-top:34px;padding-top:24px;border-top:2px solid #eef1ee}
.pcx-price p{display:flex;margin:0;border:3px solid #1f3a2d;border-radius:6px;overflow:hidden}
.pcx-price span{display:grid;place-items:center;padding:10px 18px;background:#1f3a2d;color:#fff;font-size:15px;font-weight:900;white-space:nowrap}
.pcx-price small{font-size:11px}
.pcx-price b{display:grid;place-items:center;min-width:200px;padding:8px 22px;font-size:22px;font-weight:900;letter-spacing:.03em}
.pcx-price .pcx-ex{border-color:#0aa55a}
.pcx-price .pcx-ex span{background:#0aa55a}
.pcx-price .pcx-ex b{background:#f2fbf6;color:#0f7a43}
.pcx-note{margin:30px 0 0;text-align:center;font-size:19px;font-weight:900;line-height:1.7}
@media(max-width:900px){.pcx-body{grid-template-columns:1fr}.pcx-tabs{gap:14px}.pcx-tab strong{font-size:17px}.pcx-no{padding:5px 18px;font-size:13px}.pcx-pop{padding:7px 14px;font-size:13px}}
@media(max-width:650px){
 .pcx{padding:80px 0 90px}.pcx-ttl{font-size:26px}.pcx-lead{margin-bottom:50px;text-align:left}.pcx-lead br{display:none}
 .pcx-svc{margin-top:80px}
 .pcx-name{min-height:54px;margin-bottom:84px;padding:10px 16px 10px 82px;font-size:17px}.pcx-name-ill{left:14px;width:60px;height:60px;bottom:4px}
 .pcx-tabs{gap:6px}.pcx-tab{min-height:120px;padding:26px 4px 14px;gap:4px}.pcx-tab.is-active{min-height:140px}
 .pcx-tab strong{font-size:13px;line-height:1.55}.pcx-tab strong br{display:none}
 .pcx-no{top:-13px;padding:4px 8px;font-size:11px;letter-spacing:0}
 .pcx-pop{top:-62px;padding:5px 8px;font-size:11px;letter-spacing:0}.pcx-tab.is-active .pcx-pop{top:-62px}
 .pcx-card{padding:24px 16px 30px}.pcx-ph{padding:12px 16px;font-size:18px;margin-bottom:22px}.pcx-ph small{display:block;margin:2px 0 0;font-size:13px}
 .pcx-who{padding:16px 18px}.pcx-spec{grid-template-columns:1fr}
 .pcx-price{flex-direction:column}.pcx-price p{width:100%}.pcx-price span{width:42%}.pcx-price b{flex:1;min-width:0;font-size:19px;padding:10px}
 .pcx-note{font-size:15px;text-align:left}
}
.pcx-name{margin-bottom:116px}
@media(max-width:650px){.pcx-name{margin-bottom:84px}.pcx-no,.pcx-pop{font-size:12px}.pcx-price small{font-size:12px}}
/* ===== 2026-10-19 料金：各サービスの下にお問い合わせ・電話（添付の料金表のボタン帯を参考に） */
.pcx-cta{display:grid;grid-template-columns:1fr 1fr;gap:22px;padding:26px 30px 30px;background:#dfe6e0;border-radius:0 0 10px 10px}
.pcx-card{border-radius:0}
.pcx-cta a{position:relative;display:flex;align-items:center;justify-content:center;gap:14px;min-height:84px;padding:12px 56px 12px 24px;border-radius:8px;color:#fff;font-weight:900;text-decoration:none;box-shadow:0 5px 0 rgba(0,0,0,.18);transition:translate .15s,box-shadow .15s,filter .2s}
.pcx-cta a:hover{translate:0 2px;box-shadow:0 3px 0 rgba(0,0,0,.18);filter:brightness(1.05)}
.pcx-cta svg{flex:none;width:30px;height:30px}
.pcx-cta-mail{background:var(--red,#f4433e);font-size:23px;letter-spacing:.06em}
.pcx-cta-mail svg{fill:none;stroke:#fff;stroke-width:1.8;stroke-linejoin:round}
.pcx-cta-mail b{position:absolute;right:24px;font-size:28px;line-height:1}
.pcx-cta-tel{background:#0aa55a;font-size:30px;letter-spacing:.04em;padding-right:24px}
.pcx-cta-tel span{display:flex;flex-direction:column;line-height:1.2}
.pcx-cta-tel small{font-size:13px;letter-spacing:.04em;margin-bottom:4px;font-weight:700}
@media(max-width:800px){.pcx-cta{grid-template-columns:1fr;gap:16px;padding:20px 16px 24px}.pcx-cta a{min-height:70px}.pcx-cta-mail{font-size:18px}.pcx-cta-tel{font-size:24px}}

/* ===== 2026-10-19 料金：PAYMENT & TERMS 作り直し（お金に誠実な印象・TOP/ABOUTになじむ白×緑のカード） */
.ptm{padding-top:120px;padding-bottom:130px}
.ptm-head{text-align:center}
.ptm-head h2{margin-bottom:56px}
.ptm-free{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;list-style:none;margin:0 0 30px;padding:0}
.ptm-free li{display:flex;flex-direction:column;align-items:center;text-align:center;padding:34px 22px 28px;border-radius:24px;background:#f3f8f4}
.ptm-ic{display:grid;place-items:center;width:64px;height:64px;margin-bottom:14px;border-radius:50%;background:linear-gradient(135deg,#0f8a4b,#3fcf8f)}
.ptm-ic svg,.ptm-promise-ic svg{width:30px;height:30px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.ptm-free b{font-size:15px;font-weight:900;color:#4a5a50}
.ptm-free strong{margin:4px 0 10px;font-size:34px;font-weight:900;line-height:1.3;color:#0f7a43;letter-spacing:.04em}
.ptm-free p{margin:0;font-size:14px;line-height:1.8!important;color:#4a5a50}
.ptm-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
.ptm-box{padding:36px 36px 14px;border:1px solid #e2e8e1;border-radius:24px;background:#fff;box-shadow:0 18px 50px rgba(16,60,35,.06)}
.ptm-box h3{display:flex;align-items:center;gap:12px;margin:0 0 6px;font-size:22px;font-weight:900}
.ptm-box h3 span{font-size:14px;letter-spacing:.1em;color:#0aa55a}
.ptm-item{padding:20px 0 22px;border-top:1px solid #e2e8e1}
.ptm-box h3+.ptm-item{border-top:0}
.ptm-dt{display:inline-block;margin:0 0 8px!important;padding:3px 14px;border-radius:20px;background:#e6f5ec;color:#0f7a43;font-size:14px;font-weight:900;line-height:1.7!important}
.ptm-item>p:not(.ptm-dt){margin:0;font-size:15px;line-height:1.95}
.ptm-split{display:grid;grid-template-columns:1fr 1fr;gap:10px;list-style:none;margin:4px 0 0;padding:0;counter-reset:ptm}
.ptm-split li{position:relative;display:flex;flex-direction:column;padding:16px 16px 14px;border-radius:14px;background:#f3f8f4}
.ptm-split li+li::before{content:"";position:absolute;left:-10px;top:50%;translate:-50% -50%;border:7px solid transparent;border-right:0;border-left-color:#3fcf8f;margin-left:5px}
.ptm-split small{font-size:12px;font-weight:700;color:#4a5a50}
.ptm-split b{margin-top:4px;font-size:15px;font-weight:900}
.ptm-split em{font-style:normal;font-size:22px;font-weight:900;color:#0f7a43;line-height:1.4}
.ptm-split i{font-style:normal;font-size:12px;color:#4a5a50}
.ptm-promise{display:flex;align-items:center;gap:26px;margin-top:30px;padding:34px 44px;border-radius:24px;background:linear-gradient(120deg,#0f8a4b,#2fb877 60%,#9bd96a);color:#fff}
.ptm-promise-ic{display:grid;place-items:center;flex:none;width:76px;height:76px;border-radius:50%;background:rgba(255,255,255,.18);border:2px solid rgba(255,255,255,.6)}
.ptm-promise-ic svg{width:38px;height:38px}
.ptm-promise h3{margin:0 0 6px;font-size:24px;font-weight:900}
.ptm-promise p{margin:0;font-size:15px;line-height:1.9}
.ptm-flow{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:14px 26px;margin-top:44px;text-align:center}
.ptm-flow p{margin:0;font-size:15px}
@media(max-width:900px){.ptm-free{grid-template-columns:1fr}.ptm-free li{flex-direction:row;flex-wrap:wrap;text-align:left;gap:0 16px;padding:22px}.ptm-ic{margin:0;width:54px;height:54px}.ptm-free li>b,.ptm-free li>strong{}.ptm-free strong{font-size:26px;margin:0}.ptm-free p{flex-basis:100%;margin-top:10px}.ptm-grid{grid-template-columns:1fr}}
@media(max-width:650px){.ptm{padding-top:80px;padding-bottom:90px}.ptm-head h2{font-size:26px;margin-bottom:36px}.ptm-box{padding:26px 20px 6px}.ptm-split{grid-template-columns:1fr;gap:16px}.ptm-split li+li::before{left:50%;top:-8px;translate:-50% -50%;margin:0;border:7px solid transparent;border-bottom:0;border-top-color:#3fcf8f}.ptm-promise{flex-direction:column;align-items:flex-start;gap:16px;padding:28px 22px}.ptm-promise h3{font-size:20px}}
/* ===== 2026-10-19 料金：タイトルと下を地続き（灰緑）・くるくる回る輪 */
.subpage.pcx-page{background:#eef1ee;overflow-x:clip}
.pcx-page .rn-hero{background:none}
.pcx,.ptm{position:relative}
.pcx>.pcx-wrap,.ptm>*:not(.bg-shapes){position:relative;z-index:1}
.ptm{background:#fff;box-shadow:0 0 0 100vmax #fff;clip-path:inset(0 -100vmax)}
.pcs1{width:440px;right:-210px;top:-120px;opacity:.32}
.pcs2{width:300px;left:-150px;top:22%;--w:62px;opacity:.55;animation-duration:18s}
.pcs3{width:480px;right:-250px;top:44%;opacity:.3;animation-direction:reverse}
.pcs4{width:260px;right:-120px;top:calc(44% + 300px);--w:56px;opacity:.5;animation-duration:20s;animation-direction:reverse}
.pcs5{width:460px;left:-240px;top:72%;opacity:.3}
.pcs6{width:280px;right:-130px;top:60px;--w:60px;opacity:.5;animation-duration:18s}
.pcs7{width:440px;left:-230px;bottom:40px;opacity:.3;animation-direction:reverse}
/* ===== 2026-10-19 PAYMENT & TERMS 作り直し2：なおた様の参考（番号・細い線・見出し・線のアイコン・説明の白いカードを横に並べる）。前の版の ptm- 指定はここで上書き */
.ptm{background:none;box-shadow:none;clip-path:none;padding-top:40px;padding-bottom:140px;text-align:center}
.ptm-kicker{display:inline-block;margin:0 0 34px;padding:0 14px 8px;border-bottom:1.5px solid #0f7a43;color:#0f7a43;font-size:15px;font-weight:700;letter-spacing:.12em}
.ptm .ptm-ttl{margin:0 0 56px;color:#0f7a43;font-size:clamp(24px,2.6vw,34px);font-weight:900;line-height:1.75;letter-spacing:.14em}
.ptm-ttl .sp-br{display:none}
.ptm-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;list-style:none;margin:0;padding:0}
.ptm-cards li{display:flex;flex-direction:column;align-items:center;padding:34px 26px 34px;background:#fff;border-radius:4px}
.ptm-no{color:#0f7a43;font-size:26px;font-weight:700;letter-spacing:.04em;line-height:1.2}
.ptm-no::after{content:"";display:block;width:30px;height:1.5px;margin:14px auto 0;background:#0f7a43}
.ptm-cards h3{margin:16px 0 18px;color:#0f7a43;font-size:19px;font-weight:700;letter-spacing:.08em;line-height:1.5}
.ptm-svg{width:58px;height:58px;margin-bottom:20px;fill:none;stroke:#0aa55a;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ptm-cards p{margin:0;text-align:left;font-size:14px;line-height:1.95!important;letter-spacing:.06em;color:#2b3a31}
.ptm .ptm-promise{display:block;margin:56px 0 0;padding:0;background:none;color:inherit;border-radius:0}
.ptm .ptm-promise h3{margin:0 0 10px;color:#0f7a43;font-size:21px;font-weight:900;letter-spacing:.08em}
.ptm .ptm-promise p{margin:0;font-size:15px;line-height:2}
.ptm .ptm-flow{flex-direction:column;gap:18px;margin-top:40px}
.ptm .ptm-flow p{font-size:14px}
@media(max-width:1000px){.ptm-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.ptm{padding-top:20px;padding-bottom:100px}.ptm-ttl .sp-br{display:inline}.ptm .ptm-ttl{letter-spacing:.08em;margin-bottom:36px}.ptm-cards{grid-template-columns:1fr;gap:14px}.ptm-cards li{padding:28px 22px}.ptm .ptm-promise p{text-align:left}}
/* ===== 2026-10-19 料金：サービスへ飛ぶ4つ（pcx-jump） */
.pcx-lead{margin-bottom:40px}
.pcx-jump{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:0 0 90px}
.pcx-jump a{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:14px;background:#fff;color:#192820;text-decoration:none;box-shadow:0 8px 24px rgba(16,60,35,.07);transition:translate .2s,box-shadow .2s}
.pcx-jump a:hover{translate:0 -3px;box-shadow:0 14px 30px rgba(16,60,35,.12)}
.pcx-jump-ill{flex:none;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:#eef6f0}
.pcx-jump-ill img{width:78%;height:auto}
.pcx-jump-txt{flex:1;display:flex;flex-direction:column;font-size:16px;font-weight:900;line-height:1.45}
.pcx-jump-txt small{font-size:12px;font-weight:700;color:#0aa55a;letter-spacing:.06em;margin-bottom:2px}
.pcx-jump-arw{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#0aa55a}
.pcx-jump-arw::before{content:"";width:7px;height:7px;border-right:2px solid #fff;border-bottom:2px solid #fff;rotate:45deg;margin-top:-3px}
.pcx-svc{scroll-margin-top:130px}
@media(max-width:1000px){.pcx-jump{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.pcx-jump{gap:10px;margin-bottom:70px}.pcx-jump a{flex-direction:column;text-align:center;gap:8px;padding:16px 8px 14px}.pcx-jump-txt{font-size:14px}.pcx-svc{scroll-margin-top:90px}}

/* PAYMENT & TERMS は背景白（横いっぱい） */
.ptm{background:#fff;box-shadow:0 0 0 100vmax #fff;clip-path:inset(0 -100vmax);padding-top:110px;padding-bottom:120px}
@media(max-width:600px){.ptm{padding-top:80px;padding-bottom:90px}}
.ptm-cards li{background:#f5f7f5}

/* ===== 2026-10-19 料金：相談のおさそい（pcc-）左に文字・右に斜めに流れる実績写真 */
.pcc{position:relative;overflow:hidden;background:#f2f3f2;border-radius:160px 0 0 0;padding:120px 0 calc(var(--rn-dome,130px) + 110px);margin-left:max(0px,calc(50% - 50vw))}
.pcc-inner{position:relative;z-index:2;max-width:1200px;margin:auto;padding:0 5%}
.pcc-text{width:min(560px,52%)}
.pcc-en{margin:0;font-family:var(--display,inherit);font-size:clamp(56px,7vw,104px);font-weight:500;line-height:1;letter-spacing:-.01em;color:#3fcf8f}
.pcc-ja{margin:10px 0 34px;color:#0aa55a;font-size:18px;font-weight:700;letter-spacing:.16em}
.pcc .pcc-ttl{margin:0 0 26px;font-size:clamp(24px,2.4vw,32px);font-weight:700;line-height:1.75;letter-spacing:.06em;color:#192820}
.pcc-lead{margin:0 0 40px;font-size:15px;line-height:2.05!important;letter-spacing:.05em;color:#3a4a40}
.pcc-tel{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;margin-bottom:28px;color:#192820;font-size:clamp(34px,3.6vw,48px);font-weight:700;letter-spacing:.02em;text-decoration:none;line-height:1.1}
.pcc-tel svg{width:.62em;height:.62em;align-self:center;color:#0aa55a}
.pcc-tel small{font-size:14px;font-weight:700;letter-spacing:.06em}
.pcc-btn{display:flex;align-items:center;justify-content:center;gap:16px;width:min(100%,460px);min-height:76px;padding:12px 28px;border-radius:40px;background:var(--red,#f4433e);color:#fff;font-size:18px;font-weight:900;letter-spacing:.08em;text-decoration:none;box-shadow:0 10px 24px rgba(244,67,62,.25);transition:translate .2s,filter .2s}
.pcc-btn:hover{translate:0 -2px;filter:brightness(1.05)}
.pcc-btn svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linejoin:round}
.pcc-photos{position:absolute;top:0;bottom:0;right:0;width:52%;z-index:1;pointer-events:none;-webkit-mask:linear-gradient(90deg,transparent,#000 14%);mask:linear-gradient(90deg,transparent,#000 14%)}
.pcc-tilt{position:absolute;top:50%;left:50%;display:flex;gap:28px;width:1150px;translate:-42% -50%;rotate:-28deg;transform-origin:center}
.pcc-col{display:flex;flex-direction:column;gap:28px;width:360px;animation:pcc-up 60s linear infinite}
.pcc-col2{animation-direction:reverse;animation-duration:70s}
.pcc-col3{animation-duration:55s}
.pcc-col img{display:block;width:100%;height:auto;border-radius:6px;box-shadow:0 18px 40px rgba(16,40,28,.18)}
@keyframes pcc-up{from{translate:0 0}to{translate:0 calc(-50% - 14px)}}
@media(prefers-reduced-motion:reduce){.pcc-col{animation:none}}
@media(max-width:900px){
 .pcc{border-radius:80px 0 0 0;padding-top:90px}
 .pcc-text{width:auto}
 .pcc-photos{position:relative;width:auto;height:320px;margin-top:50px;-webkit-mask:linear-gradient(180deg,transparent,#000 15%,#000 85%,transparent);mask:linear-gradient(180deg,transparent,#000 15%,#000 85%,transparent)}
 .pcc-tilt{width:900px;translate:-50% -50%}.pcc-col{width:260px}
}
@media(max-width:600px){.pcc{border-radius:50px 0 0 0;padding:70px 0 calc(var(--rn-dome,75px) + 60px)}.pcc-ja{margin-bottom:24px}.pcc-btn{font-size:16px;min-height:66px;padding:12px 18px;letter-spacing:.04em}.pcc-photos{height:260px}}
/* 調整：写真を文字にかぶせない／ジャンプの文字の折り返し */
@media(min-width:901px){.pcc-photos{width:44%}.pcc-text{width:min(560px,50%)}}
.pcx-jump a{gap:12px;padding:14px 14px 14px 16px}
.pcx-jump-ill{width:50px;height:50px}
.pcx-jump-txt{font-size:15px;word-break:keep-all;overflow-wrap:anywhere}
.pcc .pcc-lead{margin-bottom:0}
@media(min-width:901px){.pcc{display:flex;align-items:center;min-height:760px}.pcc-inner{width:100%}}
.pcc .pcc-ttl{font-size:clamp(26px,2.9vw,38px)}
.pcc .pcc-lead{font-size:17px}
@media(min-width:901px){.pcc-text{width:min(600px,52%)}}
@media(max-width:600px){.pcc .pcc-lead{font-size:16px}}
/* ===== 2026-10-19 相談の流れ 作り直し（flw-）：上に流れの一覧・下に番号つきのカード／PROMISE */
.subpage.flw-page{background:#eef1ee;overflow-x:clip}
.flw-page .rn-hero{background:none}
.flw{position:relative;padding:40px 0 130px}
.flw-wrap{position:relative;z-index:1;max-width:1120px;margin:auto;padding:0 5%;color:#192820}
.flw-head,.flw-pr-head{text-align:center;margin-bottom:46px}
.flw-kicker,.flw-pr-kicker{display:inline-block;margin:0 0 22px;padding:0 14px 8px;border-bottom:1.5px solid #0f7a43;color:#0f7a43;font-size:15px;font-weight:700;letter-spacing:.12em}
.flw-head h2,.flw-pr-head h2{margin:0;color:#0f7a43;font-size:clamp(24px,2.6vw,34px);font-weight:900;line-height:1.7;letter-spacing:.12em}
/* 流れの一覧 */
.flw-map{display:grid;grid-template-columns:repeat(8,1fr);list-style:none;margin:0 0 70px;padding:44px 30px 36px;background:#fff;border-radius:18px}
.flw-map li{position:relative}
.flw-map li+li::before{content:"";position:absolute;top:44px;right:calc(50% + 40px);width:calc(100% - 80px);height:2px;background:#d7e9de}
.flw-map a{display:flex;flex-direction:column;align-items:center;gap:14px;color:#192820;text-decoration:none}
.flw-map-ic{position:relative;display:grid;place-items:center;width:88px;height:88px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 9px #e6f5ec;transition:box-shadow .2s}
.flw-map a:hover .flw-map-ic{box-shadow:inset 0 0 0 9px #c9ecd7}
.flw-map-ic b{position:absolute;left:-4px;top:-6px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#0aa55a;color:#fff;font-size:14px;font-weight:900;box-shadow:0 0 0 3px #fff}
.flw-svg{width:40px;height:40px;fill:none;stroke:#0f7a43;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.flw-map-t{font-size:14px;font-weight:900;line-height:1.5;text-align:center;letter-spacing:.04em}
/* 番号つきのカード */
.flw-steps{list-style:none;margin:0;padding:0;display:grid;gap:44px}
.flw-step{position:relative;scroll-margin-top:130px;padding:56px 56px 50px;background:#fff;border:4px solid #d7e9de;border-radius:14px}
.flw-no{position:absolute;left:-22px;top:-22px;display:grid;place-items:center;width:66px;height:66px;border-radius:50%;background:#0aa55a;color:#fff;font-size:26px;font-weight:900;box-shadow:0 0 0 5px #fff}
.flw-main{display:grid;grid-template-columns:minmax(0,400px) 1fr;gap:34px;align-items:start}
.flw-photo{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:10px;display:block}
.flw-body h3{margin:0 0 18px;padding-bottom:14px;border-bottom:2px dotted #8cc899;color:#0f7a43;font-size:22px;font-weight:900;line-height:1.5;letter-spacing:.06em}
.flw-body h3 small{display:block;margin-bottom:4px;font-size:12px;letter-spacing:.14em;color:#0aa55a}
.flw-body p{margin:0 0 10px;font-size:15px;line-height:2;letter-spacing:.04em}
.flw-box{margin-top:32px;padding:26px 34px;border-radius:12px;background:#f3f6f4}
.flw-box-h{display:flex;align-items:center;gap:10px;margin:0 0 10px;font-size:16px;font-weight:900}
.flw-box-h::before{content:"";width:10px;height:10px;border:3px solid #0aa55a;border-radius:50%}
.flw-box ul{margin:0;padding:0 0 0 4px;list-style:none}
.flw-box li{position:relative;padding-left:14px;font-size:14px;line-height:2}
.flw-box li::before{content:"・";position:absolute;left:-2px;color:#0aa55a}
.flw-contact{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:34px;padding:28px 40px 30px;border-radius:12px;background:#f3f6f4}
.flw-contact-h{display:flex;align-items:center;gap:12px;margin:0 0 12px;font-size:15px;font-weight:900;letter-spacing:.06em;white-space:nowrap}
.flw-contact-h::before,.flw-contact-h::after{content:"";flex:1;border-top:2px dotted #b9c6bd}
.flw-contact-tel a{display:flex;align-items:center;justify-content:center;gap:10px;color:#192820;font-size:34px;font-weight:900;letter-spacing:.03em;text-decoration:none;line-height:1.2}
.flw-contact-tel svg{width:24px;height:24px;color:#0aa55a}
.flw-contact-hours{margin:8px 0 0;text-align:center;font-size:12px}
.flw-contact-hours span{display:inline-block;margin-right:8px;padding:1px 10px;background:#7d8b82;color:#fff}
.flw-contact-btn{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;min-height:66px;border-radius:40px;background:var(--red,#f4433e);color:#fff;font-size:18px;font-weight:900;letter-spacing:.08em;text-decoration:none;box-shadow:0 5px 0 rgba(0,0,0,.15);transition:translate .15s,box-shadow .15s}
.flw-contact-btn:hover{translate:0 2px;box-shadow:0 3px 0 rgba(0,0,0,.15)}
.flw-contact-btn svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linejoin:round}
.flw-contact-btn b{position:absolute;right:26px;font-size:24px}
/* PROMISE（緑の背景に白いカード3枚） */
.flw-promise{position:relative;padding:110px 0 calc(var(--rn-dome,130px) + 100px);background:linear-gradient(135deg,#0f8a4b,#2fb877 70%,#6fcf8f);background-image:radial-gradient(rgba(255,255,255,.08) 1.2px,transparent 1.6px),linear-gradient(135deg,#0f8a4b,#2fb877 70%,#6fcf8f);background-size:14px 14px,auto}
.flw-pr-kicker{color:#fff;border-color:#fff}
.flw-pr-head h2{color:#fff}
.flw-pr-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;list-style:none;margin:70px 0 0;padding:0}
.flw-pr-cards li{position:relative;display:flex;flex-direction:column;align-items:center;padding:0 30px 36px;background:#fff;border-radius:16px;text-align:center}
.flw-pr-ic{position:relative;display:grid;place-items:center;width:150px;height:150px;margin:-46px 0 22px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 20px #e6f5ec}
.flw-pr-ic b{position:absolute;left:4px;top:8px;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#0aa55a;color:#fff;font-size:18px;font-weight:900;box-shadow:0 0 0 4px #fff}
.flw-pr-svg{width:58px;height:58px;fill:none;stroke:#0f7a43;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.flw-pr-cards h3{margin:0 0 14px;font-size:19px;font-weight:900;line-height:1.6;letter-spacing:.04em;background:linear-gradient(transparent 62%,#e4f59a 62%);display:inline}
.flw-pr-cards p{margin:18px 0 0;text-align:left;font-size:15px;line-height:2;letter-spacing:.04em}
.flw-pr-link{display:flex;flex-direction:column;align-items:center;gap:18px;margin-top:54px;color:#fff;text-align:center}
.flw-pr-link p{margin:0;font-size:15px}
.fls1{width:440px;right:-220px;top:120px;opacity:.3}
.fls2{width:280px;left:-130px;top:26%;--w:60px;opacity:.5;animation-duration:18s}
.fls3{width:480px;right:-250px;top:48%;opacity:.3;animation-direction:reverse}
.fls4{width:260px;right:-120px;top:72%;--w:56px;opacity:.5;animation-duration:20s;animation-direction:reverse}
.fls5{width:460px;left:-240px;top:80%;opacity:.3}
@media(max-width:1000px){.flw-map{grid-template-columns:repeat(4,1fr);row-gap:30px}.flw-map li:nth-child(5)::before{display:none}.flw-main{grid-template-columns:1fr}.flw-photo{max-width:520px}.flw-contact{grid-template-columns:1fr}.flw-pr-cards{grid-template-columns:1fr;gap:70px;max-width:560px;margin-left:auto;margin-right:auto}}
@media(max-width:600px){
 .flw{padding:20px 0 90px}.flw-head h2,.flw-pr-head h2{letter-spacing:.06em}
 .flw-map{grid-template-columns:repeat(4,1fr);padding:30px 10px 24px;gap:22px 4px;margin-bottom:50px}
 .flw-map li+li::before{top:30px;right:calc(50% + 28px);width:calc(100% - 56px)}
 .flw-map-ic{width:60px;height:60px;box-shadow:inset 0 0 0 6px #e6f5ec}.flw-map-ic b{width:22px;height:22px;font-size:11px;left:-4px;top:-4px}
 .flw-svg{width:28px;height:28px}.flw-map-t{font-size:12px;letter-spacing:0}
 .flw-steps{gap:40px}.flw-step{padding:46px 18px 26px;border-width:3px}.flw-no{left:-8px;top:-20px;width:52px;height:52px;font-size:21px}
 .flw-body h3{font-size:19px}.flw-box{padding:20px 18px}.flw-contact{padding:22px 16px}.flw-contact-tel a{font-size:28px}
 .flw-promise{padding:80px 0 calc(var(--rn-dome,75px) + 70px)}.flw-pr-cards li{padding:0 20px 28px}.flw-pr-ic{width:120px;height:120px;box-shadow:inset 0 0 0 16px #e6f5ec}
}
@media(max-width:600px){.flw-map-ic b{font-size:12px}}
.flw-photo{height:auto}
.flw-body h3,.flw-pr-cards h3,.flw-map-t{word-break:auto-phrase;text-wrap:pretty}
.flw-pr-cards h3{display:block;background:none}
.flw-pr-cards h3 span{background:linear-gradient(transparent 62%,#e4f59a 62%);-webkit-box-decoration-break:clone;box-decoration-break:clone}
/* なおた様調整：01〜08のカードを線でつなぐ／PROMISE 番号なし・線なし・文の高さそろえ・背景を写真＋薄い黒 */
.flw-step::before{content:"";position:absolute;left:9px;top:44px;bottom:-66px;width:4px;border-radius:2px;background:#0aa55a;z-index:0}
.flw-step:last-child::before{display:none}
.flw-no{z-index:1}
.flw-pr-cards h3 span{background:none}
.flw-pr-cards h3{display:flex;align-items:center;justify-content:center;min-height:3.2em;margin-bottom:0}
.flw-promise{background:linear-gradient(rgba(10,20,15,.58),rgba(10,20,15,.58)),url(/images/staff/consult.webp) center/cover no-repeat}
@media(max-width:600px){.flw-step::before{left:16px;top:32px;bottom:-60px;width:3px}}
/* なおた様調整：線は番号でなく、カードの真ん中を枠と同じ薄い緑でつなぐ */
.flw-step::before{left:50%;top:auto;bottom:-48px;width:4px;height:44px;translate:-50% 0;border-radius:0;background:#d7e9de}
@media(max-width:600px){.flw-step::before{left:50%;top:auto;bottom:-43px;width:3px;height:40px}}
/* ===== 2026-10-19 会社概要：表の上の写真をロゴに／主な開発環境 */
.co-pic.co-logo{display:grid;place-items:center;padding:clamp(30px,6vw,80px);background:#fff;border:1px solid #e2e8e1}
.co-pic.co-logo img{width:min(100%,640px);height:auto!important;object-fit:contain}
.co-env{display:grid;gap:14px;margin:0}
.co-env>div{display:grid;grid-template-columns:11em 1fr;gap:6px 14px;align-items:start}
.co-env dt{padding-top:4px;color:#0f7a43;font-size:14px;font-weight:900;line-height:1.7}
.co-env dd{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.co-env span{padding:3px 12px;border-radius:20px;background:#eef6f0;font-size:14px;line-height:1.7;white-space:nowrap}
@media(max-width:600px){.co-env>div{grid-template-columns:1fr}.co-env dt{padding-top:0}}
.co-env>div{grid-template-columns:13em 1fr}.co-env dt{white-space:nowrap}
@media(max-width:600px){.co-env>div{grid-template-columns:1fr}}
/* 会社概要：ページへのリンク（co-tiles）の背景を薄いグレー・横いっぱい */
.co-tiles{background:#f2f3f2;box-shadow:0 0 0 100vmax #f2f3f2;clip-path:inset(0 -100vmax);padding:80px 0 90px}
/* 会社概要：ロゴの箱にドロップシャドウ／グレーをCTAの半円まで続けて、区切りが見えるように */
.co-pic.co-logo{border:0;box-shadow:0 14px 40px rgba(16,40,28,.14)}
.co-pic.co-logo{overflow:visible}
.co-tiles{clip-path:inset(0 -100vmax -100px)}
.subpage:has(.co-tiles) .rn-cta{background:linear-gradient(#f2f3f2 0 calc(var(--rn-dome,130px) + 2px),transparent 0)}
/* ===== 2026-10-19 代表挨拶：見出しと写真を大きく（バランスはそのまま拡大）・文字を全体的に大きく */
@media(min-width:768px){
 .msg-wrap{max-width:900px}
 .msg-head{width:min(1120px,calc(100vw - 40px));margin-left:50%;translate:-50% 0}
 .msg-catch{font-size:clamp(36px,4.2vw,50px);gap:12px}
 .msg-catch span{padding:10px 14px}
 .msg-body h3{font-size:23px}
 .msg-body p{font-size:17.5px;line-height:2.05}
 .msg-sign{font-size:16px}
 .msg-sign strong{font-size:23px}
 .msg-profile-ttl{font-size:23px}
 .msg-profile{font-size:16.5px}
 .msg-wrap .co-tiles{margin-left:-60px;margin-right:-60px}
}
@media(max-width:767px){.msg-catch{font-size:28px}.msg-body p{font-size:16px}.msg-body h3{font-size:20px}}
@media(max-width:999px){.msg-wrap .co-tiles{margin-left:0;margin-right:0}}

/* ===== 2026-10-20 提案事例（cs-page）・制作実績（wk-page）を料金・相談の流れと同じ見た目に */
.subpage.cs-page,.subpage.wk-page{position:relative;background:#eef1ee;overflow-x:clip}
.cs-page .rn-hero,.wk-page .rn-hero{background:none}
.cs-page>.bg-shapes{top:300px;bottom:auto;height:900px}
.cs-page .cs-slider{position:relative;z-index:1}
/* 各事例：灰緑と白を交互に。灰緑には白カード、白には薄い灰緑カード */
.cs-page .cs-sec{position:relative;background:transparent;padding:110px 5% 120px}
.cs-page .cs-sec:nth-of-type(even){background:#fff}
.cs-page .cs-sec-inner{z-index:1}
.cs-page .cs-sec-en{display:inline-block;margin:0 0 30px;padding:0 14px 8px;border-bottom:1.5px solid #0f7a43;color:#0f7a43;font-family:inherit;font-size:15px;font-weight:700;line-height:1.6;letter-spacing:.12em}
.cs-page .cs-sec h2{margin:0 0 50px;color:#0f7a43;font-size:clamp(24px,2.6vw,34px);font-weight:900;line-height:1.6;letter-spacing:.14em}
.cs-page .cs-theme,.cs-page .cs-sec:nth-of-type(odd) .cs-theme{padding:40px 48px;border-radius:4px;background:#fff;box-shadow:none}
.cs-page .cs-sec:nth-of-type(even) .cs-theme{background:#f5f7f5}
.cs-page .cs-theme-who{font-size:14px;color:#0f7a43}
.cs-page .cs-theme h3{font-size:clamp(21px,2.2vw,27px);color:#192820}
.cs-page .cs-theme>p:last-child{font-size:16px;line-height:2;color:#2b3a31}
.cs-page .cs-ba{grid-template-columns:1fr 56px 1fr}
.cs-page .cs-before,.cs-page .cs-after{padding:42px 40px 46px;border-radius:4px;background:#fff}
.cs-page .cs-sec:nth-of-type(even) .cs-before,.cs-page .cs-sec:nth-of-type(even) .cs-after{background:#f5f7f5}
.cs-page .cs-after{box-shadow:inset 0 4px 0 #3fcf8f}
.cs-page .cs-ba-word{margin-bottom:14px;font-family:inherit;font-size:16px;font-weight:700;line-height:1.6;font-style:normal;letter-spacing:.16em;-webkit-text-stroke:0}
.cs-page .cs-before .cs-ba-word{color:#8a968f}
.cs-page .cs-after .cs-ba-word{color:#0aa55a}
.cs-page .cs-ba h4{margin-bottom:22px;color:#192820;font-size:21px}
.cs-page .cs-after h4{color:#0f7a43}
.cs-page .cs-ba li{font-size:15.5px;line-height:1.95}
.cs-page .rn-cs-txt{font-size:16px;line-height:2.05;color:#2b3a31}
.cs-page .cs-ba-arrow{border-width:16px 0 16px 15px;border-left-color:#3fcf8f}
/* 結果：数字が目に入る白いカード */
.cs-page .cs-result{margin-top:64px}
.cs-page .cs-result h4{color:#0f7a43;font-size:24px;font-weight:900;letter-spacing:.14em}
.cs-page .cs-result-en{color:#0aa55a;font-size:13px;margin-bottom:28px}
.cs-page .cs-result ul{grid-template-columns:repeat(2,1fr);gap:16px;max-width:none}
.cs-page .cs-result li{display:flex;align-items:center;justify-content:center;gap:4px 10px;flex-wrap:wrap;min-height:96px;padding:22px 26px;border-radius:4px;background:#fff;text-align:center;font-size:16px;line-height:1.8;color:#192820}
.cs-page .cs-sec:nth-of-type(even) .cs-result li{background:#f5f7f5}
.cs-page .cs-result li::before{display:none}
.cs-page .cs-result li:has(b){font-size:17px}
.cs-page .cs-result li b{color:#0aa55a;font-size:30px;font-weight:900;letter-spacing:.04em;line-height:1.2}
.cs-page .cs-result li:not(:has(b)){grid-column:1/-1;font-weight:700}
.cs-page .rn-cs-imgs img{border-radius:4px;border-color:#dfe5e0}
.cs-page .rn-cs-link a{color:#0f7a43}
.cs-page .cs-note{background:#fff;padding:0 5% 70px}
.cs-page .cs-tolink{position:relative;z-index:1;padding-top:80px;padding-bottom:110px;text-align:center}
.cs-page .cs-tolink p{margin:0 auto 26px}
/* くるくる回る輪 */
.css1{width:440px;right:-210px;top:-60px;opacity:.3}
.css2{width:280px;left:-140px;top:380px;--w:60px;opacity:.5;animation-duration:18s}
.css3{width:300px;right:-150px;top:30%;--w:62px;opacity:.5;animation-direction:reverse}
.css4{width:460px;left:-240px;bottom:40px;opacity:.28}
.css5{width:460px;right:-240px;top:80px;opacity:.28;animation-direction:reverse}
.css6{width:260px;left:-130px;bottom:120px;--w:56px;opacity:.5;animation-duration:20s}
@media(max-width:900px){.cs-page .cs-ba{grid-template-columns:1fr;gap:14px}}
@media(max-width:600px){
 .cs-page .cs-sec{padding:76px 18px 84px}
 .cs-page .cs-sec h2{margin-bottom:34px;letter-spacing:.08em}
 .cs-page .cs-theme{padding:28px 22px}
 .cs-page .cs-before,.cs-page .cs-after{padding:30px 22px 32px}
 .cs-page .cs-result ul{grid-template-columns:1fr}
 .cs-page .cs-result li{min-height:0;padding:18px}
 .cs-page .cs-tolink{padding-top:56px;padding-bottom:80px}
}
/* 制作実績 */
.wk-page .rn-works{position:relative;max-width:1200px;padding:110px 5% 120px;text-align:center}
.wk-page .rn-works>*:not(.bg-shapes){position:relative;z-index:1}
.wk-page .wk-ttl{margin:0 0 22px;color:#0f7a43;font-size:clamp(24px,2.6vw,34px);font-weight:900;line-height:1.6;letter-spacing:.14em}
.wk-page .wk-lead{margin:0 0 56px;font-size:16px;line-height:2.05;color:#2b3a31}
.wk-page .rn-work-grid{gap:24px;margin:0 0 64px;text-align:left}
.wk-page .rn-work{padding:14px 14px 24px;border-radius:4px;background:#fff;transition:translate .25s,box-shadow .25s}
.wk-page a.rn-work:hover{translate:0 -3px;box-shadow:0 14px 30px rgba(16,40,28,.08)}
.wk-page .rn-work-img{border-radius:2px;background:#f5f7f5}
.wk-page .rn-work-more{background:#0aa55a}
.wk-page .rn-work-cat{margin:18px 6px 8px;border-color:#0aa55a;color:#0f7a43}
.wk-page .rn-work-ttl{padding:0 6px;color:#192820;font-size:16px}
.wk-btn{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-width:min(100%,380px);min-height:68px;padding:12px 32px;border-radius:40px;background:var(--red,#f4433e);color:#fff;font-size:17px;font-weight:900;letter-spacing:.08em;text-decoration:none;box-shadow:0 10px 24px rgba(244,67,62,.25);transition:translate .2s,filter .2s}
.wk-btn:hover{translate:0 -2px;filter:brightness(1.05)}
.wk-page .rn-lead-link{margin:64px auto 22px;font-size:16px}
.wk-page .wk-tolink{margin:0}
.wks1{width:440px;right:-210px;top:-60px;opacity:.3}
.wks2{width:290px;left:-150px;top:26%;--w:62px;opacity:.5;animation-duration:18s}
.wks3{width:460px;right:-250px;top:58%;opacity:.28;animation-direction:reverse}
.wks4{width:260px;left:-130px;bottom:40px;--w:56px;opacity:.5;animation-duration:20s;animation-direction:reverse}
@media(max-width:600px){.wk-page .rn-works{padding:76px 18px 84px}.wk-page .wk-ttl{letter-spacing:.08em}.wk-page .wk-lead{text-align:left}.wk-page .wk-lead br{display:none}.wk-btn{font-size:16px;min-height:62px}}

/* ===== 2026-10-20 ホームページ制作（wlp-）ヒーロー→お悩み→とは→強み→提案事例→料金例→FAQ→おさそい */
.subpage.wlp-page{position:relative;background:#fff;overflow-x:clip;color:#192820}
.wlp-page section{position:relative}
.wlp-in{position:relative;z-index:1;max-width:1200px;margin:auto;padding:0 5%}
.wlp-in--s{max-width:960px}
.wlp-center{margin:48px 0 0;text-align:center}
.wlp-note{margin:14px 0 0;font-size:12.5px;color:#6b7a70}
.wlp-head{margin:0 0 56px}
.wlp-head--c{text-align:center}
.wlp-kicker{display:inline-block;margin:0 0 22px;padding:0 14px 8px;border-bottom:1.5px solid #0f7a43;color:#0f7a43;font-size:15px;font-weight:700;letter-spacing:.12em}
.wlp-head h2{margin:0;color:#0f7a43;font-size:clamp(24px,2.6vw,34px);font-weight:900;line-height:1.65;letter-spacing:.14em}
.wlp-chk{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#0aa55a}
.wlp-chk svg,.wlp-pill-ico svg{width:60%;height:60%;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.wlp-hero{max-width:1360px;margin:0 auto;padding:134px 24px 0}
.wlp-crumb{margin-bottom:18px}
.wlp-hero-box{position:relative;display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:48px;padding:100px 5% 90px;border-radius:32px;background:linear-gradient(135deg,#dff3e6,#eef7d8);overflow:hidden}
.wlp-hero-box>.bg-shapes{left:0;width:100%;translate:none}
.wlp-hero-ghost{position:absolute;top:22px;left:4%;margin:0;font:900 clamp(56px,8.4vw,128px)/1 Roboto,Arial,sans-serif;letter-spacing:-.01em;color:rgba(255,255,255,.75);white-space:nowrap;pointer-events:none}
.wlp-hero-txt,.wlp-hero-img{position:relative;z-index:1}
.wlp-hero-eyebrow{margin:0 0 14px;color:#0aa55a;font-size:17px;font-weight:700;letter-spacing:.06em;line-height:1.7}
.wlp-hero h1{position:static;white-space:normal;text-shadow:none;animation:none;-webkit-text-stroke:0;margin:0 0 36px;font-size:clamp(30px,3.6vw,48px);font-weight:900;line-height:1.4;letter-spacing:.08em;color:#192820}
.wlp-hero h1 span{display:block;margin-top:6px;font-size:.62em;letter-spacing:.12em;color:#0f7a43}
.wlp-pills{display:grid;gap:14px;margin:0;padding:0;list-style:none}
.wlp-pills li{display:flex;align-items:center;gap:16px;padding:14px 30px 14px 14px;border-radius:99px;background:#fff;box-shadow:0 8px 20px rgba(16,80,44,.07)}
.wlp-pill-ico{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#0aa55a}
.wlp-pills p{margin:0;font-size:13.5px;line-height:1.7;color:#3a4a40}
.wlp-pills b{display:block;color:#0f7a43;font-size:16px;letter-spacing:.04em}
.wlp-hero-img img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;object-position:50% 45%;border:10px solid #fff;border-radius:28px;box-shadow:0 20px 44px rgba(16,60,36,.14)}
.wlps1{width:420px;right:-160px;top:-170px;opacity:.35}
.wlps2{width:260px;left:-120px;bottom:-110px;--w:58px}
.wlp-about{padding:80px 0 120px}
.wlp-about-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.wlp-about .wlp-head{margin-bottom:30px}
.wlp-about .wlp-head h2{font-size:clamp(22px,2.3vw,30px);letter-spacing:.08em}
.wlp-about-txt>p{margin:0 0 16px;font-size:16.5px;line-height:2.1;letter-spacing:.04em;color:#2b3a31}
.wlp-inc{padding:110px 0 120px;background:#eef1ee}
.wlp-inc-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0;padding:0;list-style:none}
.wlp-inc-list li{display:flex;align-items:center;gap:14px;padding:20px 22px;border-radius:12px;background:#fff;font-size:15px;font-weight:700;line-height:1.6;letter-spacing:.03em}
.wlp-inc-list .wlp-chk{width:26px;height:26px}
.wlp-faq{padding:120px 0 130px;background:#eef1ee}
.wlp-faq-list{display:grid;gap:12px}
.wlp-faq details{border-radius:12px;background:#fff;overflow:hidden}
.wlp-faq summary{display:flex;align-items:center;gap:12px;padding:20px 24px;background:#0aa55a;color:#fff;font-size:16px;font-weight:700;line-height:1.6;letter-spacing:.04em;list-style:none;cursor:pointer}
.wlp-faq summary::-webkit-details-marker{display:none}
.wlp-faq summary i{position:relative;flex:none;width:26px;height:26px;margin-left:auto;border-radius:50%;background:#fff}
.wlp-faq summary i::before,.wlp-faq summary i::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:2px;translate:-50% -50%;background:#0aa55a;transition:rotate .25s}
.wlp-faq summary i::after{rotate:90deg}
.wlp-faq details[open] summary i::after{rotate:0deg}
.wlp-q{flex:none;font:700 17px/1 Roboto,Arial,sans-serif}
.wlp-a{display:flex;gap:12px;padding:22px 24px 24px}
.wlp-a .wlp-q{color:#0aa55a;line-height:1.7}
.wlp-a p{margin:0;font-size:15.5px;line-height:2;color:#2b3a31}
/* お悩み */
.wlp-worry{padding:110px 0 120px;background:#eef6f2}
.wlp-worry-ttl{margin:0 0 64px;text-align:center}
.wlp-worry-ttl span{position:relative;display:inline-block;padding:18px 44px;color:#192820;font-size:clamp(24px,3vw,40px);font-weight:900;letter-spacing:.12em;line-height:1.5}
.wlp-worry-ttl span::before,.wlp-worry-ttl span::after{content:"";position:absolute;width:26px;height:26px;border:0 solid #0aa55a}
.wlp-worry-ttl span::before{left:0;top:0;border-top-width:4px;border-left-width:4px}
.wlp-worry-ttl span::after{right:0;bottom:0;border-bottom-width:4px;border-right-width:4px}
.wlp-worry-ttl em{font-style:normal;color:#0aa55a;font-size:1.15em;text-emphasis:filled dot #0aa55a;-webkit-text-emphasis:filled dot #0aa55a}
.wlp-worry-cards{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:1fr;max-width:1100px;margin-left:auto!important;margin-right:auto!important;gap:26px 28px;margin:0 0 80px;padding:0;list-style:none}
.wlp-worry-cards li{grid-column:span 2;display:grid;place-items:center;min-height:150px;padding:26px 30px;border:10px solid #d5ebe0;border-radius:60px;background:#fff;background-clip:padding-box;text-align:center;font-size:17px;font-weight:700;line-height:1.9;letter-spacing:.05em;color:#2b3a31}
.wlp-worry-cards em{font-style:normal;color:#0aa55a;font-weight:900;background:linear-gradient(transparent 62%,#d9f3e3 62%)}
.wlp-worry-band{position:relative;max-width:1100px;margin:0 auto;padding:40px 220px;border-radius:999px;background:#0aa55a;text-align:center}
.wlp-worry-band p{margin:0;color:#fff;font-size:clamp(19px,2.2vw,28px);font-weight:900;line-height:1.6;letter-spacing:.08em}
.wlp-worry-band img{position:absolute;bottom:0;height:auto;pointer-events:none}
.wlp-wb-l{left:10px;width:200px}
.wlp-wb-r{right:20px;width:160px}
.wlp-worry-band .sp-br{display:inline}
.wlp-worry-cards li:nth-child(4){grid-column:2/span 2}
@media(max-width:1000px){.wlp-worry-cards{grid-template-columns:1fr 1fr}.wlp-worry-cards li,.wlp-worry-cards li:nth-child(4){grid-column:auto}.wlp-worry-cards li:last-child{grid-column:1/-1}}
/* ホームページ制作とは */
.wlp-what{padding:120px 0 130px;background:#fff;text-align:center}
.wlp-what-k{display:inline-block;margin:0 0 18px;padding-bottom:6px;border-bottom:2px solid #0aa55a;color:#0aa55a;font:italic 700 17px/1.4 Roboto,Arial,sans-serif;letter-spacing:.02em}
.wlp-what-ttl{display:flex;align-items:baseline;justify-content:center;flex-wrap:wrap;gap:6px 18px;margin:0 0 44px;color:#0f7a43;font-size:clamp(20px,2.2vw,28px);font-weight:900;letter-spacing:.1em}
.wlp-what-ttl span{font:900 clamp(44px,6.4vw,92px)/1.05 Roboto,Arial,sans-serif;letter-spacing:-.005em;color:#0aa55a}
.wlp-what-lead{margin:0 0 56px;font-size:17px;font-weight:700;line-height:2.4;letter-spacing:.08em;color:#2b3a31}
.wlp-points{display:grid;gap:4px;max-width:880px;margin:0 auto;padding:40px 48px;border-radius:16px;background:#fff;box-shadow:0 18px 44px rgba(16,60,36,.09);list-style:none;text-align:left}
.wlp-points li{display:grid;grid-template-columns:150px 1fr;align-items:center;gap:30px;padding:8px 0}
.wlp-point-no{display:flex;align-items:baseline;justify-content:center;gap:10px;padding:12px 0;border-radius:99px;background:#d9f3e3;color:#0f7a43;font:italic 500 15px/1 Roboto,Arial,sans-serif}
.wlp-point-no b{font-size:28px;font-weight:700}
.wlp-points p{margin:0;padding:14px 0;border-bottom:2px dotted #9fc7b0;font-size:clamp(17px,1.8vw,21px);font-weight:900;letter-spacing:.08em}
.wlps3{width:300px;right:-150px;top:80px;--w:62px;opacity:.5;animation-duration:18s}
.wlps4{width:460px;left:-250px;bottom:40px;opacity:.28}
/* 強み（表紙の強みの雰囲気） */
.wlp-str{padding:120px 0 130px;background:#00b35a;color:#fff;overflow:hidden}
.wlp-str-head{margin:0 0 70px;text-align:center}
.wlp-str-head p{margin:0 0 12px;font:700 16px/1 Roboto,Arial,sans-serif;letter-spacing:.2em;color:#d2ec72}
.wlp-str-head h2{margin:0;font-size:clamp(26px,3vw,40px);font-weight:900;letter-spacing:.14em}
.wlp-str-list{display:grid;gap:40px}
.wlp-str-item{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:56px}
.wlp-str-item:nth-child(even) .wlp-str-img{order:2}
.wlp-str-img img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:20px;box-shadow:0 20px 40px rgba(0,60,30,.25)}
.wlp-str-no{display:block;margin:0 0 8px;font:500 clamp(64px,7vw,104px)/1 Roboto,Arial,sans-serif;color:rgba(255,255,255,.35)}
.wlp-str-txt h3{margin:0 0 18px;font-size:clamp(22px,2.4vw,30px);font-weight:900;line-height:1.6;letter-spacing:.08em}
.wlp-str-txt>p{margin:0;font-size:17px;font-weight:700;line-height:2;letter-spacing:.06em}
.wlp-str-res{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 10px;padding:0;list-style:none}
.wlp-str-res li{display:flex;align-items:baseline;gap:8px;padding:12px 20px;border-radius:12px;background:#fff;color:#192820;font-size:15px;font-weight:700}
.wlp-str-res small{font-size:12.5px;color:#0f7a43}
.wlp-str-res i{font-style:normal;color:#3fcf8f}
.wlp-str-res b{color:#0aa55a;font:900 30px/1 Roboto,Arial,sans-serif}
.wlp-str-note{margin:0;font-size:12.5px;opacity:.85}
.wlps5{width:440px;right:-210px;top:-80px;opacity:.4}
.wlps6{width:300px;left:-150px;bottom:60px;--w:62px}
/* 提案事例・料金例の置き場所 */
.wlp-case-wrap{background:#eef1ee}
.wlp-case-wrap .cs-sec{padding-top:120px}
.wlp-pcx{background:#fff}
.wlp-faq{padding:120px 0 130px;background:#eef1ee}
@media(max-width:1000px){
 .wlp-hero-box{grid-template-columns:1fr;gap:36px;padding:90px 6% 70px}
 .wlp-worry-band{padding:36px 150px}
 .wlp-wb-l{width:140px}.wlp-wb-r{width:110px}
 .wlp-str-item{grid-template-columns:1fr;gap:26px}
 .wlp-str-item:nth-child(even) .wlp-str-img{order:0}
}
@media(max-width:650px){
 .wlp-hero{padding:110px 13px 0}
 .wlp-hero-box{padding:70px 22px 40px;border-radius:24px}
 .wlp-hero-eyebrow{font-size:15px}
 .wlp-pills li{padding:12px 18px 12px 12px;border-radius:22px}
 .wlp-pill-ico{width:32px;height:32px}
 .wlp-hero-img img{border-width:7px;border-radius:20px}
 .wlp-head{margin-bottom:40px}
 .wlp-head h2{letter-spacing:.08em}
 .wlp-worry{padding:76px 0 84px}
 .wlp-worry-ttl{margin-bottom:40px}
 .wlp-worry-ttl span{padding:14px 26px;letter-spacing:.06em}
 .wlp-worry-cards{grid-template-columns:1fr;gap:14px;margin-bottom:150px}
 .wlp-worry-cards li:last-child{grid-column:auto}
 .wlp-worry-cards li{min-height:0;padding:22px 18px;border-width:7px;border-radius:40px;font-size:15.5px}
 .wlp-worry-band{padding:34px 20px;border-radius:28px}
 .wlp-worry-band .sp-br{display:inline}
 .wlp-wb-l{width:120px;left:0;bottom:100%}.wlp-wb-r{width:96px;right:6px;bottom:100%}
 .wlp-what{padding:84px 0 90px}
 .wlp-what-lead{font-size:15px;line-height:2.1;letter-spacing:.04em;text-align:left}
 .wlp-what-lead br{display:none}
 .wlp-points{padding:22px 18px}
 .wlp-points li{grid-template-columns:96px 1fr;gap:14px}
 .wlp-point-no{font-size:11px;gap:5px}.wlp-point-no b{font-size:20px}
 .wlp-points p{font-size:15.5px;letter-spacing:.04em}
 .wlp-str{padding:84px 0 90px}
 .wlp-str-head{margin-bottom:44px}
 .wlp-str-txt>p{font-size:15.5px}
 .wlp-faq{padding:80px 0 90px}
 .wlp-faq summary{padding:16px 18px;font-size:15px}
 .wlp-a{padding:18px}
 .wlp-a p{font-size:15px}
}
/* ===== 2026-10-20 ホームページ制作 三回目（LP案の並び）追加分 */
.wlp-lead{margin:22px 0 0;font-size:16px;font-weight:700;line-height:2;letter-spacing:.05em;color:#3a4a40}
.wlp-center-s{text-align:center}
.wlp-page .sp-br{display:none}
.wlp-ctapair{margin-top:30px;padding:0;background:none;border-radius:0;gap:14px}
.wlp-ctapair a{min-height:72px;padding:10px 46px 10px 18px}
.wlp-ctapair .pcx-cta-mail{font-size:19px}
.wlp-hero .wlp-ctapair{grid-template-columns:1fr;max-width:440px}
/* 制作実績が流れる帯 */
.wlp-show{padding:110px 0 90px;background:#fff;overflow:hidden}
.wlp-show-ttl{margin:0 0 50px;text-align:center;color:#0f7a43;font-size:clamp(24px,3vw,38px);font-weight:900;letter-spacing:.14em}
.wlp-show-track{display:flex;width:max-content}
.wlp-show-row{display:flex;gap:28px;margin:0;padding:0 14px;list-style:none;animation:wlp-flow 46s linear infinite}
.wlp-show-row li{flex:none;width:clamp(240px,26vw,380px);border-radius:14px;overflow:hidden;box-shadow:0 14px 30px rgba(16,60,36,.13)}
.wlp-show-row img{display:block;width:100%;height:auto;aspect-ratio:1555/1080;object-fit:cover}
.wlp-show.is-stop .wlp-show-row{animation-play-state:paused}
@keyframes wlp-flow{to{translate:-100% 0}}
@media(prefers-reduced-motion:reduce){.wlp-show-row{animation:none}}
.wlp-show-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:18px;margin-top:44px}
.wlp-show-stop{padding:10px 22px;border:1.5px solid #9fc7b0;border-radius:99px;background:#fff;color:#0f7a43;font-size:14px;font-weight:700;letter-spacing:.06em}
.wlp-show-stop-off,.wlp-show.is-stop .wlp-show-stop-on{display:none}
.wlp-show.is-stop .wlp-show-stop-off{display:inline}
/* まるごとサポート */
.wlp-sup{padding:120px 0 120px;background:linear-gradient(160deg,#0aa55a,#2fb877 70%,#6fcf8f);color:#fff;text-align:center;overflow:hidden}
.wlp-sup-k{display:inline-block;margin:0 0 14px;padding:6px 22px;border-radius:99px;background:#fff;color:#0f7a43;font-size:15px;font-weight:900;letter-spacing:.08em}
.wlp-sup-ttl{margin:0 0 56px;font-size:clamp(24px,3vw,38px);font-weight:900;line-height:1.6;letter-spacing:.1em}
.wlp-sup-ttl em{font-style:normal;color:#e8f87a}
.wlp-sup-pair{display:grid;grid-template-columns:240px 1fr 240px;align-items:center;gap:36px;max-width:1000px;margin:0 auto 64px}
.wlp-sup-man{margin:0}
.wlp-sup-man img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;object-position:22% 40%;border-radius:50%;border:8px solid #fff;box-shadow:0 16px 34px rgba(0,60,30,.25)}
.wlp-sup-man--mt img{object-position:50% 20%;border-color:#e8f87a}
.wlp-sup-man figcaption{display:inline-block;margin-top:16px;padding:6px 26px;border-radius:6px;background:#fff;color:#0f7a43;font-size:14px;font-weight:900;letter-spacing:.08em}
.wlp-sup-mid p{margin:0;font-size:16px;font-weight:700;line-height:2;letter-spacing:.05em}
.wlp-sup-arrow{display:block;width:70%;height:3px;margin:26px auto;background:#fff;position:relative}
.wlp-sup-arrow::after{content:"";position:absolute;right:-2px;top:50%;width:14px;height:14px;border-top:3px solid #fff;border-right:3px solid #fff;translate:0 -50%;rotate:45deg}
.wlp-sup-box{position:relative;max-width:1060px;margin:0 auto 18px;padding:50px 40px 40px;border-radius:24px;background:rgba(255,255,255,.14)}
.wlp-sup-label{position:absolute;left:50%;top:0;translate:-50% -50%;margin:0;padding:8px 32px;border-radius:99px;background:#fff;color:#0f7a43;font-size:17px;font-weight:900;letter-spacing:.1em;white-space:nowrap}
.wlp-sup-list{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;margin:0;padding:0;list-style:none}
.wlp-sup-ico{position:relative;display:grid;place-items:center;width:min(118px,100%);aspect-ratio:1;margin:0 auto 12px;border-radius:50%;background:#fff}
.wlp-sup-ico>svg{width:48%;height:48%;fill:none;stroke:#0aa55a;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.wlp-sup-ico .wlp-chk{position:absolute;left:2px;top:2px;width:30px;height:30px;background:#0f7a43;box-shadow:0 0 0 3px #fff}
.wlp-sup-list h3{margin:0;font-size:15.5px;font-weight:900;letter-spacing:.05em}
.wlp-sup .wlp-note{color:rgba(255,255,255,.88)}
/* 選ばれる３つの理由 */
.wlp-rsn{padding:120px 0 130px;background:#eef6f2;overflow:hidden}
.wlp-rsn-head{margin:0 0 70px;text-align:center}
.wlp-rsn-head p{margin:0 0 12px;font:700 16px/1 Roboto,Arial,sans-serif;letter-spacing:.2em;color:#0aa55a}
.wlp-rsn-head h2{margin:0;color:#192820;font-size:clamp(26px,3vw,40px);font-weight:900;letter-spacing:.14em}
.wlp-rsn-head h2 b{margin:0 .1em;color:#0aa55a;font-size:1.5em}
.wlp-rsn-list{display:grid;gap:56px}
.wlp-rsn-item{display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:56px;padding:44px;border-radius:28px;background:#fff;box-shadow:0 18px 40px rgba(16,60,36,.07)}
.wlp-rsn-item:nth-child(even) .wlp-rsn-img{order:2}
.wlp-rsn-img img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:20px}
.wlp-rsn-no{display:inline-block;margin:0 0 14px;padding:6px 18px;border-radius:99px;background:#0aa55a;color:#fff;font:italic 600 15px/1.3 Roboto,Arial,sans-serif;letter-spacing:.04em}
.wlp-rsn-no b{font-size:20px}
.wlp-rsn-txt h3{margin:0 0 18px;color:#0f7a43;font-size:clamp(20px,2.2vw,27px);font-weight:900;line-height:1.6;letter-spacing:.06em}
.wlp-rsn-txt>p{margin:0 0 24px;font-size:15.5px;font-weight:500;line-height:2.05;letter-spacing:.04em;color:#2b3a31}
.wlp-rsn-pt{display:flex;align-items:center;gap:18px;padding:16px 20px;border-radius:14px;background:#eef6f2}
.wlp-rsn-pt>span{flex:none;display:grid;place-items:center;width:74px;height:74px;border-radius:50%;background:#fff;color:#0aa55a;font:italic 600 11px/1.1 Roboto,Arial,sans-serif;text-align:center;box-shadow:0 0 0 3px #0aa55a}
.wlp-rsn-pt>span b{display:block;font-size:22px}
.wlp-rsn-pt h4{margin:0 0 4px;font-size:16px;font-weight:900;letter-spacing:.04em;color:#192820}
.wlp-rsn-pt p{margin:0;font-size:14px;line-height:1.8;color:#3a4a40}
/* 制作料金 */
.wlp-fee{padding:120px 0 110px;background:#fff}
.wlp-fee-main{max-width:900px;margin:0 auto 40px;padding:40px 30px;border:3px solid #0aa55a;border-radius:20px;text-align:center}
.wlp-fee-k{display:inline-block;margin:0 0 6px;font-size:18px;font-weight:900;letter-spacing:.08em;color:#192820}
.wlp-fee-num{margin:0 0 14px;color:#0f7a43;font-size:24px;font-weight:900}
.wlp-fee-num b{margin-right:4px;font:900 clamp(48px,6vw,72px)/1.1 Roboto,Arial,sans-serif;color:#0aa55a;letter-spacing:.01em}
.wlp-fee-num small{font-size:15px}
.wlp-fee-sub{margin:0;font-size:15px;line-height:2;color:#3a4a40}
.wlp-fee-cols{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:0 0 40px}
.wlp-fee-col{padding:34px 34px 30px;border-radius:18px;background:#eef6f2}
.wlp-fee-col--g{background:#f2f3f2}
.wlp-fee-tag{display:inline-block;margin:0 0 12px;padding:4px 16px;border-radius:99px;background:#0aa55a;color:#fff;font-size:13px;font-weight:900;letter-spacing:.08em}
.wlp-fee-col--g .wlp-fee-tag{background:#5d6f64}
.wlp-fee-col h3{margin:0 0 8px;font-size:21px;font-weight:900;letter-spacing:.06em;color:#192820}
.wlp-fee-col>p{margin:0 0 20px;font-size:14.5px;line-height:1.9;color:#3a4a40}
.wlp-fee-inc{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0;padding:0;list-style:none}
.wlp-fee-inc li{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:10px;background:#fff;font-size:14.5px;font-weight:700;line-height:1.5}
.wlp-fee-inc .wlp-chk{width:22px;height:22px}
.wlp-fee-ask{margin:0 0 18px;padding:0;list-style:none}
.wlp-fee-ask li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 2px;border-bottom:1.5px dotted #b8c4bc;font-size:14.5px;font-weight:700}
.wlp-fee-ask b{flex:none;padding:3px 12px;border-radius:6px;background:#fff;color:#0f7a43;font-size:13px}
.wlp-fee-jump{display:inline-flex;align-items:center;gap:8px;color:#0f7a43;font-size:14.5px;font-weight:900;text-decoration:underline;text-underline-offset:5px}
.wlp-fee-jump i{width:8px;height:8px;border-right:2px solid;border-bottom:2px solid;rotate:45deg;translate:0 -2px}
.wlp-fee-do{padding:36px 30px;border-radius:18px;background:#0aa55a;color:#fff;text-align:center}
.wlp-fee-do h3{margin:0 0 6px;font-size:22px;font-weight:900;letter-spacing:.08em}
.wlp-fee-do>p{margin:0 0 24px;font-size:15px;font-weight:700}
.wlp-fee-do ul{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:0;padding:0;list-style:none}
.wlp-fee-do li{display:grid;justify-items:center;gap:10px;padding:18px 6px;border-radius:14px;background:#fff;color:#192820;font-size:14px;font-weight:900}
.wlp-fee-do svg{width:42px;height:42px;fill:none;stroke:#0aa55a;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.wlp-fee .wlp-note{text-align:center}
.wlp-pcx .wlp-lead{margin-top:18px}
/* つくって終わりに、しません。 */
.wlp-cmt{padding:120px 0 120px;background:#eef6f2}
.wlp-cmt-ttl{margin:0 0 54px;text-align:center;color:#192820;font-size:clamp(26px,3.2vw,42px);font-weight:900;letter-spacing:.14em}
.wlp-cmt-grid{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:56px;margin:0 0 56px}
.wlp-cmt-txt h3{margin:0 0 22px;color:#0f7a43;font-size:clamp(20px,2.2vw,27px);font-weight:900;line-height:1.7;letter-spacing:.06em}
.wlp-cmt-txt p{margin:0 0 14px;font-size:15.5px;font-weight:500;line-height:2.05;letter-spacing:.04em;color:#2b3a31}
.wlp-cmt-card{padding:34px 30px 24px;border-radius:22px;background:#fff;box-shadow:0 18px 40px rgba(16,60,36,.08);text-align:center}
.wlp-cmt-card h3{margin:0 0 18px;font-size:20px;font-weight:900;line-height:1.7;letter-spacing:.06em}
.wlp-cmt-card mark{background:linear-gradient(transparent 60%,#d9f3e3 60%);color:#0aa55a}
.wlp-cmt-graph{display:block;width:100%;height:auto}
.wlp-cmt-graph .g-grid{fill:none;stroke:#e1ebe5;stroke-width:1.5}
.wlp-cmt-graph .g-area{fill:#d9f3e3;opacity:.7}
.wlp-cmt-graph .g-line{fill:none;stroke:#0aa55a;stroke-width:5;stroke-linecap:round}
.wlp-cmt-graph .g-dot circle{fill:#fff;stroke:#0aa55a;stroke-width:4}
.wlp-cmt-cap{margin:10px 0 0;font-size:12px;color:#6b7a70}
.wlp-cmt-band{margin:0;padding:34px 30px;border-radius:999px;background:#0aa55a;color:#fff;text-align:center;font-size:clamp(17px,2vw,24px);font-weight:900;line-height:1.8;letter-spacing:.08em}
/* 制作の流れ */
.wlp-flow{padding:120px 0 120px;background:#fff;text-align:center}
.wlp-flow .wlp-head{margin-bottom:24px}
.wlp-flow-badge{display:inline-block;margin:0 0 50px;padding:8px 26px;border-radius:99px;background:#fff4c9;color:#192820;font-size:15px;font-weight:900;letter-spacing:.06em}
.wlp-flow-list{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin:0 0 20px;padding:0;list-style:none;counter-reset:f;text-align:left}
.wlp-flow-list li{position:relative;padding:30px 24px 26px;border-radius:18px;background:#eef6f2}
.wlp-flow-list li:not(:nth-child(4n))::after{content:"";position:absolute;right:-17px;top:50%;width:12px;height:12px;border-top:3px solid #0aa55a;border-right:3px solid #0aa55a;translate:0 -50%;rotate:45deg}
.wlp-flow-no{display:inline-flex;align-items:baseline;gap:6px;margin:0 0 12px;color:#0aa55a;font:italic 600 14px/1 Roboto,Arial,sans-serif;letter-spacing:.06em}
.wlp-flow-no b{font-size:34px}
.wlp-flow-list h3{margin:0 0 10px;font-size:18px;font-weight:900;letter-spacing:.05em;color:#192820}
.wlp-flow-list p{margin:0;font-size:14.5px;line-height:1.9;color:#3a4a40}
/* お問い合わせ */
.wlp-ask{padding:120px 0 calc(var(--rn-dome,130px) + 40px);background:#fff;text-align:center}
.wlp-ask .wlp-head{margin-bottom:40px}
.wlp-ask .wlp-ctapair{max-width:820px;margin:0 auto}
@media(max-width:1000px){
 .wlp-sup-pair{grid-template-columns:180px 1fr 180px;gap:22px}
 .wlp-sup-list{grid-template-columns:repeat(3,1fr);gap:26px 18px}
 .wlp-rsn-item{grid-template-columns:1fr;gap:28px;padding:30px}
 .wlp-rsn-item:nth-child(even) .wlp-rsn-img{order:0}
 .wlp-fee-cols,.wlp-cmt-grid{grid-template-columns:1fr}
 .wlp-fee-do ul{grid-template-columns:repeat(3,1fr)}
 .wlp-flow-list{grid-template-columns:1fr 1fr}
 .wlp-flow-list li::after{display:none}
}
@media(max-width:650px){
 .wlp-page .sp-br{display:inline}
 .wlp-lead{font-size:14.5px;text-align:left}.wlp-lead br{display:none}
 .wlp-ctapair{grid-template-columns:1fr}
 .wlp-ctapair .pcx-cta-mail{font-size:17px}
 .wlp-show{padding:80px 0 70px}
 .wlp-show-ttl{margin-bottom:34px;letter-spacing:.06em}
 .wlp-show-row{gap:16px;padding:0 8px}
 .wlp-show-row li{width:220px}
 .wlp-sup{padding:84px 0 84px}
 .wlp-sup-ttl{margin-bottom:40px;letter-spacing:.04em}
 .wlp-sup-pair{grid-template-columns:1fr 1fr;gap:18px 14px}
 .wlp-sup-mid{grid-column:1/-1;order:3}
 .wlp-sup-mid p{font-size:14.5px}
 .wlp-sup-arrow{margin:16px auto;rotate:90deg;width:40px}
 .wlp-sup-man figcaption{font-size:12.5px;padding:5px 14px}
 .wlp-sup-box{padding:44px 16px 28px}
 .wlp-sup-label{font-size:15px}
 .wlp-sup-list{gap:20px 10px}
 .wlp-sup-list h3{font-size:13px}
 .wlp-sup-ico .wlp-chk{width:24px;height:24px}
 .wlp-rsn{padding:84px 0 90px}
 .wlp-rsn-head{margin-bottom:44px}
 .wlp-rsn-list{gap:30px}
 .wlp-rsn-item{padding:20px 18px 24px;border-radius:20px}
 .wlp-rsn-txt>p{font-size:14.5px}
 .wlp-rsn-pt{gap:12px;padding:14px}
 .wlp-rsn-pt>span{width:60px;height:60px}.wlp-rsn-pt>span b{font-size:18px}
 .wlp-rsn-pt h4{font-size:14.5px}.wlp-rsn-pt p{font-size:13px}
 .wlp-fee{padding:84px 0 80px}
 .wlp-fee-main{padding:28px 16px}
 .wlp-fee-sub{font-size:13.5px;text-align:left}.wlp-fee-sub br{display:none}
 .wlp-fee-col{padding:26px 18px}
 .wlp-fee-inc{grid-template-columns:1fr}
 .wlp-fee-ask li{font-size:13.5px}
 .wlp-fee-do{padding:28px 14px}
 .wlp-fee-do ul{grid-template-columns:1fr 1fr}
 .wlp-cmt{padding:84px 0 84px}
 .wlp-cmt-ttl{margin-bottom:36px;font-size:22px;letter-spacing:.04em}
 .wlp-cmt-txt p{font-size:14.5px}
 .wlp-cmt-band{padding:26px 18px;border-radius:24px;font-size:15.5px;letter-spacing:.03em}
 .wlp-flow{padding:84px 0 84px}
 .wlp-flow-badge{margin-bottom:34px;font-size:13.5px}
 .wlp-flow-list{grid-template-columns:1fr;gap:12px}
 .wlp-flow-list li{padding:20px 18px}
 .wlp-ask{padding:84px 0 calc(var(--rn-dome,75px) + 30px)}
}
/* ===== 2026-10-20 コラム一覧 いちばん上（左に大きな名前・右に波の形と絵） */
.ed-ttl.ed-ttl--big{display:block;max-width:none;width:100%;min-height:0;margin:0;padding:200px 0 120px;border-radius:0;background:transparent;text-align:left;overflow:hidden}
.ed-ttl--big::before,.ed-ttl--big::after{display:none}
.ed-ttl-txt{position:relative;z-index:1;max-width:1236px;margin:0 auto;padding:0 35px}
.ed-ttl--big .ed-ttl-lead{margin:0 0 18px;font-size:clamp(15px,1.5vw,20px);font-weight:900;letter-spacing:.08em;color:#143a29}
.ed-ttl--big .ed-ttl-name{display:flex;align-items:baseline;flex-wrap:wrap;margin:0;font:900 clamp(56px,8.4vw,120px)/1.05 var(--display-font);letter-spacing:.02em;color:#143a29}
.ed-ttl--big .ed-ttl-name span+span{color:#00b35a;font-size:.86em}
.ed-ttl--big .ed-ttl-en{margin-top:18px;font-size:15px;letter-spacing:.3em;color:#7fa892}
.ed-ttl-blob{position:absolute;top:0;right:0;width:min(56vw,820px);height:100%;pointer-events:none}
.ed-ttl-blob svg{position:absolute;inset:0;width:100%;height:100%}
.ed-ttl-blob img{position:absolute;right:12%;top:50%;width:min(30vw,430px);height:auto;translate:0 -42%;filter:drop-shadow(0 18px 24px rgba(0,60,30,.18))}
@media(max-width:700px){
 .ed-ttl.ed-ttl--big{padding:110px 0 250px}
 .ed-ttl-txt{padding:0 5%}
 .ed-ttl--big .ed-ttl-lead{font-size:13px;margin-bottom:10px}
 .ed-ttl--big .ed-ttl-name{font-size:clamp(44px,13vw,60px)}
 .ed-ttl-blob{top:auto;bottom:0;width:100%;height:225px}
 .ed-ttl-blob img{right:6%;top:auto;bottom:10px;width:170px;translate:none}
}
/* ===== 2026-10-20 コラム一覧 おすすめ記事：白いカード・左に文字・右に写真 */
.ed-hero{overflow:visible;overflow-x:clip;padding-top:16px}
.ed-hero-view{max-width:1000px}
.ed-pick{transition:translate .3s,box-shadow .3s;display:grid;grid-template-columns:1fr 1.15fr;height:400px;margin:0 28px;padding:18px;border-radius:14px;overflow:visible;background:#fff;color:#143a29;box-shadow:0 10px 30px rgba(17,61,40,.08)}
.ed-pick::after{display:none}
.ed-pick svg{order:2;align-self:center;border-radius:10px;height:auto;aspect-ratio:1832/859;transition:filter .3s}
.ed-pick:hover svg{transform:none;filter:brightness(1.06) saturate(1.08)}
.ed-pick.is-current:hover{translate:0 -6px;box-shadow:0 22px 44px rgba(17,61,40,.18),0 0 0 3px #00a64f}
.ed-pick:hover .ed-pick-copy strong{color:#00a64f}
.ed-pick-copy{position:static;order:1;display:flex;flex-direction:column;gap:14px;padding:26px 30px 18px 22px}
.ed-pick-copy strong{transition:color .3s;margin:0;font:900 clamp(21px,2.2vw,28px)/1.6 var(--display-font);letter-spacing:.06em;text-shadow:none;color:#143a29;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ed-pick:not(.is-current) .ed-pick-copy{opacity:.45}
.ed-hero-arrow{top:50%;translate:0 -50%;width:56px;height:56px;background:#143a29}
.ed-hero-arrow::before{top:21px;width:12px;height:12px;border-color:#fff;border-width:0 2.5px 2.5px 0}
.ed-hero-prev{left:-28px}.ed-hero-prev::before{left:23px}
.ed-hero-next{right:-28px}.ed-hero-next::before{right:23px}
@media(max-width:700px){
 .ed-pick{grid-template-columns:1fr;height:auto;aspect-ratio:auto;margin:0 10px;padding:12px}
 .ed-pick svg{order:0;height:auto;aspect-ratio:1832/859;border-radius:8px}
 .ed-pick-copy{gap:10px;padding:16px 6px 6px}
 .ed-pick-copy strong{font-size:17px;-webkit-line-clamp:3}
 .ed-hero-arrow{top:28%;width:40px;height:40px}
 .ed-hero-arrow::before{top:15px;width:9px;height:9px}
 .ed-hero-prev{left:-6px}.ed-hero-prev::before{left:16px}
 .ed-hero-next{right:-6px}.ed-hero-next::before{right:16px}
}
/* おすすめ記事 二回目：三角・上のつまみ・日付をなくし、説明・タグ・ボタンを入れる */
.ed-hero-view::after{display:none}
.ed-pick-desc{font-size:14.5px;font-weight:500;line-height:1.9;letter-spacing:.04em;color:#4c5d52}
.ed-pick-tags{display:flex;flex-wrap:wrap;gap:6px 14px}
.ed-pick-tags span{color:#143a29;font-size:13.5px;font-weight:700;letter-spacing:.04em}
.ed-pick-tags span::first-letter{color:#00a64f;font-size:1.15em}
.ed-pick-btn{align-self:flex-start;margin-top:auto}
.ed-pick:hover .ed-pick-btn{background:#00a64f;color:#fff}
.ed-pick:hover .ed-pick-btn .mt-pill-icon{background:#fff;color:#00a64f}
.ed-pick-genre{align-self:flex-start;padding:2px 16px;border-radius:99px;background:#00a64f;color:#fff;font-size:13px;font-weight:700;line-height:1.9;letter-spacing:.06em}
@media(max-width:700px){
 .ed-pick-desc{font-size:13px;line-height:1.8}
 .ed-pick-tags span{font-size:12px}
}
/* ===== 2026-10-21 コラム（一覧・記事）だけ、読みやすい書体に */
#column-details,#column-details :is(h2,h3,p,a,strong,span,small,em,button,li),.rn-article,.rn-article :is(h1,h2,h3,p,a,b,strong,span,small,li,td,th,summary){font-family:"Noto Sans JP","MT Noto Backup","Hiragino Kaku Gothic ProN",Meiryo,sans-serif}
#column-details .ed-ttl-name,#column-details .ed-ttl-name span{font-family:var(--display-font)}
/* ===== 2026-10-21 コラム記事：右にお問い合わせとおすすめの記事 */
.rn-art-wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:44px;align-items:start}
.rn-art-side{height:100%}
.rn-side-in{position:sticky;top:110px;display:grid;gap:28px}
.rn-side-cta{position:relative;padding:26px 22px 22px;border-radius:20px;background:#00a64f;color:#fff;text-align:center;overflow:hidden}
.rn-side-cta-ico{display:grid;place-items:center;width:72px;height:72px;margin:0 auto 14px;border-radius:50%;background:#fff;color:#00a64f}
.rn-side-cta-ico svg{width:38px;height:38px;fill:currentColor}
.rn-side-cta-ico circle{fill:#fff}
.rn-side-cta-ttl{margin:0 0 16px;font-size:20px;font-weight:900;line-height:1.6;letter-spacing:.06em}
.rn-side-cta-btn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:58px;margin:0 0 10px;border-radius:8px;background:var(--red,#f4433e);box-shadow:0 4px 0 rgba(0,0,0,.18);color:#fff;font-size:17px;font-weight:900;letter-spacing:.06em;text-decoration:none;transition:translate .15s,box-shadow .15s,filter .2s}
.rn-side-cta-btn:hover{translate:0 2px;box-shadow:0 2px 0 rgba(0,0,0,.18);filter:brightness(1.05)}
.rn-side-cta-btn span{font-size:20px}
.rn-side-cta-tel{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 10px;border-radius:8px;background:#fff;color:#00a64f;text-decoration:none}
.rn-side-cta-tel svg{flex:none;width:22px;height:22px}
.rn-side-cta-tel span{font-size:22px;font-weight:900;line-height:1.2;letter-spacing:.01em}
.rn-side-cta-tel small{display:block;margin-top:2px;font-size:12px;font-weight:700;color:#4c5d52;letter-spacing:.04em}
.rn-side-pick{padding:24px 20px;border-radius:20px;background:#fff}
.rn-side-ttl{margin:0 0 14px;padding:0 0 10px;border-bottom:3px solid #00bd60;font-size:19px;font-weight:900;color:#143a29;letter-spacing:.06em}
.rn-side-pick ul{display:grid;gap:16px;margin:0;padding:0;list-style:none}
.rn-side-pick a{display:grid;grid-template-columns:1fr;gap:10px;align-items:start;color:#143a29;text-decoration:none}
.rn-side-pick img{display:block;width:100%;height:auto;aspect-ratio:1832/859;object-fit:cover;border-radius:8px;transition:filter .3s}
.rn-side-pick b{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:15px;line-height:1.6;transition:color .2s}
.rn-side-pick small{display:block;margin-top:4px;font-size:12.5px;color:#7a8a80}
.rn-side-pick a:hover b{color:#00a64f}
.rn-side-pick a:hover img{filter:brightness(1.08)}
@media(max-width:1000px){
 .rn-art-wrap{grid-template-columns:minmax(0,1fr);gap:40px}
 .rn-side-in{position:static}
}
/* ===== 2026-10-21 コラム記事：本文の上に目次 */
.rn-toc{margin:2em 0 1em;padding:26px 30px 24px;border:2px solid #00bd60;border-radius:16px;background:#fff}
.rn-toc-ttl{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:19px;font-weight:900;line-height:1.4;color:#143a29;letter-spacing:.08em}
.rn-toc-ttl svg{flex:none;width:24px;height:24px;fill:#00a64f;stroke:#00a64f;stroke-width:2.2;stroke-linecap:round}
.rn-toc ul{display:grid;gap:4px;margin:0;padding:0;list-style:none}
.rn-toc li{position:relative;padding-left:1.5em;font-size:16.5px;line-height:1.8}
.rn-toc li::before{content:"▼";position:absolute;left:0;top:.45em;font-size:.72em;color:#00a64f}
.rn-toc a{color:#143a29;font-weight:700;text-decoration:none;transition:color .2s}
.rn-toc a:hover{color:#00a64f;text-decoration:underline;text-underline-offset:4px}
@media(max-width:700px){
 .rn-toc{padding:20px 18px 18px}
 .rn-toc li{font-size:15px}
}
/* ===== 2026-10-21 提案事例：目次ボタン＋大きなカード／くわしいページ */
.csx-wrap{position:relative;z-index:1;max-width:1280px;margin:0 auto;padding:70px 4% 50px}
.cs-jump{grid-template-columns:repeat(3,1fr);margin:0 0 64px}
.csx-list{position:relative;display:grid;gap:56px}
.csx-list>.csx-card{z-index:1}
.bg-shapes .csm1{width:440px;left:-220px;top:12%;opacity:.3}
.bg-shapes .csm3{width:460px;right:-240px;top:52%;opacity:.28;animation-direction:reverse}
.bg-shapes .csm5{width:440px;left:-220px;top:88%;opacity:.3}
.csx-card{position:relative;display:block;padding:0 56px 48px;border:3px solid transparent;border-radius:28px;background:#fff;color:#192820;text-decoration:none;box-shadow:0 12px 36px rgba(16,60,35,.08);scroll-margin-top:120px;transition:border-color .25s,box-shadow .25s}
.csx-card:hover{border-color:#00a64f;box-shadow:0 18px 40px rgba(16,60,35,.13)}
.csx-band{position:relative;display:flex;align-items:center;min-height:64px;margin:44px 0 26px -73px;background:#00a64f;color:#fff}
.csx-band::before{content:"";position:absolute;top:-14px;left:0;border-bottom:14px solid #0b5e33;border-left:14px solid transparent}
.csx-band-no{position:relative;flex:none;display:flex;align-items:baseline;gap:12px;padding:0 50px 0 40px;font-size:20px;font-weight:900;letter-spacing:.06em}
.csx-band-no small{font-size:16px;font-weight:700}
.csx-band-no::after{content:"";position:absolute;top:-14px;bottom:-14px;right:12px;width:2px;background:#fff;transform:skewX(-38deg)}
.csx-band-ttl{padding:10px 30px;font-size:clamp(19px,2vw,24px);font-weight:900;letter-spacing:.08em}
.csx-who{margin:0 0 6px;font-size:15px;font-weight:700;color:#4c5d52}
.csx-ttl{word-break:auto-phrase;margin:0 0 26px;font-size:clamp(26px,3.2vw,42px);font-weight:900;line-height:1.5;color:#143a29;letter-spacing:.04em}
.csx-img{margin:0 0 36px;border-radius:18px;overflow:hidden;aspect-ratio:21/9;background:#eef2ef}
.csx-img img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top;transition:scale .5s}
.csx-card:hover .csx-img img{scale:1.03}
.csx-ba-word{margin:0 0 6px!important;font:900 13px/1 Roboto,Arial,sans-serif;letter-spacing:.14em;color:#7a8a80}
.csx-before{padding:26px 32px;border-radius:16px;background:#f3f5f4}
.csx-before :is(h2,h3){margin:0 0 10px;padding:0;border:0;font-size:20px;line-height:1.5;font-weight:900;color:#143a29}
.csx-before ul{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.csx-before li{position:relative;margin:0;padding-left:1.2em;font-size:16.5px;line-height:1.8;font-weight:500}
.csx-before li::before{content:"";position:absolute;left:.2em;top:.75em;width:7px;height:7px;border-radius:50%;background:#7a8a80}
.csx-ba-arw{display:block;width:0;margin:14px auto;border-left:18px solid transparent;border-right:18px solid transparent;border-top:16px solid #00a64f}
.csx-after{margin:0 0 30px;padding:28px 32px 30px;border-radius:16px;background:#f2f9f4}
.csx-after-head{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin:0 0 18px}
.csx-after .csx-tag{flex:none;margin:0;padding:8px 34px 8px 18px;border:0;background:#00a64f;color:#fff;font-size:16px;line-height:1.5;font-weight:900;letter-spacing:.06em;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 50%,calc(100% - 16px) 100%,0 100%)}
.csx-after .csx-lead{margin:0;font-size:clamp(22px,2.4vw,30px);line-height:1.5;font-weight:900;color:#143a29;letter-spacing:.04em}
.csx-after .csx-check{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.csx-check li{position:relative;margin:0;padding-left:2.1em;font-size:17px;line-height:1.8;font-weight:700}
.csx-check li::before{content:"";position:absolute;left:0;top:.2em;width:1.3em;height:1.3em;border:2px solid #9fb5a7;border-radius:3px;background:#fff}
.csx-check li::after{content:"";position:absolute;left:.4em;top:.38em;width:.8em;height:.42em;border-left:3px solid #00a64f;border-bottom:3px solid #00a64f;rotate:-45deg}
.csx-result{margin:0 0 30px;padding:28px 32px 32px;border-radius:16px;background:#fff;box-shadow:0 6px 26px rgba(16,60,35,.1);text-align:center}
.csx-result .csx-result-lbl{margin:0 0 20px;font-size:22px;font-weight:900;line-height:1.4;color:#143a29;letter-spacing:.12em}
.csx-result .csx-result-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:20px;margin:0;padding:0;list-style:none}
.csx-result .csx-result-row li{display:flex;align-items:flex-end;justify-content:center;gap:12px;margin:0;text-align:left}
.csx-up{flex:none;width:40px;height:52px;margin-bottom:6px}
.csx-result li span{display:flex;flex-direction:column}
.csx-result small{font-size:16px;font-weight:700;color:#4c5d52;line-height:1.4}
.csx-result .csx-result-row b{white-space:nowrap;font:900 48px/1.1 Roboto,"Noto Sans JP",sans-serif;color:#143a29;letter-spacing:.01em}
.csx-voice{display:flex;align-items:center;gap:28px;margin:0 0 36px}
.csx-voice-face{flex:none;display:grid;place-items:center;width:110px;height:110px;border-radius:50%;background:#e3eee7;overflow:hidden}
.csx-voice-face svg{width:76%;height:76%;margin-top:18%;fill:#a9c2b2}
.csx-voice blockquote{position:relative;flex:1;margin:0;padding:22px 28px;border-radius:16px;background:#fffbe6}
.csx-voice blockquote::before{content:"";position:absolute;left:-14px;top:50%;translate:0 -50%;border-top:12px solid transparent;border-bottom:12px solid transparent;border-right:16px solid #fffbe6}
.csx-voice blockquote p{margin:0 0 6px;font-size:18px;line-height:1.8;font-weight:900;color:#143a29}
.csx-voice cite{font-size:14px;font-style:normal;font-weight:700;color:#4c5d52}
.csx-voice cite::before{content:"―― "}
.csx-more{display:flex;width:fit-content;margin:0 auto}
.csx-card:hover .csx-more{background:#00a64f;color:#fff}
.csx-card:hover .csx-more .mt-pill-icon{background:#fff;color:#00a64f}
.cs-detail .rn-article-inner{max-width:1100px}
.cs-detail .rn-art-head .csx-band{margin:0 0 22px}
.cs-detail .rn-art-body > ul{margin-top:-10px}
.cs-detail .cs-note{padding:16px 0 0;background:none;text-align:left}
@media(max-width:700px){
 .csx-wrap{padding:44px 16px 30px}
 .cs-jump{margin-bottom:44px}
 .csx-list{gap:36px}
 .csx-card{padding:0 18px 28px;border-radius:20px}
 .csx-band{min-height:52px;margin:30px 0 18px -35px}
 .csx-band-no{flex-direction:column;gap:0;padding:6px 32px 6px 30px;font-size:18px;line-height:1.2}
 .csx-band-no small{font-size:12px}
 .csx-band-ttl{padding:8px 12px 8px 16px;font-size:17px;letter-spacing:.04em}
 .csx-ttl{margin-bottom:18px;font-size:23px}
 .csx-img{margin-bottom:22px;border-radius:12px;aspect-ratio:16/10}
 .csx-before,.csx-after{padding:20px 18px}
 .csx-before li,.csx-check li{font-size:15px}
 .csx-after .csx-lead{font-size:21px}
 .csx-result{padding:22px 14px 24px}
 .csx-result .csx-result-row{grid-template-columns:1fr 1fr;gap:18px 8px}
 .csx-result .csx-result-row li{justify-content:flex-start;gap:8px}
 .csx-up{width:30px;height:40px}
 .csx-result small{font-size:14px}
 .csx-result .csx-result-row b{font-size:28px}
 .csx-voice{flex-direction:column;gap:18px}
 .csx-voice-face{width:90px;height:90px}
 .csx-voice blockquote{padding:18px}
 .csx-voice blockquote::before{left:50%;top:-14px;translate:-50% 0;border:12px solid transparent;border-top:0;border-bottom:16px solid #fffbe6}
 .csx-voice blockquote p{font-size:16px}
 .cs-detail .rn-art-head .csx-band{margin-left:-18px}
}
/* ===== 2026-10-21 提案事例：お客様の声（横に流れる） */
.csv{position:relative;z-index:1;padding:90px 0 100px;background:#fff;overflow:hidden}
.csv-inner{position:relative;z-index:1;margin:0 auto 44px;padding:0 5%;text-align:center}
.csv-view{position:relative;z-index:1}
.bg-shapes .csm6{width:420px;right:-210px;top:-40px;opacity:.3}
.csv-en{margin:0 0 6px;font:900 15px/1 Roboto,Arial,sans-serif;letter-spacing:.2em;color:#00a64f}
.csv h2{margin:0;font-size:clamp(26px,3vw,36px);font-weight:900;line-height:1.5;color:#143a29;letter-spacing:.08em}
.csv-view{overflow:hidden}
.csv-track{display:flex;width:max-content;margin:0;padding:6px 0 10px;list-style:none;animation:csv-move 60s linear infinite}
.csv-view:hover .csv-track{animation-play-state:paused}
@keyframes csv-move{to{translate:-50% 0}}
.csv-card{flex:none;display:flex;flex-direction:column;width:340px;margin-right:24px;padding:26px 26px 22px;border-radius:20px;background:#f4f8f5;color:#192820}
.csv-head{display:flex;align-items:center;gap:16px;margin:0 0 14px}
.csv-face{flex:none;width:64px;height:64px}
.csv-face svg{display:block;width:100%;height:100%}
.csv-ttl{word-break:auto-phrase;margin:0;font-size:19px;font-weight:900;line-height:1.5;color:#143a29}
.csv-txt{flex:1;margin:0 0 12px;font-size:15px;font-weight:500;line-height:1.9}
.csv-who{margin:0;font-size:13px;font-weight:700;color:#00a64f}
.csv-who::before{content:"―― "}
@media(max-width:700px){
 .csv{padding:64px 0 70px}
 .csv-inner{margin-bottom:30px}
 .csv-card{width:280px;margin-right:16px;padding:22px 20px 18px}
 .csv-face{width:54px;height:54px}
 .csv-ttl{font-size:17px}
}
@media(prefers-reduced-motion:reduce){
 .csv-view{overflow-x:auto}
 .csv-track{animation:none}
}
/* ===== 2026-10-21 TOPの提案事例カード：お客様のひと言＋結果＋詳しくみる */
.vc-text .vc-voice{position:relative;margin:0 0 24px;padding:18px 24px;border-radius:14px;background:#fffbe6;color:#143a29;font-size:16px;font-weight:900;line-height:1.85}
.vc-text .vc-result{margin:0 0 26px;padding:20px 20px 24px;box-shadow:0 4px 20px rgba(16,60,35,.09)}
.vc-result .csx-result-lbl{margin-bottom:14px;font-size:18px}
.vc-result .csx-result-row{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:14px}
.vc-result .csx-up{width:32px;height:42px}
.vc-result small{font-size:14px}
.csx-result.vc-result .csx-result-row b{font-size:36px}
.vc-foot{align-items:center}
.vc-pill{flex:none}
@media(max-width:700px){
 .vc-text .vc-voice{padding:14px 16px;font-size:15px}
 .vc-text .vc-result{padding:18px 12px 20px}
 .vc-result .csx-result-row{grid-template-columns:1fr 1fr}
 .csx-result.vc-result .csx-result-row b{font-size:28px}
 .vc-result .csx-up{width:26px;height:34px}
}

/* TOPのコラムカード：表紙画像 */
.columns .column-cover.has-img{height:auto;aspect-ratio:1832/859;padding:0;background:#fff}
.columns .column-cover.has-img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.columns .column-card:hover .column-cover.has-img img{transform:scale(1.04)}

/* 提案事例：くわしいページ（読み物の形） */
.cst-page .rn-article-inner{max-width:1180px}
.cst-page img{height:auto}
.cst-page .is-ours .cst-vs-mock img{height:100%}
.cst-kv{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:44px;align-items:center;margin:0 0 36px;padding:48px;border-radius:28px;background:#fff}
.cst-page .cst-kv .csx-band{margin:0 0 24px -65px}
.cst-who{display:flex;align-items:center;gap:8px;margin:0 0 4px;font-size:14px;font-weight:700;color:#00a64f;letter-spacing:.06em}
.cst-pin{width:10px;height:10px;border-radius:50% 50% 50% 0;background:#00a64f;rotate:-45deg}
.cst-name{margin:0 0 10px;font-size:19px;font-weight:900;color:#143a29}
.cst-kv h1{margin:0 0 24px;font-family:"Zen Kaku Gothic New",sans-serif;font-size:clamp(24px,2.5vw,33px);line-height:1.55;font-weight:900;color:#143a29;letter-spacing:.02em;word-break:auto-phrase}
.cst-points{display:grid;gap:8px;margin:0 0 20px;padding:18px 22px;border-radius:14px;background:#f2f9f4;list-style:none}
.cst-points li{position:relative;padding-left:30px;font-size:16px;line-height:1.7;font-weight:700;color:#1d2a23}
.cst-points li::before{content:"";position:absolute;left:0;top:.25em;width:20px;height:20px;border-radius:50%;background:#00a64f url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3L15 6.5' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.cst-points b{margin-left:4px;font-size:1.25em;color:#00a64f}
.cst-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.cst-tags li{padding:4px 14px;border:1px solid #bfe3cc;border-radius:999px;background:#fff;font-size:13px;font-weight:700;color:#3f5a4a}
.cst-kv-img{margin:0}
.cst-kv-img img{display:block;width:100%;aspect-ratio:1555/1080;object-fit:cover;border-radius:18px;box-shadow:0 18px 40px rgba(16,60,35,.12)}
.cst-kv-img figcaption,.cst-fig figcaption,.cst-photos figcaption{margin-top:10px;font-size:13px;line-height:1.7;color:#6b7a71}

.cst-grid{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:36px;align-items:start}
.cst-main{padding:56px 7%;border-radius:24px;background:#fff;color:#192820;font-size:17px;line-height:2.05;font-weight:500;letter-spacing:.03em}
.cst-main p{margin:0 0 1.2em;text-wrap:pretty}
.cst-lead{font-size:18px;font-weight:700;line-height:2}

.cst-ba{margin:36px 0 44px}
.cst-ba-box{display:grid;grid-template-columns:110px minmax(0,1fr);border-radius:16px;overflow:hidden}
.cst-ba-box.is-before{background:#f3f5f4}
.cst-ba-box.is-after{background:#fff8e1}
.cst-ba-head{display:flex;align-items:center;justify-content:center;margin:0!important;color:#fff;font-size:18px;font-weight:900;letter-spacing:.1em}
.is-before .cst-ba-head{background:#7a8a80}
.is-after .cst-ba-head{background:#00a64f}
.cst-ba-box ul{display:grid;gap:4px;margin:0;padding:22px 26px;list-style:none}
.cst-ba-box li{position:relative;padding-left:1.2em;font-size:16px;line-height:1.8;font-weight:700}
.cst-ba-box li::before{content:"";position:absolute;left:.15em;top:.72em;width:7px;height:7px;border-radius:50%;background:#7a8a80}
.is-after li::before{background:#00a64f}
.cst-ba-arw{display:block;width:0;margin:12px auto;border-left:20px solid transparent;border-right:20px solid transparent;border-top:16px solid #00a64f}

.cst-toc{margin:0 0 56px;padding:26px 30px;border:2px solid #dbeee2;border-radius:18px;background:#fbfdfc}
.cst-toc-ttl{display:flex;align-items:center;gap:10px;margin:0 0 12px!important;font-size:17px;font-weight:900;color:#143a29}
.cst-toc-icon{width:18px;height:14px;background:linear-gradient(#00a64f 0 0) 0 0/100% 2px no-repeat,linear-gradient(#00a64f 0 0) 0 6px/100% 2px no-repeat,linear-gradient(#00a64f 0 0) 0 12px/70% 2px no-repeat}
.cst-toc ol{margin:0;padding:0;list-style:none;counter-reset:toc}
.cst-toc li{counter-increment:toc;border-top:1px dashed #d5e6dc}
.cst-toc a{display:flex;gap:14px;padding:10px 4px;font-size:15.5px;line-height:1.6;font-weight:700;color:#1d2a23;text-decoration:none;transition:color .2s}
.cst-toc a::before{content:counter(toc,decimal-leading-zero);flex:none;font:900 14px/1.75 Roboto,Arial,sans-serif;color:#00a64f}
.cst-toc a:hover{color:#00a64f}

.cst-sec{margin:0 0 64px;scroll-margin-top:110px}
.cst-sec h2{display:flex;align-items:baseline;gap:14px;margin:0 0 26px;padding:18px 24px;border-radius:12px;background:#eef6f1;font-size:clamp(20px,2.1vw,25px);line-height:1.55;font-weight:900;color:#143a29}
.cst-no{flex:none;font:900 15px/1 Roboto,Arial,sans-serif;color:#00a64f;letter-spacing:.06em}
.cst-sec h3{margin:0 0 20px;padding-left:16px;border-left:4px solid #00a64f;font-size:clamp(18px,1.8vw,21px);line-height:1.65;font-weight:900;color:#00843f}
.cst-mark{background:linear-gradient(transparent 62%,#ffe98a 62%);font-weight:900}
.cst-fig{margin:28px 0 30px}
.cst-fig img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid #e3ebe6}
.cst-photos{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:28px 0 30px}
.cst-photos figure{position:relative;margin:0}
.cst-photos img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px}
.cst-photos.is-ba img{aspect-ratio:16/10;object-position:top;border:1px solid #e3ebe6}
.cst-ba-tag{position:absolute;top:10px;left:10px;z-index:1;padding:3px 12px;border-radius:999px;background:#5f6d65;color:#fff;font-size:12.5px;font-weight:700;line-height:1.7}
.cst-ba-tag.is-new{background:#00a64f}

.cst-traps{display:grid;gap:14px;margin:26px 0 30px;padding:0;list-style:none;counter-reset:trap}
.cst-traps li{counter-increment:trap;display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:16px;padding:20px 24px;border:1px solid #e3ebe6;border-radius:16px}
.cst-traps li::before{content:counter(trap);grid-row:span 2;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff1ec;color:#d9532b;font:900 20px/1 Roboto,Arial,sans-serif}
.cst-traps b{font-size:17.5px;line-height:1.6;color:#143a29}
.cst-traps span{font-size:15.5px;line-height:1.9;color:#3f4d45}
.cst-memo{padding:22px 26px;border-radius:16px;background:#fffbea}
.cst-memo p{margin:0!important;font-size:15.5px;line-height:1.95}
.cst-memo .cst-memo-ttl{margin:0 0 6px!important;font-size:14px;font-weight:900;color:#b07a00;letter-spacing:.08em}

.cst-pillars{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:26px 0 0;padding:0;list-style:none}
.cst-pillars li{position:relative;padding:24px 24px 22px;border-radius:16px;background:#f2f9f4;overflow:hidden}
.cst-pillar-no{position:absolute;top:-8px;right:12px;font:900 72px/1 Roboto,Arial,sans-serif;color:#00a64f1f}
.cst-pillars b{display:block;margin-bottom:6px;font-size:18px;line-height:1.6;color:#00843f}
.cst-pillars span:not(.cst-pillar-no){display:block;font-size:15px;line-height:1.85;color:#3f4d45}

.cst-vs{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:26px 0 32px}
.cst-vs-box{padding:18px 18px 16px;border-radius:16px}
.cst-vs-box.is-other{background:#2a2626;color:#f3eeee}
.cst-vs-box.is-ours{background:#f2f9f4;color:#1d2a23}
.cst-vs-lbl{margin:0 0 12px!important;font-size:14px;font-weight:900;letter-spacing:.04em}
.cst-vs-mock{position:relative;display:grid;place-items:center;aspect-ratio:16/10;margin-bottom:12px;border-radius:10px;overflow:hidden}
.is-other .cst-vs-mock{background:radial-gradient(circle at 50% 60%,#8b1414,#1a0b0b 75%)}
.cst-vs-bug{width:34%;aspect-ratio:1/1.35;border-radius:50% 50% 46% 46%;background:#050404;box-shadow:-30px -18px 0 -18px #050404,30px -18px 0 -18px #050404,-36px 10px 0 -19px #050404,36px 10px 0 -19px #050404}
.cst-vs-warn{position:absolute;top:10%;left:8%;padding:2px 12px;background:#ffd400;color:#c00;font-size:clamp(14px,1.6vw,20px);font-weight:900;rotate:-6deg}
.is-ours .cst-vs-mock img{width:100%;height:100%;object-fit:cover;object-position:top}
.cst-vs-box ul{display:grid;gap:2px;margin:0;padding:0;list-style:none}
.cst-vs-box li{position:relative;padding-left:1.3em;font-size:14.5px;line-height:1.8;font-weight:700}
.cst-vs-box li::before{content:"×";position:absolute;left:0;color:#ff7a7a}
.is-ours li::before{content:"○";color:#00a64f}

.cst-steps{position:relative;display:grid;gap:0;margin:26px 0 0;padding:0;list-style:none;counter-reset:step}
.cst-steps li{counter-increment:step;position:relative;display:grid;gap:2px;padding:0 0 26px 62px}
.cst-steps li::before{content:counter(step);position:absolute;left:0;top:0;z-index:1;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#00a64f;color:#fff;font:900 18px/1 Roboto,Arial,sans-serif}
.cst-steps li::after{content:"";position:absolute;left:20px;top:42px;bottom:0;width:2px;background:#cfe8d8}
.cst-steps li:last-child{padding-bottom:0}
.cst-steps li:last-child::after{display:none}
.cst-steps b{font-size:17.5px;line-height:2.4;color:#143a29}
.cst-steps span{font-size:15.5px;line-height:1.9;color:#3f4d45}

.cst-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:26px 0 30px;padding:0;list-style:none}
.cst-nums li{display:grid;justify-items:center;align-content:center;gap:6px;padding:22px 10px 20px;border:2px solid #00a64f;border-radius:18px;text-align:center;background:#fff}
.cst-nums small{font-size:13.5px;line-height:1.5;font-weight:700;color:#3f5a4a}
.cst-nums b{font:900 58px/1 Roboto,Arial,sans-serif;color:#00a64f}
.cst-nums em{margin-left:2px;font-style:normal;font-size:22px}
.cst-nums b.is-word{font-family:"Zen Kaku Gothic New",sans-serif;font-size:36px;line-height:1.6}
.cst-table-wrap{margin:0 0 30px;overflow-x:auto}
.cst-table{width:100%;min-width:480px;border-collapse:separate;border-spacing:0;font-size:15px;line-height:1.7}
.cst-table th,.cst-table td{padding:13px 16px;border-bottom:1px solid #e3ebe6;text-align:left}
.cst-table thead th{border-bottom:2px solid #143a29;font-size:14px;color:#143a29}
.cst-table thead th:last-child{color:#00a64f;border-bottom-color:#00a64f}
.cst-table tbody th{width:28%;font-weight:900;color:#143a29}
.cst-table td{color:#6b7a71}
.cst-table td:last-child{background:#f2f9f4;color:#00843f;font-weight:900}

.cst-voice{position:relative;margin:0 0 36px;padding:44px 40px 40px;border-radius:24px;background:#f2f9f4;overflow:hidden}
.cst-voice-en{position:absolute;top:-6px;right:18px;margin:0!important;font:900 92px/1 Roboto,Arial,sans-serif;color:#00a64f14;letter-spacing:.04em}
.cst-voice h2{position:relative;margin:0 0 22px;font-size:24px;font-weight:900;color:#143a29}
.cst-voice-body{position:relative;display:grid;grid-template-columns:190px minmax(0,1fr);gap:30px;align-items:start}
.cst-voice-photo{margin:0;text-align:center}
.cst-voice-photo img{display:block;width:100%;aspect-ratio:1;object-fit:cover;object-position:top;border-radius:50%;border:5px solid #fff;box-shadow:0 10px 26px rgba(16,60,35,.12)}
.cst-voice-photo figcaption{margin-top:10px;font-size:14px;line-height:1.6;font-weight:700;color:#3f5a4a}
.cst-voice-catch{margin:0 0 14px!important;font-size:21px;line-height:1.65;font-weight:900;color:#00843f}
.cst-voice-text p{font-size:16px;line-height:2}

.cst-staff{display:flex;gap:22px;align-items:flex-start;margin:0 0 40px}
.cst-staff-face{flex:none;display:grid;place-items:center;width:76px;height:76px;border-radius:50%;background:#e6f3eb}
.cst-staff-face svg{width:44px;fill:#00a64f}
.cst-staff-text{position:relative;flex:1;padding:22px 26px;border-radius:18px;background:#fff8e1}
.cst-staff-text::before{content:"";position:absolute;left:-12px;top:26px;border:8px solid transparent;border-right:12px solid #fff8e1;border-left:0}
.cst-staff-text p{margin:0!important;font-size:15.5px;line-height:1.95}
.cst-staff-text .cst-staff-ttl{margin:0 0 6px!important;font-size:14px;font-weight:900;color:#b07a00}

.cst-close{padding:40px 36px;border-radius:24px;background:linear-gradient(135deg,#00a64f,#25b780);color:#fff;text-align:center}
.cst-close-ttl{margin:0 0 16px!important;font-family:"Zen Kaku Gothic New",sans-serif;font-size:clamp(21px,2.3vw,27px);line-height:1.6;font-weight:900}
.cst-close p{font-size:15.5px;line-height:1.95;text-align:left}
.cst-close .cst-close-ttl,.cst-close .cst-close-btn{text-align:center}
.cst-close-btn{margin:24px 0 0!important}

.cst-side{position:sticky;top:110px}
.cst-card{padding:26px 24px;border-radius:22px;background:#fff}
.cst-card-logo{margin:0 0 14px;padding:12px;border-radius:12px;background:#f7faf8}
.cst-card-logo img{display:block;width:100%;height:auto}
.cst-card-name{margin:0 0 14px;font-size:20px;font-weight:900;color:#143a29}
.cst-card dl{display:grid;margin:0 0 18px}
.cst-card dl div{display:grid;grid-template-columns:52px minmax(0,1fr);gap:8px;padding:9px 0;border-top:1px solid #e8efeb}
.cst-card dl div:last-child{border-bottom:1px solid #e8efeb}
.cst-card dt{font-size:12.5px;font-weight:900;color:#00a64f;line-height:1.9}
.cst-card dd{margin:0;font-size:14px;line-height:1.75;font-weight:500;color:#1d2a23}
.cst-card-sub{display:inline-block;margin:0 0 10px;padding:4px 12px;border-radius:8px 8px 0 0;background:#f2f9f4;font-size:13.5px;font-weight:900;color:#00843f}
.cst-card ul{display:grid;gap:8px;margin:0 0 18px;padding:0;list-style:none}
.cst-card li{position:relative;padding-left:1.4em;font-size:14px;line-height:1.7;font-weight:700}
.cst-card li::before{content:"";position:absolute;left:0;top:.35em;width:14px;height:14px;border-radius:50%;background:#00a64f url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3L15 6.5' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.cst-card-link{margin:0}
.cst-card-link a{display:flex;justify-content:center;gap:8px;padding:11px;border:2px solid #00a64f;border-radius:999px;font-size:14px;font-weight:700;color:#00843f;text-decoration:none;transition:background .3s,color .3s}
.cst-card-link a:hover{background:#00a64f;color:#fff}
.cst-sp{display:none}

@media(max-width:1000px){
.cst-kv{grid-template-columns:minmax(0,1fr);gap:28px;padding:40px 36px}
.cst-page .cst-kv .csx-band{margin-left:-53px}
.cst-grid{grid-template-columns:minmax(0,1fr)}
.cst-side{position:static}
}
@media(max-width:700px){
.cst-kv{padding:30px 20px;border-radius:22px}
.cst-page .cst-kv .csx-band{margin-left:-37px}
.cst-pc{display:none}
.cst-sp{display:inline}
.cst-main{padding:34px 20px;font-size:16.5px;line-height:2}
.cst-lead{font-size:16.5px}
.cst-ba-box{grid-template-columns:1fr}
.cst-ba-head{padding:8px}
.cst-ba-box ul{padding:16px 18px}
.cst-toc{padding:20px 18px}
.cst-sec{margin-bottom:52px}
.cst-sec h2{flex-direction:column;gap:6px;padding:16px 18px}
.cst-photos,.cst-pillars,.cst-vs{grid-template-columns:1fr}
.cst-traps li{grid-template-columns:36px minmax(0,1fr);padding:16px 16px;column-gap:12px}
.cst-traps li::before{width:36px;height:36px;font-size:17px}
.cst-steps li{padding-left:54px}
.cst-nums{grid-template-columns:1fr;gap:10px}
.cst-nums li{grid-template-columns:1fr auto;justify-items:start;align-items:center;padding:14px 20px}
.cst-nums b{font-size:44px}
.cst-nums b.is-word{font-size:28px}
.cst-voice{padding:34px 20px 26px}
.cst-voice-en{font-size:60px}
.cst-voice-body{grid-template-columns:1fr;gap:18px}
.cst-voice-photo{width:150px;margin:0 auto}
.cst-voice-catch{font-size:18.5px}
.cst-staff{flex-direction:column;align-items:center;gap:14px}
.cst-staff-text::before{left:50%;top:-12px;translate:-50% 0;border:8px solid transparent;border-bottom:12px solid #fff8e1;border-top:0}
.cst-close{padding:32px 20px}
}
