@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans+JP:wght@400;500;700&family=Zen+Kurenaido&display=swap";@import "https://fonts.googleapis.com/css2?family=Zen+Kurenaido&display=swap";:root{--bg-shell:#18181b;--bg-panel:#27272a;--bg-panel-hover:#3f3f46;--bg-canvas:#f3f4f6;--text-primary:#f4f4f5;--text-secondary:#a1a1aa;--text-dark:#18181b;--border-color:#3f3f46;--border-light:#e5e7eb;--accent:#3b82f6;--accent-hover:#2563eb;--danger:#ef4444;--danger-hover:#dc2626;--success:#10b981;--success-hover:#059669;--font-ui:"Inter", "Noto Sans JP", sans-serif;--font-handwriting:"Zen Kurenaido", cursive;--topbar-height:56px;--sidebar-width:320px}body{font-family:var(--font-ui);background-color:var(--bg-shell);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0;overflow:hidden}#root{flex-direction:column;width:100vw;height:100vh;display:flex}.app-container{flex-direction:column;width:100vw;height:100vh;display:flex;overflow:hidden}.main-content{height:calc(100vh - var(--topbar-height));flex:1;display:flex;overflow:hidden}.topbar{height:var(--topbar-height);background-color:var(--bg-panel);border-bottom:1px solid var(--border-color);box-sizing:border-box;justify-content:space-between;align-items:center;padding:0 20px;display:flex}.topbar-logo{color:var(--text-primary);letter-spacing:-.5px;align-items:center;gap:8px;font-size:16px;font-weight:700;display:flex}.topbar-logo span{color:var(--accent)}.topbar-controls{align-items:center;gap:12px;display:flex}.segment-control{background:var(--bg-shell);border:1px solid var(--border-color);border-radius:6px;padding:4px;display:flex}.segment-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:6px 16px;font-size:13px;font-weight:500;transition:all .2s}.segment-btn:hover{color:var(--text-primary)}.segment-btn.active{background:var(--bg-panel-hover);color:var(--text-primary);box-shadow:0 1px 3px #0003}.sidebar{width:var(--sidebar-width);background-color:var(--bg-panel);border-right:1px solid var(--border-color);box-sizing:border-box;flex-direction:column;gap:24px;height:100%;padding:20px;display:flex;overflow-y:auto}.sidebar::-webkit-scrollbar{width:6px}.sidebar::-webkit-scrollbar-track{background:0 0}.sidebar::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.sidebar::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.sidebar-section{flex-direction:column;gap:12px;display:flex}.sidebar-title{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;align-items:center;gap:6px;margin:0;font-size:12px;font-weight:600;display:flex}.sidebar-desc{color:var(--text-secondary);margin:0;font-size:13px;line-height:1.5}.btn{font-size:13px;font-weight:500;font-family:var(--font-ui);cursor:pointer;box-sizing:border-box;border:1px solid #0000;border-radius:6px;justify-content:center;align-items:center;gap:8px;width:100%;padding:10px 16px;transition:all .2s;display:inline-flex}.btn-primary{background-color:var(--accent);color:#fff}.btn-primary:hover{background-color:var(--accent-hover)}.btn-secondary{background-color:var(--bg-shell);color:var(--text-primary);border-color:var(--border-color)}.btn-secondary:hover{background-color:var(--bg-panel-hover)}.btn-danger{color:var(--danger);background-color:#ef44441a;border-color:#ef444433}.btn-danger:hover{background-color:var(--danger);color:#fff}.btn-success{background-color:var(--success);color:#fff}.btn-success:hover{background-color:var(--success-hover)}.btn-ghost{color:var(--text-secondary);background-color:#0000}.btn-ghost:hover{color:var(--text-primary);background-color:var(--bg-panel-hover)}.workspace{background-color:var(--bg-canvas);box-sizing:border-box;background-image:radial-gradient(#d1d5db 1px,#0000 1px);background-size:20px 20px;flex:1;height:100%;padding:40px;overflow:hidden auto}.canvas-container{width:100%;max-width:1200px;min-height:100%;color:var(--text-dark);background-color:#fff;border-radius:8px;margin:0 auto;transition:max-width .3s,margin .3s;position:relative;overflow:hidden;box-shadow:0 4px 20px #00000014}.canvas-container.viewport-tablet{border:10px solid #27272a!important;border-radius:24px!important;max-width:768px!important;box-shadow:0 10px 40px #00000026!important}.canvas-container.viewport-mobile{border:10px solid #27272a!important;border-radius:30px!important;max-width:375px!important;box-shadow:0 10px 40px #00000026!important}.tool-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.tool-btn{background-color:var(--bg-shell);border:1px solid var(--border-color);color:var(--text-secondary);cursor:pointer;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:12px;transition:all .2s;display:flex}.tool-btn:hover{border-color:var(--text-secondary)}.tool-btn.active{border-color:var(--accent);color:var(--accent);background-color:#3b82f61a}.upload-label{background:var(--bg-shell);border:1px dashed var(--border-color);color:var(--text-secondary);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;gap:8px;padding:12px;font-size:13px;transition:all .2s;display:flex}.upload-label:hover{border-color:var(--text-primary);color:var(--text-primary)}.info-box{color:var(--accent);background:#3b82f61a;border:1px solid #3b82f633;border-radius:6px;padding:12px;font-size:13px;line-height:1.5}.info-box.success{color:var(--success);background:#10b9811a;border-color:#10b98133}.color-picker{justify-content:center;gap:8px;display:flex}.color-swatch{cursor:pointer;border:2px solid #0000;border-radius:50%;width:24px;height:24px;transition:transform .1s}.color-swatch:hover{transform:scale(1.1)}.color-swatch.active{box-shadow:0 0 0 2px var(--accent);border-color:#fff}.app-container{background-color:#f5f5f5;flex-direction:column;width:100vw;height:100vh;font-family:sans-serif;display:flex;overflow:hidden}.topbar{color:#fff;background-color:#222;justify-content:space-between;align-items:center;height:60px;padding:0 20px;display:flex}.theme-selector{gap:10px;display:flex}.theme-btn{color:#fff;cursor:pointer;background:0 0;border:1px solid #555;border-radius:4px;padding:8px 16px;transition:all .2s}.theme-btn:hover{background:#444}.theme-btn.active{background:#007bff;border-color:#007bff}.main-content{flex:1;display:flex;overflow:hidden}.sidebar{background-color:#fff;border-right:1px solid #ddd;width:300px;padding:20px;overflow-y:auto}.sidebar-title{margin-top:0;margin-bottom:20px;font-size:1.2rem}.block-btn{color:#333;cursor:pointer;text-align:left;background-color:#f8f9fa;border:1px dashed #ccc;border-radius:6px;width:100%;margin-bottom:10px;padding:15px;font-weight:700;transition:all .2s}.block-btn:hover{background-color:#e9ecef;border-color:#999}.preview-area{flex:1;padding:40px;overflow-y:auto}.preview-canvas{background-color:#fff;border-radius:8px;width:100%;max-width:1200px;min-height:800px;margin:0 auto;overflow:hidden;box-shadow:0 10px 30px #0000001a}.preset-modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.preset-modal-content{color:#333;background:#fff;border-radius:12px;flex-direction:column;width:90vw;max-width:1200px;height:85vh;display:flex;overflow:hidden}.preset-modal-header{border-bottom:1px solid #eee;padding:20px 30px;position:relative}.preset-modal-header h2{color:#111;margin:0 0 10px}.preset-modal-header p{color:#666;margin:0;font-size:14px}.preset-modal-close{cursor:pointer;color:#999;background:0 0;border:none;font-size:24px;position:absolute;top:20px;right:20px}.preset-modal-tabs{background:#f9f9f9;border-bottom:1px solid #eee;gap:10px;padding:15px 30px;display:flex;overflow-x:auto}.preset-tab{cursor:pointer;color:#555;white-space:nowrap;background:#fff;border:1px solid #ddd;border-radius:20px;padding:8px 16px}.preset-tab.active{color:#fff;background:#3b82f6;border-color:#3b82f6}.preset-grid{background:#f0f2f5;flex:1;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;padding:30px;display:grid;overflow-y:auto}.preset-card{cursor:pointer;background:#fff;border-radius:8px;flex-direction:column;gap:10px;padding:20px;transition:transform .2s,box-shadow .2s;display:flex;box-shadow:0 2px 8px #0000000d}.preset-card:hover{transform:translateY(-3px);box-shadow:0 6px 15px #0000001a}.preset-card-header{justify-content:space-between;align-items:center;display:flex}.preset-category{color:#666;background:#eee;border-radius:4px;padding:4px 8px;font-size:12px}.preset-type{color:#fff;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:14px;font-weight:700;display:flex}.type-shu{background:#3b82f6}.type-ha{background:#10b981}.type-ri{background:#8b5cf6}.preset-name{color:#222;margin:0;font-size:20px}.preset-desc{color:#666;flex:1;margin:0;font-size:13px}.preset-colors{gap:8px;margin-top:10px;display:flex}.mode-toggle{background:#333;border-radius:6px;margin-right:20px;padding:4px;display:flex}.mode-btn{color:#aaa;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:6px 16px;font-weight:700}.mode-btn.active{color:#fff;background:#007bff}.annotation-container{pointer-events:none;z-index:100;width:100%;height:100%;position:absolute;top:0;left:0}.preview-area.review-mode .preview-canvas{cursor:crosshair}.preview-area.review-mode .annotation-container{pointer-events:auto}.sticky-note{pointer-events:auto;cursor:move;background:#ffeaa7;border:1px solid #fdcb6e;border-radius:2px;min-width:150px;padding:10px;position:absolute;box-shadow:2px 4px 10px #0000001a}.sticky-note-header{color:#d63031;justify-content:space-between;margin-bottom:5px;font-size:12px;font-weight:700;display:flex}.sticky-note-delete{color:#d63031;cursor:pointer;background:0 0;border:none;font-size:14px}.sticky-note-input{resize:none;color:#2d3436;background:0 0;border:none;outline:none;width:100%;font-family:Zen Kurenaido,Caveat,cursive,sans-serif;font-size:18px;font-weight:700;line-height:1.4}.upload-overlay{text-align:center;background:#f1f2f6;border:2px dashed #ced6e0;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;margin:40px;padding:40px;display:flex}.upload-btn{color:#fff;cursor:pointer;background:#2ed573;border:none;border-radius:4px;margin-top:15px;padding:10px 20px;font-size:16px;font-weight:700}.uploaded-image-preview{width:100%;display:block}.preview-canvas [class^=block-]{box-sizing:border-box;padding-left:max(40px,50% - 500px);padding-right:max(40px,50% - 500px)}.preview-canvas.viewport-mobile [class^=block-],.preview-canvas.viewport-tablet [class^=block-]{padding-left:20px;padding-right:20px}.preview-canvas .block-hero.variation-b{text-align:center;flex-direction:column;padding:80px 20px}.preview-canvas .block-hero.variation-b .hero-image-placeholder{width:100%;max-width:800px;height:400px;margin:0 auto}.preview-canvas .block-hero.variation-c{text-align:left;background-color:var(--text-color);color:#fff;flex-direction:row-reverse;padding:60px 40px}.preview-canvas .block-hero.variation-c .hero-title{color:#fff}.preview-canvas .block-hero.variation-c .hero-image-placeholder{border:4px solid var(--primary-color);background:#fff;width:100%;max-width:500px;height:400px;display:block}.preview-canvas .feature-image-placeholder{display:none}.preview-canvas .block-features.variation-b .features-grid{flex-direction:column;gap:40px;display:flex}.preview-canvas .block-features.variation-b .feature-item{text-align:left;align-items:center;gap:40px;display:flex}.preview-canvas .block-features.variation-b .feature-item:nth-child(2n){flex-direction:row-reverse}.preview-canvas .block-features.variation-b .feature-image-placeholder{background:var(--secondary-color);border-radius:var(--border-radius);flex:1;height:300px;display:block}.preview-canvas .block-features.variation-b .feature-text-content{flex:1}.preview-canvas .block-features.variation-b .feature-icon{margin:0 0 15px}.preview-canvas .features-main-image{display:none}.preview-canvas .block-features.variation-c .section-title{text-align:center;margin-bottom:40px}.preview-canvas .block-features.variation-c .features-content-wrapper{align-items:center;gap:60px;display:flex}.preview-canvas .block-features.variation-c .features-main-image{border-radius:var(--border-radius);border:4px solid var(--primary-color);background:#fff;flex:1;height:400px;display:block}.preview-canvas .block-features.variation-c .features-grid{flex-direction:column;flex:1;gap:30px;display:flex}.preview-canvas .block-features.variation-c .feature-item{text-align:left;box-shadow:none;background:0 0;align-items:center;gap:20px;padding:0;display:flex}.preview-canvas .block-features.variation-c .feature-icon{flex-shrink:0;margin:0}.preview-canvas .block-problem{background-color:var(--secondary-color);padding:80px 40px}.preview-canvas .problem-list{flex-direction:column;gap:15px;max-width:600px;margin:0 auto 40px;display:flex}.preview-canvas .problem-item{border-radius:var(--border-radius);background:#fff;align-items:center;gap:15px;padding:20px;display:flex;box-shadow:0 2px 10px #0000000d}.preview-canvas .problem-check{color:#ef4444;font-size:1.2rem;font-weight:700}.preview-canvas .problem-solution-intro{text-align:center;color:var(--primary-color);font-size:1.5rem;font-weight:700}.preview-canvas .block-logos{text-align:center;border-bottom:1px solid var(--border-color);padding:40px}.preview-canvas .logos-title{color:#666;margin-bottom:20px;font-size:.9rem}.preview-canvas .logos-container{flex-wrap:wrap;justify-content:center;gap:40px;display:flex}.preview-canvas .logo-placeholder{color:#999;letter-spacing:1px;font-size:1.2rem;font-weight:700}.preview-canvas .block-how-it-works{padding:80px 40px}.preview-canvas .steps-container{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.preview-canvas .step-item{text-align:center;flex:1}.preview-canvas .step-number{color:var(--secondary-color);margin-bottom:10px;font-size:3rem;font-weight:700;line-height:1}.preview-canvas .step-title{margin-bottom:10px;font-weight:700}.preview-canvas .step-desc{color:#666;font-size:.9rem}.preview-canvas .step-arrow{color:#ccc;margin-top:30px;font-size:1.5rem}.preview-canvas .block-cta{background-color:var(--primary-color);color:#fff;text-align:center;padding:100px 40px}.preview-canvas .cta-visual-content{display:none}.preview-canvas .cta-title{color:#fff;margin-bottom:20px;font-size:2.5rem}.preview-canvas .cta-desc{max-width:600px;margin:0 auto 40px;font-size:1.1rem}.preview-canvas .cta-actions{justify-content:center;gap:20px;display:flex}.preview-canvas .cta-button{cursor:pointer;border:none;border-radius:30px;padding:15px 40px;font-size:1.1rem;font-weight:700}.preview-canvas .cta-button.primary{color:var(--primary-color);background:#fff}.preview-canvas .cta-button.secondary{color:#fff;background:0 0;border:2px solid #fff}.preview-canvas .block-aboutus,.preview-canvas .block-service,.preview-canvas .block-faq{padding:80px 40px}.preview-canvas .about-content{text-align:center;max-width:800px;margin:0 auto}.preview-canvas .about-stats{justify-content:center;gap:40px;margin-top:40px;display:flex}.preview-canvas .stat-number{color:var(--primary-color);font-size:2.5rem;font-weight:700}.preview-canvas .service-list{grid-template-columns:repeat(3,1fr);gap:30px;display:grid}.preview-canvas .service-card{background:var(--secondary-color);border-radius:var(--border-radius);padding:30px}.preview-canvas .faq-list{max-width:800px;margin:0 auto}.preview-canvas .faq-item{border-bottom:1px solid var(--border-color);cursor:pointer;padding:20px 0}.preview-canvas .faq-question{align-items:center;font-weight:700;display:flex}.preview-canvas .faq-q-icon{color:var(--primary-color);margin-right:15px;font-size:1.2rem}.preview-canvas .faq-toggle{color:#999;margin-left:auto}.preview-canvas .faq-answer{color:#666;padding-top:15px;display:none}.preview-canvas .faq-item.is-open .faq-answer{display:flex}.preview-canvas .faq-a-icon{color:#ef4444;margin-right:15px;font-weight:700}.preview-canvas .block-problem.variation-b .problem-list{grid-template-columns:repeat(3,1fr);gap:20px;max-width:1000px;display:grid}.preview-canvas .block-problem.variation-b .problem-item{text-align:center;flex-direction:column;padding:40px 20px}.preview-canvas .block-problem.variation-b .problem-check{margin-bottom:10px;font-size:2rem}.preview-canvas .block-problem.variation-c .problem-list{justify-content:center;gap:30px;max-width:1100px;margin:0 auto 40px;display:flex}.preview-canvas .block-problem.variation-c .problem-item{text-align:center;border:2px solid var(--border-color);box-shadow:none;background:#fff;border-radius:40px;flex-direction:column;flex:1;justify-content:center;padding:30px 20px;display:flex;position:relative}.preview-canvas .block-problem.variation-c .problem-check{margin-bottom:15px;font-size:1.5rem}.preview-canvas .block-problem.variation-c .problem-item:after{content:"";z-index:2;border:15px solid #0000;border-top-color:#fff;position:absolute;top:100%;left:50%;transform:translate(-50%)}.preview-canvas .block-problem.variation-c .problem-item:before{content:"";border:17px solid #0000;border-top-color:var(--border-color);z-index:1;position:absolute;top:100%;left:50%;transform:translate(-50%)}.preview-canvas .block-logos.variation-b .logos-container{grid-template-columns:repeat(5,1fr);gap:20px;display:grid}.preview-canvas .block-logos.variation-b .logo-placeholder{border:1px solid var(--border-color);border-radius:var(--border-radius);padding:20px;font-size:1rem}.preview-canvas .block-logos.variation-c .logos-container{white-space:nowrap;justify-content:center;gap:80px;padding:20px 0;display:flex;overflow-x:hidden}.preview-canvas .block-how-it-works.variation-b .steps-container{flex-direction:column;align-items:center;max-width:600px;margin:0 auto}.preview-canvas .block-how-it-works.variation-b .step-item{text-align:left;align-items:center;gap:30px;width:100%;display:flex}.preview-canvas .block-how-it-works.variation-b .step-arrow{margin:10px 0;transform:rotate(90deg)}.preview-canvas .block-how-it-works.variation-c .steps-container{grid-template-columns:repeat(3,1fr);gap:30px;display:grid}.preview-canvas .block-how-it-works.variation-c .step-item{border:2px solid var(--border-color);border-radius:var(--border-radius);background:#fff;padding:40px 20px;box-shadow:0 4px 10px #0000000d}.preview-canvas .block-how-it-works.variation-c .step-number{color:var(--primary-color)}.preview-canvas .block-how-it-works.variation-c .step-arrow{display:none}.preview-canvas .block-cta.variation-b .cta-layout-wrapper{align-items:center;gap:60px;max-width:1000px;margin:0 auto;display:flex}.preview-canvas .block-cta.variation-b .cta-text-content{text-align:left;flex:1}.preview-canvas .block-cta.variation-b .cta-desc{margin:0 0 30px}.preview-canvas .block-cta.variation-b .cta-actions{justify-content:flex-start}.preview-canvas .block-cta.variation-b .cta-visual-content{flex:1;display:block}.preview-canvas .block-cta.variation-b .cta-image-placeholder{border-radius:var(--border-radius);background:#fff;height:250px;margin-bottom:20px}.preview-canvas .block-cta.variation-b .cta-form-placeholder{gap:10px;display:flex}.preview-canvas .block-cta.variation-b .cta-input{border:none;border-radius:30px;flex:1;padding:15px;font-size:1rem}.preview-canvas .block-cta.variation-c{background-color:var(--text-color);background-image:linear-gradient(#000c,#000c),url(https://images.unsplash.com/photo-1522071820081-009f0129c71c?auto=format&fit=crop&w=1200&q=80);background-position:50%;background-size:cover}.preview-canvas .block-cta.variation-c .cta-layout-wrapper{align-items:center;gap:40px;max-width:900px;margin:0 auto;display:flex}.preview-canvas .block-cta.variation-c .cta-text-content{text-align:left;flex:50%;min-width:0}.preview-canvas .block-cta.variation-c .cta-actions{display:none}.preview-canvas .block-cta.variation-c .cta-visual-content{border-radius:var(--border-radius);background:#fff;flex:50%;min-width:0;padding:40px;display:block}.preview-canvas .block-cta.variation-c .cta-image-placeholder{display:none}.preview-canvas .block-cta.variation-c .cta-form-placeholder{flex-direction:column;gap:15px;display:flex}.preview-canvas .block-cta.variation-c .cta-input{border:1px solid var(--border-color);border-radius:var(--border-radius);width:100%;padding:15px;font-size:1rem}.preview-canvas .block-cta.variation-c .cta-button{width:100%}.preview-canvas .block-testimonial.variation-b .testimonial-card{align-items:center;gap:30px;display:flex}.preview-canvas .block-testimonial.variation-b .testimonial-author{flex-shrink:0}.preview-canvas .block-testimonial.variation-c .testimonial-card{box-shadow:none;background:0 0;padding:0}.preview-canvas .block-testimonial.variation-c .testimonial-text{background:var(--secondary-color);border-radius:20px;margin-bottom:20px;padding:30px;position:relative}.preview-canvas .block-testimonial.variation-c .testimonial-text:after{content:"";border:15px solid #0000;border-top-color:var(--secondary-color);position:absolute;top:100%;left:40px}.preview-canvas .block-testimonial.variation-c .testimonial-author{padding-left:20px}.preview-canvas .block-aboutus.variation-b .company-overview{max-width:1000px;margin:0 auto}.preview-canvas .block-aboutus.variation-b .overview-layout-wrapper{align-items:flex-start;gap:40px;display:flex}.preview-canvas .block-aboutus.variation-b .overview-table{border-collapse:collapse;text-align:left;flex:1;width:100%}.preview-canvas .block-aboutus.variation-b .overview-table th,.preview-canvas .block-aboutus.variation-b .overview-table td{border-bottom:1px solid var(--border-color);padding:20px}.preview-canvas .block-aboutus.variation-b .overview-table th{background:var(--secondary-color);width:35%;font-weight:700}.preview-canvas .block-aboutus.variation-b .overview-map-placeholder{border:1px solid var(--border-color);border-radius:var(--border-radius);background:#eaeaea;flex:1;justify-content:center;align-items:center;height:350px;display:flex}.preview-canvas .block-aboutus.variation-c .self-introduction{max-width:800px;margin:0 auto}.preview-canvas .block-aboutus.variation-c .profile-card{border-radius:var(--border-radius);background:#fff;align-items:center;gap:40px;padding:40px;display:flex;box-shadow:0 4px 20px #0000000d}.preview-canvas .block-aboutus.variation-c .profile-image{background:var(--secondary-color) url(https://images.unsplash.com/photo-1560250097-0b93528c311a?auto=format&fit=crop&w=300&q=80) center/cover;border-radius:50%;flex-shrink:0;width:150px;height:150px}.preview-canvas .block-aboutus.variation-c .profile-name{margin-bottom:15px;font-size:1.5rem}.preview-canvas .block-aboutus.variation-c .profile-name span{color:#999;margin-left:10px;font-size:.9rem}.preview-canvas .block-aboutus.variation-c .profile-bio{line-height:1.6}.preview-canvas .block-service.variation-b .service-list{flex-direction:column;gap:40px;display:flex}.preview-canvas .block-service.variation-b .service-item{text-align:left;align-items:center;gap:40px;display:flex}.preview-canvas .block-service.variation-b .service-item:nth-child(2n){flex-direction:row-reverse}.preview-canvas .block-service.variation-b .service-icon{background:var(--secondary-color);border-radius:20px;flex-shrink:0;justify-content:center;align-items:center;width:200px;height:200px;font-size:3rem;display:flex}.preview-canvas .block-service.variation-c .service-list{gap:20px;padding-bottom:20px;display:flex;overflow-x:auto}.preview-canvas .block-service.variation-c .service-item{flex:0 0 300px;min-width:300px}.preview-canvas .block-faq.variation-b .faq-list{grid-template-columns:repeat(2,1fr);gap:20px;display:grid}.preview-canvas .block-faq.variation-b .faq-item{border:1px solid var(--border-color)}.preview-canvas .block-faq.variation-b .faq-answer{border-top:1px dashed var(--border-color);margin-top:15px;display:flex}.preview-canvas .block-faq.variation-c{align-items:flex-start;gap:60px;display:flex}.preview-canvas .block-faq.variation-c .section-title{text-align:left;flex-shrink:0;width:300px}.preview-canvas .block-faq.variation-c .faq-list{flex:1}.preview-canvas .block-header{border-bottom:1px solid var(--border-color);background:#fff;justify-content:space-between;align-items:center;padding:20px 40px;display:flex}.preview-canvas .header-logo{color:var(--primary-color);align-items:center;gap:10px;font-size:1.5rem;font-weight:700;display:flex}.preview-canvas .header-nav{gap:30px;display:flex}.preview-canvas .header-nav a{color:var(--text-color);font-weight:700;text-decoration:none}.preview-canvas .header-actions{gap:15px;display:flex}.preview-canvas .header-btn{cursor:pointer;border:2px solid var(--primary-color);border-radius:20px;padding:10px 20px;font-weight:700}.preview-canvas .header-btn.primary{background:var(--primary-color);color:#fff}.preview-canvas .header-btn.secondary{color:var(--primary-color);background:#fff}.preview-canvas .block-footer{color:#fff;background:#111;padding:60px 40px 20px}.preview-canvas .footer-content{flex-wrap:wrap;justify-content:space-between;gap:40px;margin-bottom:40px;display:flex}.preview-canvas .footer-company-info{max-width:300px}.preview-canvas .footer-logo{margin-bottom:15px;font-size:1.5rem;font-weight:700}.preview-canvas .footer-desc{color:#999;margin-bottom:20px;line-height:1.5}.preview-canvas .footer-sns{gap:15px;display:flex}.preview-canvas .sns-icon{background:#333;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-weight:700;display:flex}.preview-canvas .footer-links-group{flex-direction:column;gap:10px;display:flex}.preview-canvas .footer-links-title{margin-bottom:15px;font-size:1.1rem}.preview-canvas .footer-links-group a{color:#999;text-decoration:none}.preview-canvas .footer-bottom{color:#666;border-top:1px solid #333;justify-content:space-between;padding-top:20px;font-size:.9rem;display:flex}.preview-canvas .footer-legal{gap:20px;display:flex}.preview-canvas .footer-legal a{color:#666;text-decoration:none}:root{--bg-color:#fff;--text-color:#333;--primary-color:#0056b3;--secondary-color:#f4f6f9;--border-color:#e0e0e0;--font-family:"Noto Sans JP", "Helvetica Neue", Arial, sans-serif;--border-radius:4px}.preview-canvas{background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-family)}.block-hero{background-color:var(--secondary-color);border-bottom:1px solid var(--border-color);align-items:center;gap:40px;padding:60px;display:flex}.hero-content{flex:1}.hero-title{color:var(--primary-color);margin-bottom:20px;font-size:2.5rem;line-height:1.3}.hero-subtitle{margin-bottom:30px;font-size:1.1rem}.hero-cta{background-color:var(--primary-color);color:#fff;border-radius:var(--border-radius);cursor:pointer;border:none;padding:15px 30px;font-size:1.1rem}.hero-image-placeholder{border-radius:var(--border-radius);background-color:#ccc;background-image:url(https://images.unsplash.com/photo-1497366216548-37526070297c?auto=format&fit=crop&w=600&q=80);background-position:50%;background-size:cover;flex:1;height:300px}.block-features{padding:60px}.section-title{text-align:center;color:var(--primary-color);margin-bottom:40px;font-size:2rem}.features-grid{grid-template-columns:repeat(3,1fr);gap:30px;display:grid}.feature-item{border:1px solid var(--border-color);border-radius:var(--border-radius);text-align:center;background:#fff;padding:30px}.feature-icon{background-color:var(--secondary-color);width:60px;height:60px;color:var(--primary-color);border-radius:50%;justify-content:center;align-items:center;margin:0 auto 20px;font-size:1.5rem;font-weight:700;display:flex}.block-testimonial{background-color:var(--secondary-color);padding:60px}.testimonial-card{border-radius:var(--border-radius);background:#fff;max-width:800px;margin:0 auto;padding:40px;box-shadow:0 4px 6px #0000000d}.testimonial-text{margin-bottom:30px;font-size:1.2rem;font-style:italic}.testimonial-author{align-items:center;gap:15px;display:flex}.author-avatar{background-color:#ddd;background-image:url(https://images.unsplash.com/photo-1560250097-0b93528c311a?auto=format&fit=crop&w=100&q=80);background-size:cover;border-radius:50%;width:50px;height:50px}.author-name{font-weight:700}.author-company{color:#666;font-size:.9rem}.viewport-mobile .block-hero{flex-direction:column;gap:20px;padding:40px 20px}.viewport-mobile .hero-title{font-size:1.8rem}.viewport-mobile .block-features{padding:40px 20px}.viewport-mobile .features-grid{grid-template-columns:1fr}.viewport-mobile .block-testimonial{padding:40px 20px}.viewport-mobile .testimonial-card{padding:20px}.block-hero.variation-b{text-align:center;flex-direction:column;padding:80px 20px}.block-hero.variation-b .hero-image-placeholder{width:100%;max-width:800px;height:400px;margin:0 auto}.block-hero.variation-c{text-align:center;background-color:var(--text-color);color:#fff;background-image:linear-gradient(#0009,#0009),url(https://images.unsplash.com/photo-1497366216548-37526070297c?auto=format&fit=crop&w=1200&q=80);background-position:50%;background-size:cover;flex-direction:column;padding:120px 20px;position:relative}.block-hero.variation-c .hero-title{color:#fff}.block-hero.variation-c .hero-image-placeholder{display:none}.block-features.variation-b .features-grid{flex-direction:column;gap:40px;display:flex}.block-features.variation-b .feature-item{text-align:left;align-items:center;gap:30px;display:flex}.block-features.variation-b .feature-icon{flex-shrink:0;margin:0}.block-problem{background-color:var(--secondary-color);padding:80px 40px}.problem-list{flex-direction:column;gap:15px;max-width:600px;margin:0 auto 40px;display:flex}.problem-item{border-radius:var(--border-radius);background:#fff;align-items:center;gap:15px;padding:20px;display:flex;box-shadow:0 2px 10px #0000000d}.problem-check{color:#ef4444;font-size:1.2rem;font-weight:700}.problem-solution-intro{text-align:center;color:var(--primary-color);font-size:1.5rem;font-weight:700}.block-logos{text-align:center;border-bottom:1px solid var(--border-color);padding:40px}.logos-title{color:#666;margin-bottom:20px;font-size:.9rem}.logos-container{flex-wrap:wrap;justify-content:center;gap:40px;display:flex}.logo-placeholder{color:#999;letter-spacing:1px;font-size:1.2rem;font-weight:700}.block-how-it-works{padding:80px 40px}.steps-container{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.step-item{text-align:center;flex:1}.step-number{color:var(--secondary-color);margin-bottom:10px;font-size:3rem;font-weight:700;line-height:1}.step-title{margin-bottom:10px;font-weight:700}.step-desc{color:#666;font-size:.9rem}.step-arrow{color:#ccc;margin-top:30px;font-size:1.5rem}.block-cta{background-color:var(--primary-color);color:#fff;text-align:center;padding:100px 40px}.cta-title{color:#fff;margin-bottom:20px;font-size:2.5rem}.cta-desc{max-width:600px;margin:0 auto 40px;font-size:1.1rem}.cta-actions{justify-content:center;gap:20px;display:flex}.cta-button{cursor:pointer;border:none;border-radius:30px;padding:15px 40px;font-size:1.1rem;font-weight:700}.cta-button.primary{color:var(--primary-color);background:#fff}.cta-button.secondary{color:#fff;background:0 0;border:2px solid #fff}.block-aboutus,.block-service,.block-faq{padding:80px 40px}.about-content{text-align:center;max-width:800px;margin:0 auto}.about-stats{justify-content:center;gap:40px;margin-top:40px;display:flex}.stat-number{color:var(--primary-color);font-size:2.5rem;font-weight:700}.service-list{grid-template-columns:repeat(3,1fr);gap:30px;display:grid}.service-card{background:var(--secondary-color);border-radius:var(--border-radius);padding:30px}.faq-list{max-width:800px;margin:0 auto}.faq-item{border-bottom:1px solid var(--border-color);cursor:pointer;padding:20px 0}.faq-question{align-items:center;font-weight:700;display:flex}.faq-q-icon{color:var(--primary-color);margin-right:15px;font-size:1.2rem}.faq-toggle{color:#999;margin-left:auto}.faq-answer{color:#666;padding-top:15px;display:none}.faq-item.is-open .faq-answer{display:flex}.faq-a-icon{color:#ef4444;margin-right:15px;font-weight:700}