*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
:root{
    --bg:#FFFFFF;--bg-off:#F6F6F6;--bg-dark:#111111;
    --text:#111111;--text-inv:#FFFFFF;
    --red:#CC0000;--red-dark:#8B0000;
    --gray:#777777;--border:#DDDDDD;--yellow:#FFE600;
    --serif:"Noto Serif JP",serif;--sans:"Noto Sans JP",sans-serif;
}
body{font-family:var(--sans);color:var(--text);background:var(--bg);line-height:1.7;overflow-x:hidden}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}

/* === HEADER === */
.header{
    height:56px;background:var(--bg);position:fixed;top:0;width:100%;
    z-index:2000;border-bottom:2px solid var(--text);
    display:flex;align-items:center;justify-content:flex-end;padding:0 20px;
}
.menu-btn{width:44px;height:44px;background:none;border:none;cursor:pointer}
.menu-line{display:block;width:26px;height:2px;background:var(--text);margin:6px auto;transition:.3s;border-radius:2px}
.menu-btn.active .menu-line:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu-btn.active .menu-line:nth-child(2){opacity:0}
.menu-btn.active .menu-line:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* === NAV === */
.nav-overlay{
    position:fixed;inset:0;background:var(--bg);z-index:1500;
    display:flex;align-items:center;justify-content:center;
    transform:translateY(-100%);transition:.4s cubic-bezier(.4,0,.2,1);
}
.nav-overlay.active{transform:translateY(0)}
.nav-close{
    position:absolute;top:16px;right:20px;
    width:44px;height:44px;background:none;border:2px solid var(--text);
    border-radius:50%;cursor:pointer;font-size:20px;font-weight:900;
    display:flex;align-items:center;justify-content:center;
    color:var(--text);line-height:1;
    -webkit-tap-highlight-color:transparent;
}
.nav-close:active{background:var(--bg-off)}
.nav-link{display:block;color:var(--text);font-size:20px;font-weight:700;margin:20px 0;text-align:center;letter-spacing:2px}
.nav-cta{color:var(--red)!important;font-weight:900}

/* === LAYOUT === */
.wrap{max-width:480px;margin:0 auto;padding:0 20px}
.text-center{text-align:center}

/* ============================================================
   FV — 縦書き3列
============================================================ */
.fv{
    height:100svh;min-height:600px;padding-top:56px;
    background:var(--bg);display:flex;align-items:center;justify-content:center;
    position:relative;overflow:hidden;
}
.fv::before{
    content:"";position:absolute;inset:0;
    background-image:linear-gradient(rgba(0,0,0,.035) 1px,transparent 1px),
                     linear-gradient(90deg,rgba(0,0,0,.035) 1px,transparent 1px);
    background-size:36px 36px;pointer-events:none;
}
.fv-inner{
    position:relative;z-index:1;width:100%;
    display:flex;flex-direction:column;align-items:center;gap:44px;padding:0 24px;
}
.fv-vblock{
    writing-mode:vertical-rl;text-orientation:mixed;
    font-family:var(--serif);font-weight:900;
    letter-spacing:.14em;
    max-height:calc(100svh - 56px - 88px);
    overflow:hidden;
    line-height:1.8;
    font-size:clamp(28px,6.5vw,52px);
    color:var(--text);
}
.tcursor{display:inline;animation:cur .65s step-end infinite}
@keyframes cur{0%,100%{opacity:1}50%{opacity:0}}

.fv-sub{opacity:0;transform:translateY(14px);transition:opacity .9s,transform .9s;text-align:center}
.fv-sub.show{opacity:1;transform:translateY(0)}
.fv-sub-lead{font-size:clamp(13px,3.5vw,15px);font-weight:700;color:var(--gray);line-height:1.9;margin-bottom:20px}
.fv-sub-lead em{font-style:normal;color:var(--red);font-weight:900}
.fv-btn{
    display:inline-block;background:var(--red);color:#fff;
    font-weight:900;font-size:clamp(15px,4vw,18px);
    padding:16px 40px;border-radius:4px;
    box-shadow:0 6px 0 var(--red-dark);transition:.15s;letter-spacing:1px;
}
.fv-btn:active{transform:translateY(4px);box-shadow:0 2px 0 var(--red-dark)}

/* ============================================================
   WORRY CARDS
============================================================ */
.worry-sec{padding:72px 0;background:var(--bg-off)}
.worry-heading{
    font-family:var(--serif);font-size:clamp(19px,5vw,24px);font-weight:900;
    text-align:center;line-height:1.65;margin-bottom:44px;padding:0 20px;
}
.worry-heading .red{color:var(--red)}
.worry-cards{display:flex;flex-direction:column;gap:18px;padding:0 20px;max-width:480px;margin:0 auto}
.worry-card{
    background:var(--bg-dark);border-radius:18px;padding:24px 20px;
    box-shadow:0 8px 32px rgba(0,0,0,.22);
    display:flex;align-items:flex-start;gap:14px;
    opacity:0;transform:translateY(36px) scale(.97);
    transition:opacity .6s,transform .6s,box-shadow .3s;
}
.worry-card.show{opacity:1;transform:translateY(0) scale(1)}
.worry-card:nth-child(1){transition-delay:.0s}
.worry-card:nth-child(2){transition-delay:.13s}
.worry-card:nth-child(3){transition-delay:.26s}
.worry-num{
    flex-shrink:0;width:42px;height:42px;border-radius:50%;
    background:var(--red);color:#fff;font-weight:900;font-size:17px;
    display:flex;align-items:center;justify-content:center;font-family:var(--serif);
}
.wcard-title{font-size:clamp(14px,3.8vw,16px);font-weight:900;color:#fff;line-height:1.55;margin-bottom:4px}
.wcard-desc{font-size:13px;color:#aaa;font-weight:500;line-height:1.75}

/* ============================================================
   MISSION SECTION
============================================================ */
.mission-sec{padding:72px 0;background:var(--bg);overflow:hidden}
.mission-heading{
    font-family:var(--serif);font-size:clamp(19px,5.5vw,26px);font-weight:900;
    text-align:center;line-height:1.65;margin-bottom:6px;padding:0 20px;
}
.mission-sub{text-align:center;font-size:13px;color:var(--gray);font-weight:700;margin-bottom:44px;padding:0 20px}

.mission-boxes{display:flex;flex-direction:column;max-width:480px;margin:0 auto;padding:0 20px;gap:0}

.mbox{
    padding:22px 20px;border-radius:12px;
    display:flex;align-items:center;gap:16px;
    opacity:0;transform:translateX(-28px);
    transition:opacity .6s,transform .6s;
    position:relative;
}
.mbox.show{opacity:1;transform:translateX(0)}
.mbox:nth-child(1){transition-delay:.0s}
.mbox:nth-child(3){transition-delay:.2s}

.mbox.struggle{
    background:#f8f8f8;
    border:2px solid #ccc;
    box-shadow:0 6px 0 #aaa, 0 8px 16px rgba(0,0,0,.12);
}
.mbox.focus-box{
    background:#f0fff4;
    border:2px solid #4caf7a;
    box-shadow:0 6px 0 #2e7d52, 0 8px 20px rgba(76,175,122,.2);
}

.mconn{
    display:flex;align-items:center;justify-content:center;
    padding:10px 0;gap:0;
    opacity:0;transition:opacity .4s .45s;
}
.mconn.show{opacity:1}
.mconn-plus{
    width:52px;height:52px;border-radius:50%;
    background:var(--text);color:#fff;
    font-size:30px;font-weight:900;line-height:1;
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 4px 0 #555, 0 6px 12px rgba(0,0,0,.2);
    font-family:var(--sans);
}

.micon{
    flex-shrink:0;width:52px;height:52px;border-radius:14px;
    display:flex;align-items:center;justify-content:center;font-size:26px;
}
.micon.s{background:#ffe0e0}
.micon.f{background:#c8f5db}

.mbox.struggle .micon{animation:wobble 2.5s ease-in-out infinite}
@keyframes wobble{0%,100%{transform:rotate(0)}25%{transform:rotate(-7deg) scale(1.07)}50%{transform:rotate(5deg)}75%{transform:rotate(-2deg)}}

.mlabel{font-size:clamp(16px,4.5vw,20px);font-weight:900;color:var(--text);line-height:1.4}
.mtag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:1px;padding:3px 9px;border-radius:3px;margin-bottom:4px}
.mtag.hard{background:#ffe0e0;color:var(--red)}
.mtag.focus{background:#c8f5db;color:#1a6e40}

.mission-resolve{
    max-width:480px;margin:0 auto;padding:0 20px;
    opacity:0;transform:translateY(18px);
    transition:opacity .7s .5s,transform .7s .5s;
}
.mission-resolve.show{opacity:1;transform:translateY(0)}

.resolve-bridge{
    display:flex;flex-direction:column;align-items:center;padding:0;
}
.resolve-bridge-line{
    width:3px;height:28px;
    background:linear-gradient(to bottom,#4caf7a,var(--red));
}
.resolve-bridge-label{
    font-size:11px;font-weight:900;color:var(--text-inv);
    background:var(--red);padding:4px 14px;border-radius:2px;
    letter-spacing:1px;white-space:nowrap;
}

.resolve-box{
    border:3px solid var(--red);border-radius:12px;
    padding:28px 22px;position:relative;
    background:linear-gradient(145deg,#fff 0%,#fff5f5 100%);
    box-shadow:0 8px 0 var(--red-dark), 0 12px 32px rgba(204,0,0,.18);
    margin-top:0;
}
.resolve-headline{
    font-family:var(--serif);
    font-size:clamp(20px,5.5vw,26px);
    font-weight:900;line-height:1.5;
    color:var(--text);
    margin-bottom:16px;
    border-bottom:2px solid #f5cece;
    padding-bottom:14px;
}
.resolve-headline .red{color:var(--red)}
.resolve-benefits{
    list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:20px;
}
.resolve-benefits li{
    display:flex;align-items:center;gap:10px;
    font-size:clamp(14px,3.8vw,16px);font-weight:900;color:var(--text);
}
.rb-icon{
    flex-shrink:0;width:32px;height:32px;border-radius:50%;
    background:var(--red);color:#fff;
    display:flex;align-items:center;justify-content:center;font-size:16px;
}
.resolve-cta{
    display:block;width:100%;padding:18px;
    background:var(--red);color:#fff;
    font-weight:900;font-size:clamp(15px,4.5vw,17px);
    border-radius:6px;text-align:center;
    box-shadow:0 6px 0 var(--red-dark);
    transition:.15s;letter-spacing:1px;
    -webkit-tap-highlight-color:transparent;
}
.resolve-cta:active{transform:translateY(4px);box-shadow:0 2px 0 var(--red-dark)}

/* ============================================================
   SECTION TITLE
============================================================ */
.sec-wrap{padding:72px 0}
.bg-dark{background:var(--bg-dark);color:var(--text-inv)}
.bg-off{background:var(--bg-off);color:var(--text)}
.bg-white{background:var(--bg);color:var(--text)}

.stitle-row{
    display:flex;align-items:flex-start;gap:14px;margin-bottom:40px;
    max-width:480px;margin-left:auto;margin-right:auto;padding:0 20px;
}
.stitle-vert{
    writing-mode:vertical-rl;text-orientation:mixed;
    font-size:9px;font-weight:900;letter-spacing:3px;
    color:var(--red);text-transform:uppercase;white-space:nowrap;
    margin-top:4px;flex-shrink:0;
}
.stitle-main{font-family:var(--serif);font-size:clamp(22px,6vw,30px);font-weight:900;line-height:1.35}
.stitle-sub{display:block;font-size:12px;font-family:var(--sans);color:var(--gray);font-weight:500;margin-top:5px;letter-spacing:2px}
.bg-dark .stitle-main{color:var(--text-inv)}
.bg-dark .stitle-sub{color:#888}

/* ============================================================
   SERVICE
============================================================ */
.service-photo{max-width:480px;margin:0 auto 28px;padding:0 20px}
.service-photo img{width:100%;border-radius:4px;border:2px solid #333;aspect-ratio:4/3;object-fit:cover}
.service-body{max-width:480px;margin:0 auto;padding:0 20px}
.service-msg{font-family:var(--serif);font-size:clamp(18px,5vw,22px);font-weight:900;line-height:1.7;margin-bottom:20px;color:var(--text-inv)}
.service-note{padding:18px;border-left:5px solid var(--red);background:rgba(255,255,255,.05);border-radius:2px}
.service-note p{font-size:14px;font-weight:700;color:#ccc;font-style:italic;line-height:1.8}

/* MID CTA */
.mid-cta{padding:60px 20px;background:var(--bg-off);text-align:center;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.mid-cta-lead{font-family:var(--serif);font-size:clamp(17px,4.5vw,22px);font-weight:900;line-height:1.85;margin-bottom:24px}
.btn-cta{
    display:inline-block;background:var(--red);color:#fff;
    padding:18px 44px;font-size:clamp(15px,4.5vw,18px);font-weight:900;
    border-radius:4px;box-shadow:0 7px 0 var(--red-dark);transition:.15s;letter-spacing:1px;
}
.btn-cta:active{transform:translateY(5px);box-shadow:0 2px 0 var(--red-dark)}

/* ============================================================
   FLOW
============================================================ */
.flow-list{max-width:480px;margin:0 auto;padding:0 20px;display:flex;flex-direction:column}
.flow-item{display:flex;gap:18px;align-items:flex-start;padding-bottom:28px;position:relative}
.flow-item:not(:last-child)::after{content:"";position:absolute;left:18px;top:40px;bottom:0;width:2px;background:var(--red);opacity:.25}
.flow-num{flex-shrink:0;width:38px;height:38px;border-radius:50%;background:var(--red);color:#fff;font-weight:900;font-size:12px;display:flex;align-items:center;justify-content:center;margin-top:2px}
.flow-title{font-size:clamp(14px,4vw,16px);font-weight:900;color:var(--text-inv);margin-bottom:4px;line-height:1.5}
.flow-desc{font-size:13px;color:#aaa;line-height:1.85;font-weight:500}

/* ASSURANCE */
.assurance-photo{max-width:480px;margin:0 auto 24px;padding:0 20px}
.assurance-photo img{width:100%;border-radius:8px;border:2px solid var(--border);aspect-ratio:4/3;object-fit:cover;box-shadow:0 6px 20px rgba(0,0,0,.1)}
.assurance-body{max-width:480px;margin:0 auto;padding:0 20px}
.assurance-title{font-family:var(--serif);font-size:clamp(20px,5.5vw,26px);font-weight:900;margin-bottom:14px;padding-bottom:10px;border-bottom:3px solid var(--red)}
.assurance-text{font-size:clamp(14px,3.5vw,15px);font-weight:700;line-height:1.95;color:#444}

/* ============================================================
   FAQ
============================================================ */
.faq-list{max-width:480px;margin:0 auto;padding:0 20px;display:flex;flex-direction:column;gap:12px}
.faq-item{padding:18px;background:#1a1a1a;border:1px solid #333;border-radius:4px}
.faq-q{font-weight:900;color:var(--red);font-size:13px;margin-bottom:7px;line-height:1.65}
.faq-a{font-size:13px;color:#ccc;line-height:1.9;font-weight:500}
.faq-highlight{background:var(--yellow)!important;border:2px solid #d4a000!important}
.faq-highlight .faq-q{color:#8B0000}
.faq-highlight .faq-a{color:#111}
.text-red{color:var(--red)!important}

/* ============================================================
   FORM
============================================================ */
.form-card{
    max-width:480px;margin:0 20px;padding:32px 20px;
    background:var(--bg);border:2px solid var(--text);border-radius:4px;
    box-shadow:6px 6px 0 var(--text);
}
@media(min-width:520px){.form-card{margin:0 auto}}
.form-header{font-family:var(--serif);font-size:clamp(17px,5vw,21px);font-weight:900;text-align:center;margin-bottom:5px;line-height:1.45}
.form-lead{text-align:center;color:var(--gray);font-size:12px;font-weight:700}
.form-excl{
    margin:20px 0;padding:16px;background:#FFFF00;
    border:2px solid var(--red);border-radius:4px;
    display:flex;align-items:flex-start;gap:10px;
}
.excl-icon{flex-shrink:0;width:22px;height:22px;color:var(--red);margin-top:2px}
.excl-text{color:#333;font-size:13px;font-weight:700;line-height:1.75;margin:0}
.excl-text .excl-label{color:var(--red);font-size:15px;font-weight:900;display:block;margin-bottom:4px}
.form-group{margin-bottom:16px;text-align:left}
.form-group label{display:block;font-weight:900;font-size:12px;margin-bottom:5px;letter-spacing:1px}
.form-group input,.form-group select{
    width:100%;padding:13px 15px;border:2px solid var(--border);border-radius:4px;
    font-size:16px;font-family:var(--sans);transition:border-color .2s;
    background:var(--bg);color:var(--text);-webkit-appearance:none;appearance:none;
}
.form-group select{height:50px}
.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--text)}
.form-agree{margin-bottom:18px;font-size:12px;color:var(--gray);font-weight:700}
.form-agree a{color:var(--red)}
.form-agree label{display:flex;align-items:center;gap:8px;cursor:pointer;line-height:1.5}
.form-agree input[type=checkbox]{flex-shrink:0;width:18px;height:18px;accent-color:var(--red)}
.btn-submit{
    width:100%;padding:20px;background:var(--red);color:#fff;border:none;border-radius:4px;
    font-size:clamp(15px,4.5vw,17px);font-weight:900;cursor:pointer;transition:.15s;
    box-shadow:0 7px 0 var(--red-dark);font-family:var(--sans);letter-spacing:1px;
    -webkit-tap-highlight-color:transparent;
}
.btn-submit:active{transform:translateY(5px);box-shadow:0 2px 0 var(--red-dark)}
.btn-submit:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}

/* FOOTER */
.footer{background:var(--bg-dark);color:var(--text-inv);padding:56px 20px;text-align:center;border-top:2px solid #333}
.footer-office{font-weight:700;font-size:13px;margin-bottom:4px}
.footer-address{color:#888;font-size:12px;margin-bottom:22px;line-height:1.75}
.footer-links{margin-bottom:18px;display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px}
.footer-links a{color:#888;font-size:12px}
.copyright{color:#555;font-size:11px}

/* FLOATING CTA */
.floating-cta{
    position:fixed;bottom:16px;right:16px;width:70px;height:70px;
    background:var(--red);border:3px solid #fff;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    z-index:1000;animation:fbounce 2s ease-in-out infinite;
    box-shadow:0 6px 20px rgba(204,0,0,.4);-webkit-tap-highlight-color:transparent;
}
.floating-text{color:#fff;font-weight:900;font-size:12px;text-align:center;line-height:1.3}
@keyframes fbounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* REVEAL */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .6s,transform .6s}
.reveal.show{opacity:1;transform:translateY(0)}