@charset "utf-8";
.df-container { width: calc(100% - (var(--df-gutter) * 2)); max-width: var(--df-content-max); margin-right: auto; margin-left: auto; }
.df-section { padding-top: var(--df-section-space); padding-bottom: var(--df-section-space); }
.df-eyebrow { margin: 0 0 14px; color: var(--df-color-eyebrow); font-size: 12px; font-weight: 800; letter-spacing: .16em; line-height: 1.5; }
.df-section-heading, .df-card-title, .df-wrap-budoux { text-wrap: balance; }
.df-section-heading { margin: 0; color: var(--df-color-primary); font-family: var(--df-font-serif); font-size: clamp(28px, 4vw, 46px); font-weight: 800; letter-spacing: .02em; line-height: 1.35; }
.df-button, .formBtn { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 10px; padding: 12px 23px; border: 3px solid var(--df-color-primary); border-radius: 999px; font: inherit; font-weight: 800; line-height: 1.5; text-align: center; text-decoration-line: none; transition-property: background-color,border-color,color,transform,box-shadow; transition-duration: var(--df-transition-duration); transition-timing-function: var(--df-transition-easing); }
.df-button-primary, .formBtn { background-color: var(--df-color-accent); box-shadow: 6px 6px 0 var(--df-color-coral, var(--df-color-primary-hover)); color: var(--df-color-primary); }
.df-button-secondary, .df-button-on-light { background-color: var(--df-color-surface); box-shadow: 4px 4px 0 var(--df-color-accent); color: var(--df-color-primary); }
.df-button-primary:hover, .df-button-primary:focus-visible, .formBtn:hover, .formBtn:focus-visible { background-color: var(--df-color-accent-hover); box-shadow: 2px 2px 0 var(--df-color-coral, var(--df-color-primary-hover)); color: var(--df-color-primary); text-decoration-line: none; transform: translate(2px, 2px); }
.df-button-secondary:hover, .df-button-secondary:focus-visible, .df-button-on-light:hover, .df-button-on-light:focus-visible { background-color: var(--df-color-accent); box-shadow: 2px 2px 0 var(--df-color-accent); color: var(--df-color-primary); text-decoration-line: none; transform: translate(2px, 2px); }
.df-button-primary:active, .formBtn:active { box-shadow: 0 0 0 var(--df-color-coral, var(--df-color-primary-hover)); transform: translate(4px, 4px); }
.df-button-secondary:active, .df-button-on-light:active { box-shadow: 0 0 0 var(--df-color-accent); transform: translate(4px, 4px); }
.df-button:focus-visible, .formBtn:focus-visible, .df-header a:focus-visible, .df-footer a:focus-visible { outline-width: 3px; outline-style: solid; outline-color: var(--df-color-accent); outline-offset: 3px; }
.df-section-lead { margin: 20px 0 0; color: var(--df-color-muted); }
.df-skip-link{position:absolute;top:-64px;left:16px;z-index:100;padding:8px 14px;background:var(--df-color-surface);color:var(--df-color-primary);font-weight:800;text-decoration-line:none}.df-skip-link:focus{top:16px}

.about-page .df-section-heading,.works-page .df-section-heading,.flow-page .df-section-heading,.contact-copy .df-section-heading,.contact-form-area>h2,.contact-info h2{position:relative;z-index:0;display:block;width:fit-content;max-width:100%}
.about-page .df-section-heading::after,.works-page .df-section-heading::after,.flow-page .df-section-heading::after,.contact-copy .df-section-heading::after,.contact-form-area>h2::after,.contact-info h2::after{position:absolute;z-index:-1;height:.4em;content:""}

.about-message .df-section-heading::after{top:.28em;left:-.1em;width:62%;background:var(--df-color-accent);transform:rotate(.8deg)}
.about-partners .df-section-heading::after{right:-.1em;bottom:.1em;width:84%;background:var(--df-color-coral);transform:rotate(-.6deg)}
.about-company .df-section-heading::after{top:.5em;right:-.1em;width:48%;background:var(--df-color-accent);transform:rotate(.9deg)}
.about-contact .df-section-heading::after{right:3%;bottom:.13em;width:78%;background:var(--df-color-coral);transform:rotate(.6deg)}

.works-page>.df-section .lower-heading .df-section-heading::after{right:-.1em;bottom:.1em;width:86%;background:var(--df-color-coral);transform:rotate(.7deg)}
.works-contact .df-section-heading::after{top:.3em;left:-.1em;width:64%;background:var(--df-color-coral);transform:rotate(-.7deg)}
.works-contact .df-section-heading::before{position:absolute;z-index:-1;right:5%;bottom:.08em;width:24%;height:.18em;background:var(--df-color-accent);content:"";transform:rotate(.8deg)}

.flow-process .df-section-heading::after{top:.28em;left:-.1em;width:58%;background:var(--df-color-accent);transform:rotate(-.8deg)}
.flow-conditions .df-section-heading::after{right:4%;bottom:.12em;width:80%;background:var(--df-color-coral);transform:rotate(.7deg)}
.flow-faq .df-section-heading::after{top:.48em;right:-.1em;width:44%;background:var(--df-color-accent);transform:rotate(-.7deg)}
.flow-prepare .df-section-heading::after{left:2%;bottom:.1em;width:72%;background:var(--df-color-coral);transform:rotate(.6deg)}

.contact-form-area>h2::after{top:.24em;left:-.1em;width:58%;background:var(--df-color-accent);transform:rotate(-.8deg)}
.contact-info h2::after{right:-.1em;bottom:.12em;width:82%;background:var(--df-color-coral);transform:rotate(.6deg)}
.contact-copy .df-section-heading::after{top:.26em;left:-.1em;width:56%;background:var(--df-color-accent);transform:rotate(-.7deg)}

/* 第3回打ち合わせ: CTAの輪郭と影を全ページで統一 */
.df-button,.formBtn{border-radius:12px}
.df-button-primary,.formBtn{box-shadow:3px 3px 0 var(--df-color-primary-hover)}
.df-button-secondary,.df-button-on-light{box-shadow:3px 3px 0 var(--df-color-accent)}
.df-button-primary:hover,.df-button-primary:focus-visible,.formBtn:hover,.formBtn:focus-visible{box-shadow:1px 1px 0 var(--df-color-primary-hover);transform:translate(1px,1px)}
.df-button-secondary:hover,.df-button-secondary:focus-visible,.df-button-on-light:hover,.df-button-on-light:focus-visible{box-shadow:1px 1px 0 var(--df-color-accent);transform:translate(1px,1px)}
.df-button-primary:active,.formBtn:active,.df-button-secondary:active,.df-button-on-light:active{box-shadow:0 0 0 transparent;transform:translate(3px,3px)}
.contact-guide .df-section-heading{position:relative;z-index:0;display:inline-block;width:fit-content;max-width:100%}
.contact-guide .df-section-heading::after{position:absolute;z-index:-1;right:-.1em;bottom:.1em;width:64%;height:.4em;background:var(--df-color-accent);content:"";transform:rotate(.6deg)}