body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Hiragino Sans,Noto Sans CJK JP,sans-serif;margin:0;padding:0;background-color:#f9f9f9;color:#333}.navbar{display:flex;align-items:center;position:sticky;top:20px;width:90%;max-width:900px;margin:20px auto 0;padding:15px 25px;box-sizing:border-box;background-color:#fffffff2;backdrop-filter:blur(10px);z-index:2000;border-radius:12px;box-shadow:0 5px 15px #0000000d;height:70px}.logo{display:flex;align-items:center;text-decoration:none;margin-right:auto;height:100%}.logo img{height:40px;width:auto}.nav-links-desktop{display:flex;gap:25px;align-items:center;margin-right:25px}.nav-links-desktop a{color:#555;text-decoration:none;font-weight:500;transition:color .2s}.nav-links-desktop a:hover{color:#007aff}.header-actions{display:flex;align-items:center;gap:15px}.header-actions .header-btn{font-size:.85em;padding:8px 16px;line-height:normal}#hamburger-btn{display:none;background:none;border:none;cursor:pointer;padding:5px;z-index:1002;width:30px;height:24px;position:relative;flex-direction:column;justify-content:space-between;margin-left:10px}#hamburger-btn span{display:block;width:100%;height:2px;background-color:#333;border-radius:2px;transition:all .3s ease-in-out}#hamburger-btn.open span:nth-child(1){transform:translateY(11px) rotate(45deg)}#hamburger-btn.open span:nth-child(2){opacity:0}#hamburger-btn.open span:nth-child(3){transform:translateY(-11px) rotate(-45deg)}#mobile-menu{position:fixed;top:0;left:0;width:100%;height:100%;z-index:2100;visibility:hidden;opacity:0;transition:visibility .3s,opacity .3s}#mobile-menu.open{visibility:visible;opacity:1}.overlay-bg{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#00000080;transition:opacity .3s ease;display:block}.menu-content{position:absolute;top:0;right:-100%;width:80%;max-width:300px;height:100%;background-color:#fff;box-shadow:-4px 0 15px #0000001a;padding:60px 20px 20px;box-sizing:border-box;display:flex;flex-direction:column;transition:right .3s ease}#mobile-menu.open .menu-content{right:0}#close-btn{position:absolute;top:20px;right:20px;background:none;border:none;cursor:pointer;padding:0;font-size:32px;line-height:1;color:#333;width:30px;height:30px;display:flex;align-items:center;justify-content:center}.menu-header{display:none}.menu-nav-links{display:flex;flex-direction:column;gap:25px;margin-top:20px;width:100%;align-items:center}.menu-nav-links a{font-size:1.2em;font-weight:600;text-decoration:none;color:#333}.menu-cta-button{margin-top:auto;padding-top:30px;width:100%}.menu-cta-button .btn-primary{width:100%;text-align:center;box-sizing:border-box}.main-content-card{max-width:800px;width:85%;margin:40px auto;padding:0;box-sizing:border-box;background-color:#fff;box-shadow:0 6px 20px #00000008;border-radius:12px;overflow:hidden}#hero{padding:80px 40px;text-align:center;background:transparent}#hero h1{font-size:clamp(1.5rem,5vw,2.8rem);white-space:nowrap;font-weight:800;margin:0 0 20px;line-height:1.3;color:#111}#hero p{font-size:1.2em;color:#555;margin-bottom:30px;line-height:1.7}.btn{display:inline-block;padding:12px 24px;font-size:1.1em;font-weight:600;text-decoration:none!important;border-radius:8px;transition:transform .2s ease,box-shadow .2s ease}.btn-primary{background-color:#007aff;color:#fff!important;box-shadow:none;border:none}.btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a;background-color:#0069d9}.app-mockup-container{text-align:center;padding:0 20px 60px;background:#fff}.app-mockup-image{max-width:100%;width:800px;border-radius:12px;box-shadow:0 10px 30px #0000001a;border:1px solid #eee}#features{padding:60px 40px}.section-title{text-align:center;font-size:2em;font-weight:700;margin-bottom:40px;color:#333}.features-grid{margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.feature-card{background-color:#fff;border-radius:12px;border:1px solid #f0f0f0;padding:25px;text-align:center}.feature-card .icon{font-size:3em;margin-bottom:15px}.feature-card h3{font-size:1.1em;font-weight:600;margin:0 0 10px}.feature-card p{font-size:.9em;line-height:1.7;color:#666;margin:0}#courses{padding:40px;background-color:#fff}.course-card-container{margin:0 auto}.course-card{background-color:#fff;border-radius:12px;border:1px solid #eee;display:flex;align-items:center;padding:30px 35px;margin-bottom:20px;text-decoration:none;color:#333;transition:transform .2s ease,box-shadow .2s ease}.course-card:hover{transform:translateY(-3px);box-shadow:0 6px 16px #00000014;border-color:#ddd}.course-card .icon{font-size:2.5em;margin-right:25px}.course-card .title{font-size:1.3em;font-weight:600;margin-bottom:5px}.course-card .description{font-size:.9em;color:#666;line-height:1.6}.course-card .arrow{margin-left:auto;font-size:1.5em;color:#c7c7cc}.course-card.coming-soon{background-color:#f9f9f9;color:#b0b0b0;pointer-events:none;cursor:default;border-color:#f0f0f0}.course-card.coming-soon:hover{transform:none;box-shadow:none}.course-card.coming-soon .icon,.course-card.coming-soon .arrow,.course-card.coming-soon .title{color:#b0b0b0}.course-card.coming-soon .description{color:#c7c7c7;font-weight:600}footer{width:90%;max-width:900px;margin:40px auto 0;color:#666;border-top:1px solid #eee;padding:40px 0}.footer-content{display:flex;flex-direction:column;align-items:center;gap:30px}.footer-links{display:flex;gap:25px;flex-wrap:wrap;justify-content:center}.footer-links a{color:#666;text-decoration:none;margin-left:0}.footer-links a:hover{text-decoration:underline}.footer-credit{text-align:center;font-size:.9em;color:#999}.footer-credit p{margin:5px 0;display:flex;align-items:center;justify-content:center;gap:5px}.footer-credit-logo{height:20px;width:auto;max-width:100px;vertical-align:middle}.footer-stepas-logo{height:25px;width:auto;max-width:120px;vertical-align:middle}@media(max-width:768px){.navbar{width:90%;padding:15px 20px}.nav-links-desktop{display:none}#hamburger-btn{display:flex}.main-content-card{width:95%;margin:20px auto;padding:0}#hero{padding:40px 20px 60px}#hero h1{font-size:1.8em}#hero p{font-size:1em}.app-mockup-image{width:100%}.section-title{font-size:1.5em}#features{padding:60px 20px}.features-grid{grid-template-columns:1fr;padding:0}.feature-card h3{font-size:1.1em}#courses{padding:40px 20px}.course-card{padding:20px;flex-direction:column;align-items:flex-start;gap:10px}.course-card .arrow{display:none}.course-card .title{font-size:1.1em}.footer-content{gap:20px;padding:0}.footer-links{flex-direction:column;align-items:center;gap:15px}}.page-title{font-size:2em;font-weight:700;text-align:center;margin:30px 0}.page-subtitle{font-size:clamp(1.2em,5vw,1.5em);font-weight:700;margin:40px 0 15px;padding-bottom:5px;border-bottom:2px solid #f0f0f0}.page-hr{border:none;border-top:1px solid #eee;margin:30px 0}.page-body{font-size:1em;line-height:1.8;color:#333;padding:0 20px}.page-body p{margin:0 0 15px}.page-body h3{font-size:1.2em;font-weight:600;margin:25px 0 10px;padding-left:10px;border-left:4px solid #007aff}.page-body ul{margin:0 0 20px 20px;padding:0}.page-body li{margin-bottom:10px}.page-body a{color:#007aff;text-decoration:none}.page-body a:hover{text-decoration:underline}.spec-table{width:90%;margin:20px auto;border-collapse:collapse;font-size:.95em}.spec-table th,.spec-table td{padding:15px;border-bottom:1px solid #f0f0f0;text-align:left;line-height:1.7}.spec-table th{width:30%;font-weight:600;background-color:#fff}.spec-table td{width:70%;color:#111}.back-link-container{text-align:center;margin-top:30px;padding-bottom:30px}.back-link{font-size:1em;color:#007aff;text-decoration:none;font-weight:500}.back-link:hover{text-decoration:underline}@media(max-width:600px){.page-title{font-size:1.5em}.page-body{padding:0 10px}.spec-table{width:100%}.spec-table th,.spec-table td{display:block;width:100%;box-sizing:border-box}.spec-table th{border-bottom:none;padding-bottom:5px}.spec-table td{padding-top:0}}.help-search-section{background-color:transparent;padding:20px 0;text-align:center;border-radius:0;margin-bottom:30px}.help-search-container{width:90%;max-width:600px;margin:0 auto;display:flex;gap:10px;align-items:center}.search-input-wrapper{position:relative;flex-grow:1}.help-search-input{width:100%;padding:15px 20px 15px 45px;border:1px solid #eee;border-radius:12px;font-size:16px;outline:none;transition:all .3s ease;box-sizing:border-box;background-color:#fff;box-shadow:0 4px 15px #00000008}.help-search-input:focus{border-color:#007aff;box-shadow:0 4px 20px #007aff26}.help-search-icon{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:#888;font-size:18px;pointer-events:none}.search-btn{padding:0 30px;height:52px;background-color:#007aff;color:#fff;border:none;border-radius:12px;font-size:.85em;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap;box-shadow:0 4px 15px #007aff33}.search-btn:hover{background-color:#0069d9;transform:translateY(-2px);box-shadow:0 6px 20px #007aff4d}@media(max-width:600px){.help-search-container{gap:2%}.search-input-wrapper{width:73%;flex:0 0 73%}.search-btn{width:25%;flex:0 0 25%;padding:0;display:flex;justify-content:center;align-items:center;font-size:14px}}.faq-category-title{font-size:1.4em;color:#333;margin:40px 0 20px;padding-bottom:10px;border-bottom:2px solid #eee;display:flex;align-items:center;gap:10px}.faq-container{max-width:800px;margin:0 auto}.faq-item{border:1px solid #eee;border-radius:8px;margin-bottom:10px;background-color:#fff;overflow:hidden;transition:box-shadow .3s}.faq-item:hover{box-shadow:0 2px 8px #0000000d}.faq-question{padding:20px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-weight:600;color:#333;background-color:#fff;transition:background-color .2s}.faq-question:hover{background-color:#f9f9f9}.faq-question:after{content:"+";font-size:20px;color:#007aff;transition:transform .3s}.faq-item.active .faq-question:after{transform:rotate(45deg)}.faq-answer{max-height:0;overflow:hidden;transition:max-height .3s ease-out,padding .3s ease;background-color:#f9f9f9;color:#555;line-height:1.6}.faq-item.active .faq-answer{padding:20px;border-top:1px solid #eee}.help-contact-section{text-align:center;margin-top:60px;padding:40px 20px;background-color:#f0f8ff;border-radius:12px}.help-contact-title{font-size:1.2em;font-weight:700;margin-bottom:10px;color:#333}.help-contact-text{margin-bottom:20px;color:#666}.contact-form{max-width:600px;margin:0 auto;text-align:left}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:600;color:#333}.form-group input,.form-group textarea{width:100%;padding:12px;border:1px solid #ddd;border-radius:8px;font-size:16px;box-sizing:border-box;transition:border-color .3s;font-family:inherit}.form-group input:focus,.form-group textarea:focus{border-color:#007aff;outline:none}.form-submit{text-align:center;margin-top:30px}.form-submit .btn{width:100%;max-width:300px}.form-status{margin-top:20px;text-align:center;font-weight:700;min-height:24px}.form-status.success{color:#28a745}.form-status.error{color:#dc3545}.required-badge{background-color:#ff3b30;color:#fff;font-size:.7em;padding:2px 6px;border-radius:4px;margin-left:8px;vertical-align:middle}.form-group select{width:100%;padding:12px;border:1px solid #ddd;border-radius:8px;font-size:16px;box-sizing:border-box;background-color:#fff;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 15px center;background-size:16px}.form-group select:focus{border-color:#007aff;outline:none}.error-message{color:#ff3b30;font-size:.85em;margin-top:5px;display:none;font-weight:600}.form-group.error input,.form-group.error textarea,.form-group.error select{border-color:#ff3b30;background-color:#fff5f5}.form-group.error .error-message{display:block}.privacy-agreement{text-align:center;font-size:.9em;color:#666;margin:20px 0}.btn.loading{background-color:#ccc!important;color:#666!important;cursor:not-allowed;pointer-events:none}.radio-group{display:flex;gap:20px;margin-top:5px}.radio-group label{display:flex;align-items:center;gap:5px;font-weight:400;cursor:pointer}.radio-group input[type=radio]{width:auto;margin:0}
