:root { --or:#F05A1A; --or2:#FF7A3D; --or-pale:#FFF1EA; --or-dk:#C04410; --ye:#F5C400; --ye2:#FFD84D; --gr:#1A9E5C; --gr2:#22C972; --nv:#1A2F5E; --nv2:#0F1E3C; --pu:#4A1C8E; --bl:#1565C0; --bl2:#2196F3; --sky:#E8F4FF; --cr:#FFFCF8; --ww:#FFF8F2; --g1:#F6F5F1; --g2:#E2E0DC; --g4:#9E9C96; --g6:#5C5A56; --td:#1A1A1A; --tm:#3A3A3A; --tl:#666; --rb:50px; --fs:'Noto Serif JP',serif; --fn:'Noto Sans JP',sans-serif; }
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { font-family:var(--fn); background:var(--cr); color:var(--td); line-height:1.75; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
/* インラインCSSをクラス化したもの */
.block { display:block; }
.mb-8 { margin-bottom:8px; }
.text-sm { font-size:0.9em; }
.text-or { color:var(--or); }
.text-gray { color:#999; }
.border-top-or { border-top:1px solid rgba(255,102,0,0.2); }
.pt-16 { padding-top:16px; }
.mt-16 { margin-top:16px; }
.alert-pink-gradient { margin-top:20px; padding:18px; background:linear-gradient(135deg, #ffe6f0 0%, #fff0f5 100%); border-left:4px solid #e84a88; border-radius:6px;}
.alert-text { margin:0; font-size:15px; font-weight:700; color:#333; }
.text-xl-white { font-size:1.2rem; color:#fff; }
.link-or { color:var(--or); }
.resize-v { resize:vertical; }
.min-w-260 { min-width:260px; }
.mt-28 { margin-top:28px; }
.hidden { display:none; }
.text-center { text-align:center; }
.ws-pre-wrap { white-space:pre-wrap; }
.supervisor-section { background:linear-gradient(135deg, #f5f9ff 0%, #ffffff 100%); padding:60px 20px; }
.sv-max-w { max-width:900px; }
.sv-card { background:#fff; box-shadow:0 8px 24px rgba(0,0,0,0.08); border-radius:12px; padding:40px; border-left:5px solid var(--or); }
.sv-header { margin-bottom:30px; border-bottom:2px solid #f0f0f0; padding-bottom:30px; }
.sv-header-top { display:flex; align-items:center; gap:20px; margin-bottom:20px; }
.sv-av { background:linear-gradient(135deg, var(--or) 0%, var(--ye) 100%); width:60px; height:60px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:2rem; flex-shrink:0; }
.sv-name { font-size:1.6rem; font-weight:700; color:var(--nv); margin:0 0 5px 0; }
.sv-title { font-size:0.95rem; color:#666; margin:0; line-height:1.6; }
.sv-eyebrow { font-size:0.85rem; font-weight:700; color:var(--or); letter-spacing:2px; margin:0; }
.sv-body { }
.sv-headline { font-size:1.6rem; font-weight:700; line-height:1.6; color:var(--nv); margin:0 0 25px 0; }
.gradient-or-ye { background:linear-gradient(120deg, var(--or), var(--ye)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.text-nv { color:var(--nv); }
.sv-profile { margin-bottom:25px; }
.sv-profile p { font-size:0.95rem; line-height:1.8; color:#444; margin:0 0 15px 0; }
.sv-tag-row { display:flex; flex-wrap:wrap; gap:10px; }
.sv-tag-or { background:linear-gradient(135deg, var(--or), var(--ye)); color:#fff; padding:8px 16px; border-radius:20px; font-size:0.85rem; font-weight:600; }
.sv-tag-bl { background:linear-gradient(135deg, var(--bl), #1e40af); color:#fff; padding:8px 16px; border-radius:20px; font-size:0.85rem; font-weight:600; }
.sv-tag-gr { background:linear-gradient(135deg, var(--gr), #059669); color:#fff; padding:8px 16px; border-radius:20px; font-size:0.85rem; font-weight:600; }
.ft-grid { grid-template-columns:1fr auto; display:grid; }
.text-yellow { color:var(--ye2)!important; }
.text-orange { color:var(--or)!important; }
.text-green { color:var(--gr)!important; }
.text-blue { color:var(--bl2)!important; }
#nav { position:fixed; top:0; left:0; right:0; z-index:1000; height:64px; display:flex; align-items:center; justify-content:space-between; padding:0 24px; background:linear-gradient(90deg,#C04410 0%,#E8601C 50%,#F07820 100%); backdrop-filter:blur(12px); border-bottom:3px solid var(--ye); }
.nav-logo { font-family:var(--fs); color:#fff; font-size:15px; font-weight:700; display:flex; align-items:center; gap:8px; }
.nav-logo-service { font-family:'Google Sans Flex',sans-serif; font-weight:500; font-stretch:100%; font-size:21px; color:#fff; letter-spacing:.06em; }
.nav-badge { background:rgba(255,255,255,.25); color:#fff; font-size:10px; font-weight:700; padding:2px 8px; border-radius:4px; border:1px solid rgba(255,255,255,.4); }
.nav-links { display:flex; gap:6px; align-items:center; }
.nav-links a { color:rgba(255,255,255,.9); font-size:12px; padding:6px 10px; border-radius:var(--rb); transition:.2s; white-space:nowrap; }
.nav-links a:hover, .nav-links a.demo-hl { color:#fff; background:rgba(255,255,255,.18); }
.nav-links a.demo-hl { background:rgba(255,255,255,.22); color:#fff; font-weight:700; }
.nav-faq { border:1.5px solid rgba(255,255,255,.6)!important; color:#fff!important; font-weight:700!important; padding:6px 14px!important; line-height:1.2!important; border-radius:var(--rb)!important; font-size:12px!important; }
.nav-faq:hover { background:rgba(255,255,255,.18)!important; border-color:#fff!important; }
.nav-cta { background:var(--ye)!important; color:var(--nv2)!important; font-weight:700!important; padding:8px 20px!important; border-radius:var(--rb)!important; border:none!important; box-shadow:0 2px 10px rgba(245,196,0,.4)!important; }
.nav-cta:hover { background:var(--ye2)!important; color:var(--nv2)!important; box-shadow:0 4px 16px rgba(245,196,0,.55)!important; transform:translateY(-1px); }
.hb { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px; }
.hb span { display:block; width:24px; height:2px; background:#fff; border-radius:2px; transition:.3s; }
.mmenu { display:none; position:fixed; top:64px; left:0; right:0; background:linear-gradient(180deg,#C04410,#B03A0C); z-index:999; border-bottom:2px solid var(--ye); padding:8px 0 16px; }
.mmenu.open { display:block; }
.mmenu a { display:block; color:rgba(255,255,255,.9); padding:14px 28px; font-size:15px; border-bottom:1px solid rgba(255,255,255,.12); }
.mm-cta { background:rgba(255,255,255,.15)!important; margin:12px 20px 0!important; padding:14px!important; text-align:center; border-radius:var(--rb); font-weight:700; color:#fff!important; border-bottom:none!important; }
.mm-demo { color:var(--ye2)!important; font-weight:700; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius:var(--rb); font-family:var(--fn); font-weight:700; cursor:pointer; transition:all .22s; border:2px solid transparent; text-decoration:none; white-space:nowrap; }
.btn-xl { padding:18px 48px; font-size:19px; }
.btn-lg { padding:15px 36px; font-size:17px; }
.btn-md { padding:12px 28px; font-size:15px; }
.btn-sm { padding:9px 20px; font-size:13px; }
.btn-or { background:var(--or); color:#fff; border-color:var(--or); }
.btn-or:hover { background:var(--or-dk); transform:translateY(-2px); box-shadow:0 8px 28px rgba(240,90,26,.38); }
.btn-ye { background:var(--ye); color:var(--nv2); border-color:var(--ye); }
.btn-ye:hover { background:var(--ye2); transform:translateY(-2px); }
.btn-bl { background:var(--bl2); color:#fff; border-color:var(--bl2); }
.btn-bl:hover { background:var(--bl); transform:translateY(-2px); }
.btn-gr { background:var(--gr); color:#fff; border-color:var(--gr); }
.btn-gr:hover { background:var(--gr2); transform:translateY(-2px); }
.btn-gy { background:var(--g2); color:var(--g6); border-color:var(--g2); }
.btn-ow { background:transparent; color:#fff; border-color:rgba(255,255,255,.6); }
.btn-ow:hover { background:rgba(255,255,255,.12); }
.btn-nv { background:var(--nv); color:#fff; border-color:var(--nv); }
.btn-nv:hover { background:var(--nv2); }
.sec { padding:84px 24px; overflow:hidden; }
.sec-in { max-width:1080px; margin:0 auto; padding:0 12px; }
.eyebrow { display:inline-flex; align-items:center; gap:8px; font-size:18px; font-weight:700; letter-spacing:.12em; color:var(--or); margin-bottom:14px; }
.eyebrow::before { content:''; display:block; width:22px; height:3px; background:var(--or); border-radius:2px; }
.eyebrow.c { display:flex; justify-content:center; width:fit-content; margin-left:auto; margin-right:auto; }
.eyebrow.wh { color:var(--ye2); }
.eyebrow.wh::before { background:var(--ye2); }
.sec-ttl { font-family:var(--fs); font-size:clamp(24px,4vw,38px); font-weight:700; color:#000; line-height:1.35; }
.sec-ttl.c { text-align:center; }
.sec-ttl.wh { color:#fff; }
.sec-sub { font-size:18px; color:var(--tl); margin-top:12px; line-height:1.85; }
.sec-sub.c { text-align:center; }
.sec-sub.wh { color:rgba(255,255,255,.7); }
#hero { min-height:85vh; display:flex; align-items:center; position:relative; overflow:hidden; background:#1A2F5E; }
.hero-photo { position:absolute; inset:0; background-image:url('../img/hero-bg.jpg'); background-size:cover; background-position:center 40%; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(135deg,rgba(100,28,0,.78) 0%,rgba(60,10,0,.60) 60%,rgba(15,0,0,.45) 100%); }
.hero-stripe { position:absolute; bottom:0; left:0; right:0; height:6px; background:linear-gradient(90deg,var(--or),var(--ye),var(--gr),var(--bl2)); }
.hero-in { max-width:960px; width:100%; margin:0 auto; padding:100px 24px; display:flex; flex-direction:column; align-items:center; text-align:center; position:relative; z-index:2; }
.hero-tag { display:inline-flex; align-items:center; gap:8px; background:rgba(245,196,0,.15); border:1.5px solid rgba(245,196,0,.35); border-radius:var(--rb); padding:6px 18px; color:var(--ye2); font-size:13px; font-weight:700; letter-spacing:.1em; margin-bottom:24px; }
.hero-tag .new { background:var(--or); color:#fff; font-size:11px; padding:3px 9px; border-radius:4px; }
.hero-h1 { font-family:var(--fs); font-weight:700; line-height:1; margin-bottom:24px; }
.h1-line1 { display:block; font-size:clamp(18px,2.5vw,34px); color:rgba(255,255,255,.95); text-shadow:0 2px 12px rgba(0,0,0,.5); line-height:1.4; margin-bottom:12px; white-space:normal; }
.h1-line2 { display:inline-block; max-width:90vw; font-size:clamp(48px,8vw,100px); color:#fff; text-shadow:0 4px 24px rgba(0,0,0,.5); line-height:1.25; letter-spacing:-.02em; font-family:'Google Sans Flex',sans-serif; font-weight:700; font-stretch:100%; position:relative; z-index:1; word-break:break-word; overflow-wrap:break-word; }
.h1-line2-small { font-size:0.72em; line-height:1.05; }
.h1-l2a, .h1-l2b, .h1-l2c { display:block; }
.h1-l2a { font-size:0.65em; line-height:1.2; }
.h1-l2b { font-size:0.5em; line-height:1.2; margin-bottom: 20px;}
.h1-l2c { font-size:1em; line-height:1.2; }
/* Gwebs Intro Section Unified Styling */
 .intro-heading { text-align:center; font-size:clamp(20px,3vw,28px); margin-bottom:28px; border-bottom:3px solid var(--or); padding-bottom:14px; display:inline-block; width:100%; color:var(--nv2); font-weight:700; font-family:var(--fs); }
 .intro-grid-2col { display:grid; grid-template-columns:1fr 1fr; gap:32px; margin-top:24px; text-align:left; align-items:center; }
 .intro-grid-2col-image { width:100%; height:auto; border-radius:10px; box-shadow:0 8px 24px rgba(0,0,0,0.12); }
 .intro-text { font-size:16px; line-height:1.8; color:var(--tm); }
 .intro-text strong { color:var(--nv); font-weight:700; }
 .intro-highlight { background:#f9f9f9; padding:10px; border-radius:10px; border-left:4px solid var(--bl2); }
.intro-list { margin:0; padding-left:20px; }
 .intro-list li { margin-bottom:12px; font-size:16px; line-height:1.7; color:var(--tm); }
 .intro-divider-note { text-align:center; margin-top:24px; padding:14px; background:#fffbf0; border-left:4px solid var(--ye); font-size:14px; color:var(--nv2); border-radius:6px;}
 .intro-grid-3col { display:grid; grid-template-columns:1fr 1fr 1fr; gap:20px; margin-top:24px; }
 .intro-card { background:#fff; padding:28px; border:1px solid var(--g2); border-radius:10px; box-shadow:0 4px 12px rgba(0,0,0,0.06); }
 .intro-card-icon { width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:24px; margin-bottom:16px; }
 .intro-card h4 { font-size:16px; font-weight:700; margin-bottom:12px; color:var(--nv2); font-family:var(--fs); }
 .intro-card p { font-size:16px; line-height:1.7; color:var(--tm); }
 .intro-feature-1 .intro-card-icon { background:linear-gradient(135deg, var(--bl2) 0%, var(--bl) 100%); color:#fff; }
 .intro-feature-2 .intro-card-icon { background:linear-gradient(135deg, var(--gr) 0%, var(--gr2) 100%); color:#fff; }
 .intro-feature-3 .intro-card-icon { background:linear-gradient(135deg, var(--or) 0%, var(--or2) 100%); color:#fff; }
 .intro-grid-2col-even { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:24px; text-align:left; align-items:center; }
 .intro-grid-2col-even-image { width:100%; height:auto; border-radius:10px; box-shadow:0 8px 24px rgba(0,0,0,0.12); }
 .intro-grid-2col-even ul { list-style:none; margin:0; padding:0; }
 .intro-grid-2col-even li { list-style:none; list-style-type:none; margin:0; padding:0; }
 .intro-feature-box { padding:28px; border-radius:10px; border-left:5px solid var(--bl2); }
 .intro-feature-box.blue { background:linear-gradient(135deg, #f9f5ef 0%, #fff8f2 100%); border-left-color:var(--or); }
 .intro-feature-box.orange { background:linear-gradient(135deg, #fff4e6 0%, #fffbf0 100%); border-left-color:var(--or); }
 .intro-feature-box h4 { font-size:15px; font-weight:700; margin-bottom:14px; color:var(--nv2); }
 .intro-feature-box ul { margin:0; padding-left:0; list-style:none; }
 .intro-feature-box li { font-size:16px; padding-left:24px; position:relative; line-height:1.6; margin-bottom:10px; color:var(--tm); list-style:none; list-style-type:none; }
 .intro-feature-box li span { position:absolute; left:0; font-weight:700; }
 .intro-demo-section { background:linear-gradient(135deg, var(--bl2) 0%, #1976d2 100%); color:#fff; padding:36px; border-radius:12px; text-align:center; margin-bottom:48px; margin-top: 48px;}
 .intro-demo-section h3 { font-size:18px; font-weight:700; margin-bottom:18px; }
 .intro-demo-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin:20px 0; }
 .intro-demo-item { background:rgba(255,255,255,0.1); padding:20px; border-radius:8px; }
 .intro-demo-item p { font-size:16px; margin:0; line-height:1.6; }
 .intro-demo-item strong { font-size:22px; }
 .intro-notice { background:#fff3cd; border:2px solid var(--ye); border-radius:10px; padding:28px; margin-bottom: 80px;}
 .intro-notice h3 { font-size:16px; font-weight:700; margin-bottom:18px; color:#856404; text-align:center; }
 .intro-notice-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
 .intro-notice-item { padding:14px; background:#fff; border-left:4px solid var(--ye); border-radius:6px; }
 .intro-notice-item.orange { border-left-color:var(--or); }
 .intro-notice-item p { font-size:14px; margin:0; line-height:1.7; color:var(--tm); }
 .intro-notice-item p strong { color:var(--or); font-weight:700; }
.h1-line2::after { content:''; position:absolute; left:0; right:0; bottom:4px; height:4px; background:var(--or); z-index:-1; }
.gwebs-ruby { display:block; font-size:clamp(12px,1.2vw,16px); letter-spacing:.5em; color:rgba(255,255,255,.6); font-weight:400; font-family:var(--fn); margin-top:12px; text-indent:.5em; }
.hero-lead-top { margin:24px 0 12px; color:#fff; font-size:clamp(16px,1.8vw,22px); line-height:1.7; font-weight:700; text-shadow:0 1px 8px rgba(0,0,0,.5); }
.hero-lead-top .ye { color:var(--ye2); }
.hero-lead-btm { margin:0 0 32px; color:rgba(255,255,255,.9); font-size:clamp(14px,1.5vw,18px); line-height:1.8; font-weight:500; text-shadow:0 1px 6px rgba(0,0,0,.4); }
.hero-lead-btm strong { color:var(--ye2); font-weight:700; }
.hero-btns { display:flex; flex-wrap:wrap; gap:16px; margin-top:8px; justify-content:center; }
#hero-proof-band { background:var(--cr); border-bottom:1px solid var(--g2); padding:60px 24px; }
.hpb-in { max-width:1140px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:stretch; }
.hpb-split-left { display:flex; flex-direction:column; gap:20px; height:100%; }
.hpb-split-right { width:100%; height:100%; }
.hpb-supervisor-card { background:#ffffff; border:1px solid var(--g2); border-radius:12px; padding:24px; text-align:left; display:flex; flex-direction:column; gap:10px; box-shadow:0 4px 20px rgba(0,0,0,0.04); border-top:4px solid var(--or); height:100%; }
.hpb-supervisor-card p { color:var(--tm); font-size:15px; line-height:1.7; margin:0; }
.hpb-supervisor-card strong { color:var(--or-dk); font-weight:700; }
.hpb-badge { display:inline-flex; align-items:center; gap:6px; background:var(--nv2); color:#fff; font-size:11.5px; font-weight:700; padding:4px 12px; border-radius:4px; align-self:start; }
.hpb-visual-card { background:#ffffff; border-radius:16px; padding:24px; box-shadow:0 15px 40px rgba(0,0,0,0.08); text-align:left; border:1px solid var(--g2); height:100%; display:flex; flex-direction:column; }
.hpb-v-header { display:flex; align-items:center; gap:12px; margin-bottom:14px; border-bottom:1px solid var(--g2); padding-bottom:10px; }
.hpb-v-icon { width:36px; height:36px; border-radius:8px; background:var(--or-pale); display:flex; align-items:center; justify-content:center; font-size:16px; color:var(--or); flex-shrink:0; }
.hpb-v-ttl { font-family:var(--fs); font-size:14.5px; font-weight:800; color:var(--nv2); line-height:1.2; }
.hpb-v-sub { font-size:11.5px; color:var(--tl); margin-top:2px; }
.hpb-v-before { background:#F6F5F1; border-radius:6px; padding:10px 14px; font-size:12.5px; color:var(--tm); line-height:1.6; margin-bottom:10px; border-left:3px solid var(--g4); font-weight:500; }
.hpb-v-arrow { text-align:center; color:var(--or); font-size:12px; margin:8px 0; font-weight:700; display:flex; align-items:center; justify-content:center; gap:6px; }
.hpb-v-after { background:linear-gradient(135deg,#FFFBF7,#FFF2EA); border-radius:6px; padding:12px 14px; font-size:12px; color:var(--nv2); line-height:1.7; border-left:3px solid var(--or); font-weight:500; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; }
.hpb-v-footer { display:flex; align-items:center; justify-content:space-between; margin-top:12px; padding-top:10px; border-top:1px solid #F0ECE6; }
.hpb-v-tag { display:inline-flex; align-items:center; gap:4px; background:var(--gr); color:#fff; font-size:11px; font-weight:700; padding:3px 10px; border-radius:4px; }
.hero-card { background:rgba(255,255,255,.97); border-radius:16px; padding:22px; box-shadow:0 16px 48px rgba(0,0,0,.4); width:100%; }
.hc-head { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.hc-icon { width:36px; height:36px; border-radius:9px; background:var(--or-pale); display:flex; align-items:center; justify-content:center; font-size:17px; flex-shrink:0; }
.hc-ttl { font-family:var(--fs); font-size:14px; font-weight:700; color:var(--nv2); }
.hc-sub { font-size:11px; color:var(--tl); }
.hc-before { background:var(--g1); border-radius:8px; padding:10px 12px; font-size:16px; color:var(--tl); line-height:1.65; margin-bottom:8px; border-left:3px solid var(--g4); }
.hc-arrow { text-align:center; color:var(--or); font-size:14px; margin:4px 0; font-weight:700; }
.hc-after { background:linear-gradient(135deg,#FFF5EC,#FFF0E8); border-radius:8px; padding:12px; font-size:11px; color:var(--nv2); line-height:1.75; border-left:3px solid var(--or); }
.hc-badge { display:inline-flex; align-items:center; gap:5px; background:var(--or); color:#fff; font-size:10px; font-weight:700; padding:3px 10px; border-radius:var(--rb); margin-top:8px; }
.hc-chars { font-size:10px; color:var(--tl); margin-top:5px; text-align:right; }
#band { background:linear-gradient(90deg,var(--or) 0%,#F5821A 50%,var(--ye) 100%); padding:22px 24px; }
.band-in { max-width:1080px; margin:0 auto; display:flex; flex-wrap:wrap; justify-content:space-around; gap:12px; }
.band-item { text-align:center; color:#fff; }
.band-n { font-family:var(--fs); font-size:clamp(26px,4vw,38px); font-weight:700; line-height:1; color:#fff; }
.band-n sub { font-size:55%; font-weight:400; }
.band-l { font-size:14px; margin-top:4px; opacity:.9; }
#problems { background:var(--ww); }
.prob-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px; margin-top:48px; }
.prob-card { background:#fff; padding:28px 10px; border:1px solid var(--g2); border-top:4px solid var(--nv); position:relative; }
.prob-no { font-size:14px; font-weight:700; color:var(--or); letter-spacing:.14em; margin-bottom:8px; }
.prob-ttl { font-weight:700; font-size:17px; color:var(--nv2); margin-bottom:10px; }
.prob-txt { font-size:16px; color:var(--tl); line-height:1.75; }
#sol { background:linear-gradient(135deg,#B03A0C,#C04410); padding:52px 24px; text-align:center; }
.sol-ttl { font-family:var(--fs); font-size:clamp(20px,3.5vw,30px); color:#fff; font-weight:700; line-height:1.55; }
.sol-ttl em { color:var(--ye2); font-style:normal; }
#features { background:var(--cr); }
.feat-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:26px; margin-top:52px; }
.feat-card { background:#fff; border:1px solid var(--g2); padding:34px 24px; position:relative; overflow:hidden; transition:transform .25s,box-shadow .25s; }
.feat-card:hover { transform:translateY(-5px); box-shadow:0 12px 40px rgba(26,47,94,.09); }
.feat-card::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; }
.feat-card:nth-child(1)::before, .feat-card:nth-child(4)::before { background:var(--or); }
.feat-card:nth-child(2)::before, .feat-card:nth-child(5)::before { background:var(--gr); }
.feat-card:nth-child(3)::before, .feat-card:nth-child(6)::before { background:var(--bl2); }
.feat-icon { width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:26px; margin-bottom:18px; }
.feat-card:nth-child(1) .feat-icon, .feat-card:nth-child(4) .feat-icon { background:#FFF0E8; }
.feat-card:nth-child(2) .feat-icon, .feat-card:nth-child(5) .feat-icon { background:#E8FBF0; }
.feat-card:nth-child(3) .feat-icon, .feat-card:nth-child(6) .feat-icon { background:#E8F4FF; }
.feat-no { font-size:11px; font-weight:700; letter-spacing:.14em; margin-bottom:8px; }
.feat-card:nth-child(1) .feat-no, .feat-card:nth-child(4) .feat-no { color:var(--or); }
.feat-card:nth-child(2) .feat-no, .feat-card:nth-child(5) .feat-no { color:var(--gr); }
.feat-card:nth-child(3) .feat-no, .feat-card:nth-child(6) .feat-no { color:var(--bl2); }
.feat-ttl { font-family:var(--fs); font-size:18px; font-weight:700; color:var(--nv2); line-height:1.4; margin-bottom:12px; }
.feat-txt { font-size:16px; color:var(--tl); line-height:1.8; }
.feat-pill { display:inline-block; font-size:14px; font-weight:700; padding:3px 12px; border-radius:var(--rb); margin-top:14px; }
.feat-card:nth-child(1) .feat-pill, .feat-card:nth-child(4) .feat-pill { background:var(--or-pale); color:var(--or-dk); }
.feat-card:nth-child(2) .feat-pill, .feat-card:nth-child(5) .feat-pill { background:#E8FBF0; color:#0D7A40; }
.feat-card:nth-child(3) .feat-pill, .feat-card:nth-child(6) .feat-pill { background:#E8F4FF; color:var(--bl); }
#how { background:linear-gradient(135deg,#B03A0C 0%,#C04410 40%,#D05218 100%); padding:84px 24px; }
.how-in { max-width:1080px; margin:0 auto; padding:0 12px; }
.how-ttl { font-family:var(--fs); font-size:clamp(22px,4vw,34px); color:#fff; text-align:center; margin-bottom:10px; }
.how-sub { color:rgba(255,255,255,.92); text-align:center; font-size:18px; margin-bottom:52px; }
.how-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:0; position:relative; }
.how-steps::before { content:''; position:absolute; top:27px; left:12%; right:12%; height:3px; background:linear-gradient(90deg,var(--or),var(--ye),var(--gr),var(--bl2)); z-index:0; }
.how-step { text-align:center; padding:0 16px; position:relative; z-index:1; }
.step-num { width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:700; color:#fff; margin:0 auto 16px; box-shadow:0 4px 16px rgba(0,0,0,.3); }
.step-num.s1 { background:var(--or); }
.step-num.s2 { background:var(--ye); color:var(--nv2); }
.step-num.s3 { background:var(--gr); }
.step-num.s4 { background:var(--bl2); }
.step-ttl { font-weight:700; color:#fff; font-size:20px; margin-bottom:8px; }
.step-txt { font-size:16px; color:rgba(255,255,255,1); line-height:1.7; text-align: left;}
.input-demo { background:#ffffff; border:1px solid rgba(0,0,0,.06); box-shadow:0 15px 45px rgba(0,0,0,.2); border-radius:18px; padding:36px; margin-top:52px; margin-left:auto; margin-right:auto; max-width:100%; }
.demo-head { display:flex; align-items:center; gap:10px; color:var(--nv2); font-weight:800; font-size:17px; margin-bottom:24px; border-bottom:2px solid var(--or-pale); padding-bottom:12px; }
.demo-fields { display:flex; flex-direction:column; gap:10px; }
.df { background:#F9F8F6; border:1.5px solid #EAE8E4; border-radius:10px; padding:14px 6px; }
.df-l { font-size:11px; color:#8C8A84; margin-bottom:6px; font-weight:700; }
.df-v { font-size:13.5px; color:var(--nv2); font-weight:600; }
.proof-box { margin-top:18px; display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.proof-side { border-radius:12px; padding:20px; }
.proof-side.before { background:#F4F2EE; border:1.5px solid #E4E2DE; }
.proof-side.after { background:#FFF9F5; border:1.5px solid #FFD1C1; }
.proof-label { font-size:11px; font-weight:700; letter-spacing:.1em; margin-bottom:10px; display:flex; align-items:center; gap:6px; }
.proof-label.bef { color:#8C8A84; }
.proof-label.aft { color:var(--or-dk); }
.proof-txt { font-size:13px; line-height:1.75; }
.proof-txt.bef { color:#6E6C68; }
.proof-txt.aft { color:var(--nv2); font-weight:500; }
.proof-arrow { display:flex; align-items:center; justify-content:center; color:var(--or2); font-size:28px; margin-top:10px; }
.proof-stats { display:flex; gap:10px; margin-top:10px; flex-wrap:wrap; }
.proof-stat { background:var(--or); color:#fff; font-size:11px; font-weight:700; padding:3px 10px; border-radius:var(--rb); }
.proof-stat.bl { background:var(--bl2); }
#demo { background:linear-gradient(150deg,#8B2800 0%,#A83200 40%,#C04410 100%); padding:84px 24px; }
.demo-in { max-width:980px; margin:0 auto; }
.demo-wrap { background:#ffffff; border:1px solid rgba(0,0,0,.06); border-radius:24px; overflow:hidden; margin-top:44px; box-shadow:0 25px 60px rgba(0,0,0,.25); display:grid; grid-template-columns:1fr 1fr; align-items:stretch; }
.demo-left { display:flex; flex-direction:column; min-height:500px; padding-bottom: 40px;}
.demo-right { background:#FAF8F5; padding:26px; display:flex; align-items:center; justify-content:center; min-height:500px; position:relative; color:#9C9A96; flex-direction: column;}
.demo-right::before { content:'メモを入力して「AI記事校正を実行する」をクリックしてください。\A結果がここに表示されます。'; white-space:pre-wrap; text-align:center; font-size:14px; font-weight:500; }
.demo-tabs { display:flex; background:#F4F2EE; border-bottom:1px solid #E4E2DE; }
.demo-tab { flex:1; padding:18px 12px; font-size:14px; font-weight:700; color:#8C8A84; cursor:pointer; text-align:center; border:none; background:none; font-family:var(--fn); transition:.2s; position:relative; }
.demo-tab.active { color:var(--nv2); background:#ffffff; }
.demo-tab.active::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; background:var(--or); }
.demo-form { padding:36px 30px 36px; }
.demo-step-lbl { display:flex; align-items:center; gap:10px; color:var(--or-dk); font-size:14px; font-weight:800; letter-spacing:.05em; margin-bottom:24px; }
.demo-step-lbl span { background:var(--or); color:#fff; width:40px; height:40px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; }
.dfg { display:flex; flex-direction:column; gap:6px; }
.dfg label { font-size:13px; font-weight:700; color:#5C5A56; letter-spacing:.05em; }
.dfg.span2 { grid-column:1/-1; }
.df-in { background:#FAFAFA; border:1.5px solid #D6D4D0; border-radius:10px; padding:13px 16px; font-family:var(--fn); font-size:14px; color:var(--nv2); font-weight:600; width:100%; transition:all .2s; box-shadow:inset 0 1px 2px rgba(0,0,0,.03); }
.df-in::placeholder { color:#9C9A96; font-weight:400; }
.df-in:focus { outline:none; border-color:var(--or); background:#ffffff; box-shadow:0 0 0 3px rgba(240,90,26,.15); }
.df-sel { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='rgba(0,0,0,0.5)' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; cursor:pointer; }
.df-sel option { background:#ffffff; color:var(--nv2); }
.dfg-grid { display:grid; grid-template-columns:1fr; gap:16px; margin-bottom:20px; }
.tone-row { grid-column:1/-1; }
.tone-btns { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }
.tone-btn { padding:8px 18px; border-radius:var(--rb); border:1.5px solid #D6D4D0; background:#FFFDFB; color:#5C5A56; font-size:12.5px; font-weight:700; cursor:pointer; font-family:var(--fn); transition:.2s; }
.tone-btn:hover { border-color:var(--or); color:var(--or-dk); }
.tone-btn.sel { border-color:var(--or); background:#FFF0E8; color:var(--or-dk); }
.demo-gen-row { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-top:10px; flex-direction: column;}
.demo-note { font-size:12.5px; color:#8C8A84; line-height:1.6; }
.demo-output { border-top:1.5px solid #EAE8E4; background:#FAF8F5; padding:36px; display:block; }
.demo-output.show { display:block; }
.doh { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; flex-wrap:wrap; gap:10px; }
.dob-wrap { display:flex; gap:8px; flex-wrap:wrap; }
.dob { font-size:11px; font-weight:700; padding:4px 12px; border-radius:var(--rb); }
.dob-or { background:var(--or); color:#fff; }
.dob-bl { background:var(--bl2); color:#fff; }
.dob-gr { background:var(--gr); color:#fff; }
.copy-btn { background:#ffffff; border:1.5px solid #D6D4D0; color:#5C5A56; font-size:12px; font-weight:700; padding:7px 16px; border-radius:var(--rb); cursor:pointer; font-family:var(--fn); transition:.2s; }
.copy-btn:hover { background:#FAF8F5; color:var(--nv2); border-color:#8C8A84; }
.comp-grid { display:grid; grid-template-columns:1fr; gap:16px; margin-bottom:18px; }
.comp-card { border-radius:12px; padding:18px; }
.comp-card.bef { background:#F4F2EE; border:1.5px solid #E4E2DE; }
.comp-card.aft { background:#FFF9F5; border:1.5px solid #FFD1C1; }
.comp-lbl { font-size:11.5px; font-weight:700; letter-spacing:.1em; margin-bottom:10px; display:flex; align-items:center; gap:6px; }
.comp-lbl.bef { color:#8C8A84; }
.comp-lbl.aft { color:var(--or-dk); }
.comp-txt { font-size:13.5px; line-height:1.8; }
.comp-txt.bef { color:#5C5A56; }
.comp-txt.aft { color:var(--nv2); font-weight:500; }
.comp-stats { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.cs { font-size:11px; font-weight:700; padding:3px 10px; border-radius:var(--rb); }
.cs-or { background:var(--or); color:#fff; }
.cs-bl { background:var(--bl2); color:#fff; }
.cs-gr { background:var(--gr); color:#fff; }
.sns-prev { margin-top:18px; border-top:1.5px solid #EAE8E4; padding-top:18px; }
.sns-prev-ttl { font-size:11.5px; font-weight:700; color:#8C8A84; letter-spacing:.08em; margin-bottom:12px; }
.sns-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sns-card { background:#F8F6F2; border:1.5px solid #EAE8E4; border-radius:10px; padding:14px; }
.sns-hd { font-size:11.5px; font-weight:700; color:#8C8A84; margin-bottom:8px; }
.sns-body { font-size:12.5px; color:var(--nv2); line-height:1.7; font-weight:500; }
.demo-loading { display:none; padding:40px; text-align:center; }
.demo-loading.show { display:block; }
.ld-dots { display:flex; justify-content:center; gap:8px; margin-bottom:16px; }
.ld-dot { width:10px; height:10px; border-radius:50%; background:var(--or); animation:lda 1.2s infinite; }
.ld-dot:nth-child(2) { animation-delay:.2s; }
.ld-dot:nth-child(3) { animation-delay:.4s; }
@keyframes lda { 0%,80%,100%{transform:scale(1);opacity:.5;} 40%{transform:scale(1.4);opacity:1;} }
.ld-txt { color:rgba(255,255,255,.55); font-size:14px; }
.demo-err { display:none; padding:16px 32px; background:rgba(192,57,43,.1); border-top:1px solid rgba(192,57,43,.25); }
.demo-err.show { display:block; }
.demo-err p { color:#e87c6a; font-size:14px; }
.form-err { display:none; padding:12px 32px; background:rgba(192,57,43,.1); border-top:1px solid rgba(192,57,43,.25); }
.form-err.show { display:block; }
.form-err p { color:#e87c6a; font-size:14px; }
.demo-footer { padding:18px 32px 24px; display:none; gap:65px; flex-wrap:wrap; border-top:1px solid rgba(255,255,255,.07); justify-content: center; margin-top: 40px;}
.demo-disc { margin-top:20px; padding:14px 18px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:10px; font-size:14px; color:#fff; line-height:1.8; }
/* GWEBS INTRODUCTION SECTIONS */
#gwebs-intro-about { background:var(--cr); }
#gwebs-intro-features { background:linear-gradient(135deg,#B03A0C,#C04410); color:#fff; }
#gwebs-intro-features .eyebrow { color:#fff; }
#gwebs-intro-features .eyebrow::before { background:#fff; }
#gwebs-intro-features .sec-ttl { color:#fff; }
#gwebs-intro-hisho { background:var(--ww); }
#gwebs-intro-hisho ul { list-style:none !important; margin:0; padding:0; }
#gwebs-intro-hisho li { list-style:none !important; list-style-type:none !important; }
#gwebs-intro-demo { background:var(--sky); }
/* #gwebs-intro-demo .eyebrow { color:var(--nv2); }
#gwebs-intro-demo .eyebrow::before { background:var(--nv2); } */
#gwebs-intro-demo .sec-ttl { color:var(--nv2); }
#gwebs-intro-demo .intro-demo-section { background:linear-gradient(135deg, var(--bl2) 0%, #1976d2 100%); }
#gwebs-intro-sns-notice { background:var(--or-pale); }
#gwebs-intro-sns-notice .intro-notice { color:var(--nv2); }
#gwebs-intro-sns-notice .intro-notice h3 { color:var(--or-dk); }
#gwebs-intro-sns-notice .intro-notice-item p { color:var(--tm); }
#testimonial { background:var(--ww); }
.t-in { max-width:940px; margin:0 auto; }
.t-pill { display:inline-block; background:var(--or-pale); color:var(--or-dk); font-size:12px; font-weight:700; padding:5px 16px; border-radius:var(--rb); margin-bottom:28px; border:1px solid rgba(240,90,26,.22); }
.voice-wrap { background:#fff; border:1px solid var(--g2); border-left:6px solid var(--or); border-radius:16px; padding:38px; margin-top:28px; position:relative; box-shadow:0 10px 30px rgba(0,0,0,0.02); }
.voice-wrap::before { content:'\201C'; font-family:'Google Sans Flex',Georgia,serif; font-size:110px; color:rgba(240,90,26,0.07); position:absolute; top:-25px; left:20px; line-height:1; }
.v-quote { font-family:var(--fs); font-size:clamp(16px,2.2vw,19px); color:var(--nv2); line-height:1.9; font-weight:600; margin-bottom:24px; position:relative; z-index:1; }
.v-person { display:flex; align-items:center; gap:16px; }
.v-av { width:52px; height:52px; background:linear-gradient(135deg,var(--nv) 0%,var(--or) 100%); border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:18px; flex-shrink:0; box-shadow:0 4px 12px rgba(240,90,26,0.18); }
.v-name { font-weight:800; font-size:15px; color:var(--nv2); }
.v-role { font-size:12px; color:var(--tl); font-weight:500; margin-top:2px; }
.res-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(175px,1fr)); gap:18px; margin-top:48px; }
.res-card { background:#fff; border:1px solid var(--g2); padding:24px; text-align:center; position:relative; }
.res-card::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; }
.res-card:nth-child(1)::after { background:var(--or); }
.res-card:nth-child(2)::after { background:var(--ye); }
.res-card:nth-child(3)::after { background:var(--gr); }
.res-card:nth-child(4)::after { background:var(--bl2); }
.res-n { font-family:var(--fs); font-size:clamp(28px,4vw,38px); font-weight:700; color:var(--nv2); }
.res-u { font-size:24px; color:var(--or); margin-left: 4px;}
.res-l { font-size:16px; color:var(--tl); margin-top:6px; line-height:1.5; }
.recruit-box { margin-top:32px; padding:20px 24px; background:var(--or-pale); border-left:4px solid var(--or); }
.recruit-box strong { font-size:16px; color:var(--nv2); display:block; margin-bottom:5px; }
.recruit-box p { font-size:15px; color:var(--tl); }
#plans { background:var(--cr); padding:84px 18px 100px; }
.plans-in { max-width:1040px; margin:0 auto; }
.plans-note { text-align:center; max-width:600px; margin:12px auto 0; font-size:16px; color:var(--tl); }
.plans-scroll { overflow:visible; -webkit-overflow-scrolling:touch; padding:20px 4px; }
.plans-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:56px; border:2px solid var(--g2); border-radius:20px; overflow:visible; box-shadow:0 8px 48px rgba(26,47,94,.09); background:#fff; }
.plans-grid.scroll-min { min-width:720px; }
.pc { background:#fff; padding:38px 28px; position:relative; display:flex; flex-direction:column; transition:transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 0.3s ease; }
.pc:first-child { border-top-left-radius: 18px; border-bottom-left-radius: 18px; }
.pc:last-child { border-top-right-radius: 18px; border-bottom-right-radius: 18px; }
.pc+.pc { border-left:2px solid var(--g2); }
.pc:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(0,0,0,0.06); z-index: 5; }
.pc.rec { background:linear-gradient(160deg,#B03A0C,#C04410); transform:scale(1.04); z-index:10; border-radius:12px; box-shadow:0 20px 40px rgba(240,90,26,.32); border:1.5px solid var(--ye); }
.pc.rec:hover { transform:scale(1.07) translateY(-4px); box-shadow:0 24px 50px rgba(240,90,26,.45); }
.pc.rec+.pc { border-left:none; }
.pc-top { display:block; text-align:center; font-size:11px; font-weight:700; letter-spacing:.1em; padding:10px; margin:-38px -28px 22px; background:var(--or); color:#fff; }
.pc-name { font-family:var(--fs); font-size:21px; font-weight:700; margin-bottom:4px; color:var(--nv2); }
.pc.rec .pc-name { color:#fff; }
.pc-sub { font-size:13px; color:var(--tl); margin-bottom:20px; }
.pc.rec .pc-sub { color:rgba(255,255,255,.58); }
.pc-price { font-family:var(--fs); font-size:38px; font-weight:700; color:var(--nv2); line-height:1; }
.pc.rec .pc-price { color:#fff; }
.pc-price .yen { font-size:22px; font-weight:700; vertical-align:baseline; margin-right:2px; }
.pc-price .mo { font-size:13px; font-weight:400; color:var(--tl); }
.pc.rec .pc-price .mo { color:rgba(255,255,255,.5); }
.pc-tbd { display:inline-block; background:var(--or-pale); color:var(--or-dk); font-size:12px; padding:4px 12px; border-radius:6px; margin-top:8px; font-weight:700; }
.pc.rec .pc-tbd { background:rgba(240,90,26,.22); color:var(--ye2); }
.pc-init { font-size:12px; margin:12px 0; padding:10px 14px; background:var(--g1); border-radius:8px; color:var(--tm); }
.pc.rec .pc-init { background:rgba(255,255,255,.07); color:rgba(255,255,255,.7); }
.pc-init strong { color:var(--or-dk); }
.pc.rec .pc-init strong { color:var(--ye2); }
.pc-div { border:none; border-top:1px solid var(--g2); margin:18px 0; }
.pc.rec .pc-div { border-color:rgba(255,255,255,.12); }
.pc-feats { list-style:none; display:flex; flex-direction:column; gap:10px; margin-bottom:26px; flex:1; }
.pc-feats li { font-size:16px; display:flex; align-items:flex-start; gap:9px; line-height:1.5; color:var(--tm); }
.pc.rec .pc-feats li { color:rgba(255,255,255,.82); }
.ck { color:var(--or); font-weight:700; flex-shrink:0; margin-top:1px; }
.pc.rec .ck { color:var(--ye2); }
.ng { color:var(--g4); flex-shrink:0; margin-top:1px; }
.pc.rec .ng { color:rgba(255,255,255,.25); }
.li-dim { color:var(--g4)!important; }
.pc-btn { margin-top:auto; }
#faq { background:var(--ww); }
.faq-list { max-width:820px; margin:48px auto 0; }
.faq-item { border-bottom:1px solid var(--g2); }
.faq-item:first-child { border-top:1px solid var(--g2); }
.faq-q { width:100%; background:none; border:none; cursor:pointer; padding:22px 0; text-align:left; font-family:var(--fn); font-size:15px; font-weight:700; color:var(--nv2); display:flex; align-items:center; gap:14px; }
.fq-ic { width:30px; height:30px; background:var(--nv); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; flex-shrink:0; }
.fq-ar { margin-left:auto; color:var(--or); font-size:18px; transition:transform .25s; flex-shrink:0; }
.faq-item.open .fq-ar { transform:rotate(180deg); }
.faq-a { display:none; padding:0 0 20px 44px; font-size:16px; color:var(--tl); line-height:1.85; }
.faq-item.open .faq-a { display:block; }
#cta { background:linear-gradient(135deg,var(--or) 0%,#F5821A 40%,var(--ye) 100%); padding:90px 24px; text-align:center; position:relative; overflow:hidden; }
#cta::before { content:''; position:absolute; inset:0; background:repeating-linear-gradient(45deg,transparent,transparent 40px,rgba(255,255,255,.04) 40px,rgba(255,255,255,.04) 41px); }
.cta-in { position:relative; z-index:1; max-width:720px; margin:0 auto; }
.cta-pill { display:inline-block; background:rgba(255,255,255,.2); border:1px solid rgba(255,255,255,.4); color:#fff; font-size:22px; font-weight:700; padding:6px 18px; border-radius:var(--rb); margin-bottom:22px; letter-spacing:.1em; }
.cta-ttl { font-family:var(--fs); font-size:clamp(24px,4.5vw,44px); color:#fff; font-weight:700; margin-bottom:16px; line-height:1.35; text-shadow:0 2px 8px rgba(0,0,0,.15); }
.cta-lead { color:rgba(255,255,255,.9); font-size:18px; margin-bottom:38px; line-height:1.85; text-align: center;}
.cta-btns { display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }
.cta-note { font-size:16px; color:rgba(255,255,255,.65); margin-top:20px; }
#contact { background:var(--cr); padding:84px 24px; }
.cont-in { max-width:660px; margin:0 auto; }
.fg { margin-bottom:22px; }
.fg label { display:block; font-size:14px; font-weight:700; color:var(--nv2); margin-bottom:8px; }
.br { background:var(--or); color:#fff; font-size:10px; padding:2px 8px; border-radius:var(--rb); margin-left:8px; vertical-align:middle; }
.bo { background:var(--g2); color:var(--g6); font-size:10px; padding:2px 8px; border-radius:var(--rb); margin-left:8px; vertical-align:middle; }
.fi { width:100%; border:2px solid var(--g2); border-radius:10px; padding:14px 18px; font-family:var(--fn); font-size:15px; transition:border-color .2s; background:#fff; color:var(--td); }
.fi:focus { outline:none; border-color:var(--or); }
.fsel2 { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23666' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 18px center; }
.fchk { display:flex; align-items:flex-start; gap:10px; font-size:14px; color:var(--tm); }
.fchk input { margin-top:3px; }
.f-sub { margin-top:28px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:12px; }
.f-note { font-size:16px; color:var(--tl); margin-top:14px; text-align:center; }
.fi-err { display:block; font-size:12.5px; color:#D32F2F; font-weight:700; margin-top:6px; min-height:18px; }
.fi-error { border-color:#D32F2F!important; background:#FFF5F5!important; }
/* ---- お問い合わせ ステップUI ---- */
.cf-steps { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:28px; }
.cf-step { display:flex; align-items:center; gap:6px; font-size:13px; font-weight:700; color:var(--g4); }
.cf-step.active { color:var(--or); }
.cf-step-n { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:50%; background:var(--g2); color:var(--g6); font-size:11px; font-weight:700; }
.cf-step.active .cf-step-n { background:var(--or); color:#fff; }
.cf-step-arrow { color:var(--g4); font-size:14px; }
/* 確認テーブル */
.cf-confirm-lead { font-size:14px; color:var(--tm); margin-bottom:20px; text-align:center; }
.cf-confirm-tbl { width:100%; border-collapse:collapse; }
.cf-confirm-tbl th, .cf-confirm-tbl td { border:1px solid var(--g2); padding:13px 16px; font-size:14px; text-align:left; line-height:1.7; vertical-align:top; }
.cf-confirm-tbl th { background:var(--g1); color:var(--nv2); font-weight:700; width:36%; white-space:nowrap; }
.cf-confirm-tbl td { color:var(--tm); background:#fff; }
/* 完了画面 */
.cf-complete-icon { font-size:60px; color:var(--gr); margin-bottom:16px; }
.cf-complete-ttl { font-family:var(--fs); font-size:22px; font-weight:700; color:var(--nv2); margin-bottom:12px; }
.cf-complete-msg { font-size:15px; color:var(--tl); line-height:1.9; }
footer { background:linear-gradient(180deg,#8B2800,#6E2000); padding:28px 24px 16px; color:rgba(255,255,255,.7); }
.ft-in { max-width:1080px; margin:0 auto; }
.ft-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:28px; margin-bottom:20px; }
.ft-brand { font-family:'Google Sans Flex',sans-serif; font-weight:500; font-stretch:100%; font-size:20px; color:#fff; margin-bottom:12px; }
.ft-copy { font-size:13px; line-height:1.75; }
.ft-col-h { font-size:13px; font-weight:700; color:rgba(255,255,255,.88); margin-bottom:14px; letter-spacing:.05em; }
.ft-links { list-style:none; display:flex; flex-direction:column; gap:9px; }
.ft-links a { font-size:13px; color:rgba(255,255,255,.52); transition:color .2s; }
.ft-links a:hover { color:rgba(255,255,255,.9); }
.ft-btm { border-top:1px solid rgba(255,255,255,.07); padding-top:20px; margin-top:24px; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; font-size:12px; }
.ft-disclaimer { margin-top:20px; padding:14px 18px; background:rgba(255,255,255,.05); border-radius:8px; font-size:12.5px; line-height:1.7; color:rgba(255,255,255,.6); text-align:left; }
.ft-disclaimer-icon { color:var(--ye2); margin-right:6px; }
#ptop { position:fixed; bottom:28px; right:24px; width:50px; height:50px; background:var(--or); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:18px; cursor:pointer; opacity:0; pointer-events:none; transition:opacity .3s,transform .2s; box-shadow:0 4px 20px rgba(240,90,26,.45); border:none; z-index:900; }
#ptop.vis { opacity:1; pointer-events:all; }
#ptop:hover { transform:translateY(-4px); }
.rv { opacity:0; transform:translateY(28px); transition:opacity .65s cubic-bezier(.22,1,.36,1),transform .65s cubic-bezier(.22,1,.36,1); }
.rv.vis { opacity:1; transform:translateY(0); }
#supervisor { background:linear-gradient(135deg,#FFF8F2 0%,#FFF3E8 100%); padding:80px 24px; border-top:4px solid var(--or); }
.sv-in { max-width:900px; margin:0 auto; }
.sv-card { background:#fff; border:1px solid var(--g2); border-radius:0; padding:48px; display:grid; grid-template-columns:200px 1fr; gap:48px; align-items:start; position:relative; overflow:hidden; }
.sv-card::before { content:''; position:absolute; top:0; left:0; right:0; height:5px; background:linear-gradient(90deg,var(--or),var(--ye)); }
.sv-photo-wrap { display:flex; flex-direction:column; align-items:center; gap:14px; }
.sv-photo { width:130px; height:130px; border-radius:50%; object-fit:cover; object-position:center top; border:4px solid var(--or); box-shadow:0 6px 24px rgba(240,90,26,.22); }
.sv-name-block { text-align:center; }
.sv-name { font-family:var(--fs); font-size:18px; font-weight:700; color:var(--nv2); }
.sv-title { font-size:12px; color:var(--tl); margin-top:4px; line-height:1.5; }
.sv-eyebrow { display:inline-flex; align-items:center; gap:7px; font-size:11px; font-weight:700; letter-spacing:.14em; color:var(--or); margin-bottom:14px; }
.sv-eyebrow::before { content:''; display:block; width:20px; height:3px; background:var(--or); border-radius:2px; }
.sv-headline { font-family:var(--fs); font-size:clamp(18px,2.5vw,24px); font-weight:700; color:var(--nv2); line-height:1.45; margin-bottom:20px; }
.sv-headline span { color:var(--or); }
.sv-stats { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:24px; }
.sv-stat { background:var(--or-pale); border:1px solid rgba(240,90,26,.2); border-radius:8px; padding:10px 16px; text-align:center; }
.sv-stat-n { font-family:var(--fs); font-size:22px; font-weight:700; color:var(--or); line-height:1; }
.sv-stat-n sub { font-size:55%; font-weight:400; }
.sv-stat-l { font-size:11px; color:var(--tl); margin-top:4px; }
.sv-profile { font-size:14px; color:var(--tm); line-height:1.9; }
.sv-profile p { margin-bottom:8px; }
.sv-profile p:last-child { margin-bottom:0; }
.sv-tag-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.sv-tag { background:var(--nv2); color:#fff; font-size:11px; font-weight:700; padding:4px 12px; border-radius:var(--rb); }
.sv-tag.or { background:var(--or); }
@media(max-width:900px) {
  /* Intro Grid レスポンシブ対応 */
  .intro-grid-2col { grid-template-columns:1fr; gap:24px; }
  .intro-grid-2col-even { grid-template-columns:1fr; gap:20px; }
  .intro-grid-3col { grid-template-columns:1fr 1fr; gap:16px; }
  .intro-grid-image-wrap { margin-top:12px; }
  .intro-demo-grid { grid-template-columns:1fr; gap:20px; }
  .intro-notice-grid { grid-template-columns:1fr; gap:14px; }

  .how-steps { grid-template-columns:1fr 1fr; gap:28px; }
  .how-steps::before { display:none; }

  /* スマホ・タブレット（900px以下）での料金表の完全レスポンシブ化 */
  .plans-scroll { overflow-x:auto; padding:0; }
  .plans-grid.scroll-min { min-width: 0 !important; width: 100%; }
  .plans-grid { grid-template-columns:1fr; gap:24px; border: none; box-shadow: none; background: transparent; overflow: visible; }

  .pc { border: 2px solid var(--g2); border-radius: 16px !important; box-shadow: 0 4px 20px rgba(0,0,0,0.03); margin-bottom: 8px; }
  .pc+.pc { border-left: none; }

  .pc.rec { transform:scale(1)!important; border:2px solid var(--or); border-radius:16px!important; box-shadow:0 10px 30px rgba(240,90,26,0.12)!important; margin:8px 0!important; }
  .pc.rec:hover { transform:translateY(-4px)!important; box-shadow:0 12px 35px rgba(240,90,26,0.2)!important; }
  .pc:hover { transform: translateY(-4px); }

  .proof-box, .comp-grid { grid-template-columns:1fr; }
  .sns-grid { grid-template-columns:1fr; }
  #hero { min-height:70vh; }
  .hero-in { padding:80px 18px; }
  .hpb-in { grid-template-columns:1fr; gap:30px; }
  .h1-line2 { font-size:clamp(48px,12vw,80px)!important; }
}
@media(max-width:768px) {
  .sec { padding:60px 16px; }
  .sec-in { padding:0 8px; }
  .how-in { padding:0 8px; }
  .ida-layout { grid-template-columns:1fr; gap:12px; }
  .ida-arrow { padding:8px 0; font-size:22px; }
  .ida-after { padding:12px; margin-top:12px; }
  .input-demo { padding:16px 12px; margin:52px auto 0; }
  .demo-fields { gap:8px; }

  footer { padding:24px 16px 12px; }
  .ft-in { padding:0 8px; }
  .ft-grid { display:flex; flex-direction:column-reverse; gap:20px; }
  .ft-btm { padding-right:0; padding-bottom:12px; flex-direction:column; align-items:flex-start; }
  #ptop { bottom: 76px; }

  /* Intro Grid モバイル最適化 */
  .intro-grid-2col { grid-template-columns:1fr; gap:16px; padding:0 4px; }
  .intro-grid-2col-even { grid-template-columns:1fr; gap:12px; padding:0 4px; }
  .intro-grid-3col { grid-template-columns:1fr; gap:14px; }
  .intro-demo-grid { grid-template-columns:1fr; gap:12px; }
  .intro-notice-grid { grid-template-columns:1fr; gap:10px; }
  .intro-grid-image-wrap { margin-top:8px; }
  .intro-grid-2col-image, .intro-grid-2col-even-image { border-radius:8px; }

  #nav { padding:0 16px; }
  .nav-links { display:none; }
  .hb { display:flex; }
  .mmenu { padding:6px 0 12px; max-height:calc(100vh - 100px); overflow-y:auto; -webkit-overflow-scrolling:touch; }
  .mmenu a { padding:12px 24px; font-size:14px; }
  .mm-cta { margin:10px 16px 0!important; padding:12px!important; font-size:14px; }

  /* ===== スマホ：枠の中に枠 → 余白削減・枠線省略 ===== */
  /* hero-proof-band */
  .hpb-supervisor-card { padding:16px; }
  .hpb-visual-card { border:none; box-shadow:none; padding:16px; }

  /* showcase-demo-card */
  .showcase-demo-card { border:none; box-shadow:none; padding:20px 16px; }
  .showcase-demo-card .hc-after { padding:14px 12px; }

  /* input-demo（AI実例ブロック） */
  .input-demo { padding:20px 6px; border:none; box-shadow:none; }
  .demo-fields { display:flex; flex-direction:column !important; }

  /* demo-showcase セクション余白縮小 */
  #demo-showcase.sec { padding:36px 16px; }
  .demo-showcase-in { padding:0 0 24px; }
  .demo-showcase-sub { margin-bottom:24px; }
  .demo-sub-main { text-align:left!important; }

  .demo-wrap { box-shadow:0 4px 16px rgba(0,0,0,.12); border-radius:16px; margin-top:32px; }
  .demo-left { min-height:auto; padding-bottom:24px; }
  .demo-right { min-height:auto; padding:24px; }
  /* ===== ここまで ===== */

  .h1-line1 { font-size:clamp(12px,3.8vw,24px); white-space:nowrap; }
  .h1-line2 { font-size:clamp(44px,14vw,72px)!important; }
  .gwebs-ruby { font-size:12px; }
  .hero-lead-top, .hero-lead-btm { text-align:left!important; }
  .sec { padding:60px 18px; }
  #how { padding-left:10px; padding-right:10px; }
  .demo-in { padding-left:4px; padding-right:4px; }
  .demo-form { padding:20px 18px 24px; }
  .demo-output { padding:20px 18px; }
  .demo-footer { padding:14px 18px 20px; }
  .sv-card { grid-template-columns:1fr; gap:24px; padding:28px 20px; }
  .sv-photo-wrap { flex-direction:row; align-items:center; gap:20px; }
  .sv-photo { width:100px; height:100px; }
  .sv-name-block { text-align:left; }
  /* sp-br / pc-br 切替 */
  .sp-br { display:inline!important; }
  .pc-br { display:none!important; }
  /* sp-left → スマホでもそのまま左寄せ維持 */
  /* ida ヘッダー縦並び */
  .ida-header { flex-direction:column; align-items:flex-start; gap:6px; }
  .ida-diff { white-space:normal; }
  /* sticky-cta 表示 */
  #sticky-cta { display:flex; }
  footer { padding-bottom:56px; }
  /* input-demo フィールド 縦並び */
  .input-demo .demo-fields { display:flex; flex-direction:column !important; }
  .ida-layout { grid-template-columns:1fr !important; grid-template-rows:auto auto auto; }
  .ida-arrow { flex-direction:column; padding:12px 0; }
  .ida-arrow-pc { display:none !important; }
  .ida-arrow-sp { display:inline !important; }
  /* Intro Grid スマホ最適化 */
  #gwebs-intro .intro-grid-2col { grid-template-columns: 1fr; gap: 20px; }
  #gwebs-intro .intro-grid-3col { grid-template-columns: 1fr; gap: 16px; }
  #gwebs-intro .intro-grid-2col-even { grid-template-columns: 1fr; gap: 16px; }
  #gwebs-intro .intro-card { padding: 20px; }
  #gwebs-intro .intro-heading { font-size: 20px; }
  #gwebs-intro .intro-demo-grid { grid-template-columns: 1fr; gap: 16px; }
  #gwebs-intro .intro-notice-grid { grid-template-columns: 1fr; gap: 12px; }
  #gwebs-intro .intro-notice { padding: 20px; }
  #gwebs-intro .intro-feature-box { padding: 20px; }
  #gwebs-intro .intro-card-icon { width: 40px; height: 40px; font-size: 20px; }
  #gwebs-intro .intro-card h4 { font-size: 18px; }
  #gwebs-intro .intro-card p { font-size: 14px; }
  #gwebs-intro .intro-feature-box h4 { font-size: 18px; }
  #gwebs-intro .intro-feature-box li { font-size: 16px; }
  #gwebs-intro .intro-demo-item p { font-size: 16px; }
  #gwebs-intro .intro-demo-item strong { font-size: 18px; }
  /* Gallery スマホ最適化 */
  .gallery-container { grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 20px; }
  .gallery-item { aspect-ratio: 1; border-radius: 8px; }
  .modal-image { max-width: 95vw; max-height: 90vh; }
  /* plans 余白 */
  .plans-legal { margin:16px 0 0; padding:12px 14px; }
  .plans-note { text-align:left!important; }
  /* plans 横スクロール対応 - 1カード画面表示 */
  .plans-scroll { overflow-x: auto; overflow-y: hidden; padding: 10px 0; -webkit-overflow-scrolling: touch; width: 100%; scroll-snap-type: x mandatory; }
  .plans-grid { display: flex !important; flex-direction: row; gap: 0; border: none; box-shadow: none; background: transparent; margin-top: 30px; }
  .plans-grid.scroll-min { min-width: auto; }
  .pc { width: calc(100vw - 36px); flex-shrink: 0; margin: 0 18px; border-radius: 16px !important; box-shadow: 0 4px 20px rgba(0,0,0,0.03) !important; border: 2px solid var(--g2) !important; scroll-snap-align: start; scroll-snap-stop: always; }
  .pc:first-child { margin-left: 18px; }
  .pc:last-child { margin-right: 18px; }
  .pc+.pc { border-left: 2px solid var(--g2) !important; }
  /* 本文・説明文を左寄せ（タイトル・キャッチ以外） */
  .sec-sub.c { text-align:left!important; }
  .demo-showcase-sub { text-align:left!important; }
  .demo-showcase-in { text-align:left!important; }
  .how-sub { text-align:left!important; }
  .how-steps { grid-template-columns: 1fr; gap: 28px; }
  .how-steps::before { display: none; }
  .how-step { text-align:left; }
  .how-step .step-num { margin:0 0 12px; }
  .sol-ttl { text-align:left!important; }
  #sol { text-align:left!important; }
  .sol-container { text-align:left!important; }

  footer { padding:22px 18px 12px; }
  .ft-grid { display:flex; flex-direction:column-reverse; gap:24px; }
  .ft-btm { padding-right:0; padding-bottom:14px; }
}
@media(max-width:600px) {
  .sec { padding:48px 12px; }
  .sec-in { padding:0 4px; }
  .how-in { padding:0 4px; }
  .ida-layout { grid-template-columns:1fr; gap:8px; }
  .ida-arrow { padding:4px 0; font-size:18px; }
  .ida-after { padding:10px; margin-top:8px; }
  .input-demo { padding:12px 8px; margin:52px auto 0; }
  .demo-fields { gap:6px; }

  .mmenu { padding:4px 0 8px; max-height:calc(100vh - 80px); overflow-y:auto; -webkit-overflow-scrolling:touch; }
  .mmenu a { padding:10px 20px; font-size:13px; }
  .mm-cta { margin:8px 12px 0!important; padding:10px!important; font-size:13px; }

  footer { padding:20px 12px 8px; overflow:hidden; }
  .ft-in { padding:0 4px; }
  .ft-brand { font-size:16px; margin-bottom:8px; }
  .ft-copy { font-size:12px; line-height:1.6; word-break:break-word; }
  .ft-grid { display:flex; flex-direction:column; gap:16px; }
  .ft-col-h { font-size:12px; margin-bottom:10px; }
  .ft-links a { font-size:12px; }
  .ft-btm { flex-direction:column; align-items:flex-start; gap:8px; padding-top:12px; font-size:11px; }
  .ft-disclaimer { margin-top:12px; padding:10px 12px; font-size:11px; line-height:1.6; }
  #ptop { bottom:76px; }

  /* Intro Grid 超小型スクリーン対応 */
  .intro-grid-2col { grid-template-columns:1fr; gap:12px; padding:0; margin-top:16px; }
  .intro-grid-2col-even { grid-template-columns:1fr; gap:12px; padding:0; margin-top:16px; }
  .intro-grid-3col { grid-template-columns:1fr; gap:12px; margin-top:16px; }
  .intro-demo-grid { grid-template-columns:1fr; gap:10px; margin-top:12px; }
  .intro-notice-grid { grid-template-columns:1fr; gap:10px; }
  .intro-grid-image-wrap { margin-top:0; }
  .intro-text { font-size:15px; }
  .intro-grid-2col-image, .intro-grid-2col-even-image { border-radius:6px; }

  .dfg-grid{grid-template-columns:1fr;}
  .demo-wrap { grid-template-columns:1fr; margin-top:32px; }
  .demo-left { border-bottom:1px solid #E4E2DE; min-height:auto; padding-bottom:20px; }
  .demo-right { background:#ffffff; min-height:auto; padding:20px; }
}

.delay-1 { transition-delay:.08s; }
.delay-2 { transition-delay:.16s; }
.delay-3 { transition-delay:.24s; }
.delay-4 { transition-delay:.04s; }
.delay-5 { transition-delay:.12s; }
.delay-6 { transition-delay:.20s; }
.sol-container { text-align:center; }
.sol-arrow { font-size:36px; margin-bottom:16px; color:#fff; }
.sol-subtext { color:#fff; font-size:18px; margin-top:12px; font-weight:500; }
.sol-cta-btn { margin-top:28px; }
#demo-showcase { background:#FFFDFB; border-top:1px solid var(--g2); border-bottom:1px solid var(--g2); }
.demo-showcase-in { max-width:760px; margin:0 auto; text-align:center; padding:12px 0 60px; }
.demo-showcase-ttl { font-size:clamp(22px,3.5vw,32px); color:var(--nv2); font-weight:700; line-height:1.4; margin-bottom:16px; }
.demo-showcase-sub { color:var(--tl); font-size:18px; margin-bottom:44px; line-height:1.7; }
.showcase-demo-card { max-width:580px; margin:0 auto; text-align:left; background:#ffffff; border:1px solid rgba(0,0,0,.08); box-shadow:0 15px 45px rgba(0,0,0,.12); border-radius:24px; padding:40px 36px; transition:.2s; }
.showcase-demo-card .hc-head { display:flex; align-items:center; gap:14px; margin-bottom:20px; border-bottom:2px solid var(--or-pale); padding-bottom:14px; }
.showcase-demo-card .hc-icon { width:44px; height:44px; border-radius:12px; background:var(--or-pale); display:flex; align-items:center; justify-content:center; font-size:22px; flex-shrink:0; }
.showcase-demo-card .hc-ttl { font-family:var(--fs); font-size:17px; font-weight:800; color:var(--nv2); line-height:1.2; }
.showcase-demo-card .hc-sub { font-size:12px; color:var(--tl); margin-top:2px; }
.showcase-demo-card .hc-arrow { text-align:center; color:var(--or); font-size:15px; margin:12px 0; font-weight:800; letter-spacing:.05em; }
.showcase-demo-card .hc-after { background:linear-gradient(135deg,#FFFBF8,#FFF1E9); border-radius:10px; padding:20px 18px; font-size:16px; color:var(--nv2); line-height:1.85; border-left:4px solid var(--or); font-weight:500; margin-bottom:20px; box-shadow:inset 0 1px 3px rgba(0,0,0,.02); }
.showcase-demo-card .hc-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; border-top:1px solid #F0ECE6; padding-top:16px; }
.showcase-demo-card .hc-badge { display:inline-flex; align-items:center; gap:6px; background:var(--or); color:#fff; font-size:11.5px; font-weight:700; padding:5px 16px; border-radius:20px; box-shadow:0 2px 6px rgba(240,90,26,.25); }
.showcase-demo-card .hc-chars { font-size:12px; color:#8C8A84; font-weight:600; }
.delay-7 { transition-delay:.1s; }
.delay-8 { transition-delay:.2s; }
.delay-9 { transition-delay:.3s; }
.input-demo .demo-fields { display:flex; flex-direction:column; gap:10px; overflow:hidden; }
.ida-layout { display:grid; grid-template-columns:1fr auto 1fr; gap:0; align-items:center; margin-top:16px; overflow:hidden; }
.ida-arrow { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding:0 16px; color:var(--or); font-size:28px; flex-shrink:0; }
.ida-arrow-label { font-size:11px; font-weight:700; color:var(--or-dk); letter-spacing:.05em; white-space:nowrap; }
.ida-arrow-sp { display:none; }
.ida-memo-wrap { margin-top:12px; overflow:hidden; }
.ida-after { margin-top:16px; background:#FFF9F5; border:1.5px solid #FFD1C1; border-radius:12px; box-shadow:0 4px 20px rgba(255,79,100,.04); padding:14px; overflow:hidden; word-wrap:break-word; }
.ida-body { font-size:14px; color:#221100; line-height:1.9; font-weight:500; }
.ida-note { margin-top:12px; padding:10px 14px; background:#FFFDF0; border:1px solid #FFE788; border-radius:8px; font-size:12px; color:#665511; line-height:1.65; font-weight:500; }
#demo .demo-in { padding:4px 0; }
#demo .sp-left { text-align:center; }
#plans .sp-left { text-align:center; }
.demo-ttl-main { font-family:var(--fs); font-size:clamp(22px,4vw,34px); color:#fff; font-weight:700; line-height:1.35; margin-bottom:12px; }
.demo-ttl-main span { color:var(--or2); }
.demo-sub-main { color:rgba(255,255,255,.8); font-size:20px; line-height:1.85; text-align:center; }
#tab2 { opacity:.38; cursor:not-allowed; }
#d3_custom, #d4_custom { display:none; margin-top:8px; }
.demo-loading { display:none; }
.demo-output { display:none; }
.demo-err { display:none; }
.demo-gen-btns { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.pc-btn .btn { width:100%; justify-content:center; }
.plans-legal { max-width:700px; margin:28px auto 0; padding:16px 22px; background:var(--ww); border:1px solid var(--g2); font-size:16px; color:var(--tl); line-height:1.9; }
.sv-in > .eyebrow { margin-bottom:32px; }
.ft-brand-sub { font-size:13px; font-weight:400; opacity:.7; font-family:var(--fn); }
.ft-disclaimer { margin-top:0px; padding:16px 20px; background:rgba(255,255,255,.05); border-radius:8px; font-size:12.5px; line-height:1.7; color:rgba(255,255,255,.6); text-align:left; }
.ft-disclaimer .fa-circle-info { color:var(--ye2); margin-right:6px; }
/* sp-left / pc-br / sp-br */
.sp-left { text-align:center; }
.pc-br { display:inline; }
.sp-br { display:none; }
/* ida（input-demo after）ヘッダー */
.ida-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; padding:12px 14px 10px; border-bottom:1px solid #FFD1C1; }
.ida-badges { display:flex; flex-wrap:wrap; gap:6px; }
.badg-or { display:inline-flex; align-items:center; gap:4px; background:var(--or); color:#fff; font-size:11px; font-weight:700; padding:3px 10px; border-radius:var(--rb); }
.badg-bl { display:inline-flex; align-items:center; gap:4px; background:var(--bl2); color:#fff; font-size:11px; font-weight:700; padding:3px 10px; border-radius:var(--rb); }
.badg-gr { display:inline-flex; align-items:center; gap:4px; background:var(--gr); color:#fff; font-size:11px; font-weight:700; padding:3px 10px; border-radius:var(--rb); }
.ida-diff { font-size:18px; color:var(--or-dk); font-weight:700; white-space:nowrap; }
.ida-body { padding:12px 14px; }
/* sticky-cta（スマホ固定ボタン） */
#sticky-cta { display:none; position:fixed; bottom:0; left:0; right:0; z-index:800; gap:0; box-shadow:0 -4px 20px rgba(0,0,0,.18); }
.s-cta-btn { flex:1; display:flex; align-items:center; justify-content:center; gap:6px; padding:16px 8px; font-size:14px; font-weight:700; font-family:var(--fn); text-decoration:none; }
.s-cta-demo { background:var(--nv2); color:#fff; }
.s-cta-contact { background:var(--or); color:#fff; }

/* === MODAL === */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.6);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s;
}
.modal-overlay.show {
  opacity: 1;
  pointer-events: all;
}
.modal-content {
  background: #fff;
  width: 90%;
  max-width: 800px;
  height: 50vh;
  border-radius: 12px;
  position: relative;
  box-shadow: 0 10px 40px rgba(0,0,0,0.2);
  transform: translateY(20px);
  transition: transform 0.3s;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.modal-overlay.show .modal-content {
  transform: translateY(0);
}
.modal-close {
  position: absolute;
  top: 15px;
  right: 15px;
  background: var(--or);
  color: #fff;
  border: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  transition: background 0.2s;
}
.modal-close:hover {
  background: var(--or-dk);
}
#modal-iframe {
  width: 100%;
  height: 100%;
  border: none;
  flex-grow: 1;
}
/* ========== Gallery Styles ========== */
.gallery-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-top: 32px; }
.gallery-item { position: relative; overflow: hidden; border-radius: 12px; cursor: pointer; aspect-ratio: 4/3; box-shadow: 0 4px 12px rgba(0,0,0,0.1); transition: transform 0.3s, box-shadow 0.3s; }
.gallery-item:hover { transform: translateY(-4px) scale(1.02); box-shadow: 0 8px 24px rgba(240,90,26,0.25); }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; }
.modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.85); display: none; align-items: center; justify-content: center; z-index: 5000; opacity: 0; transition: opacity 0.3s; }
.modal-overlay.show { display: flex; opacity: 1; }
.modal-image { max-width: 90vw; max-height: 90vh; object-fit: contain; border-radius: 8px; animation: slideIn 0.3s ease-out; }
@keyframes slideIn { from { transform: scale(0.9) translateY(20px); opacity: 0; } to { transform: scale(1) translateY(0); opacity: 1; } }