*,
*::before,
*::after{box-sizing:border-box}
:root{
--bg:#F4FBFF;--surface:#fff;--soft:#E8F7FF;--primary:#11AEEA;--deep:#1688D8;
--blue:#155A9D;--text:#24384A;--muted:#60758A;--border:rgba(17,174,234,.18);
--gradient:linear-gradient(135deg,#35D7FF 0%,#1688D8 100%);--footer:#073A68;
--shadow:0 18px 45px rgba(21,90,157,.11);--soft-shadow:0 10px 28px rgba(21,90,157,.08);
--r-lg:28px;--r-md:20px;--r-sm:14px;--header:74px}
html{scroll-behavior:smooth}
body{margin:0;min-width:320px;overflow-x:hidden;background:
radial-gradient(circle at 10% 5%,rgba(53,215,255,.13),transparent 25rem),
radial-gradient(circle at 90% 18%,rgba(22,136,216,.08),transparent 28rem),var(--bg);
color:var(--text);font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;line-height:1.72;-webkit-font-smoothing:antialiased}
body.drawer-open{overflow:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
.skip-link{position:fixed;left:18px;top:-60px;z-index:2000;padding:10px 16px;border-radius:10px;background:#073A68;color:#fff;transition:top .2s}
.skip-link:focus{top:12px}
.site-header{position:fixed;inset:0 0 auto;z-index:1000;height:var(--header);background:rgba(255,255,255,.94);border-bottom:1px solid rgba(17,174,234,.12);backdrop-filter:blur(18px);transition:.2s}
.site-header.is-scrolled{background:rgba(255,255,255,.98);box-shadow:0 10px 30px rgba(21,90,157,.1)}
.header-inner{width:min(100% - 32px,1360px);height:100%;margin:auto;display:flex;align-items:center;gap:clamp(14px,1.6vw,24px)}
.brand-logo,.drawer-logo,.footer-logo{flex:0 0 auto}
.brand-logo img{width:clamp(92px,9vw,132px);max-height:44px;object-fit:contain}
.desktop-nav{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:clamp(6px,.82vw,14px);overflow:hidden}
.nav-link{position:relative;flex:0 1 auto;padding:10px clamp(5px,.45vw,8px);color:#34536E;font-size:clamp(12px,.86vw,15px);font-weight:700;line-height:1;white-space:nowrap;border-radius:999px;transition:.2s}
.nav-link:hover,.nav-link.is-active{color:var(--deep);background:var(--soft)}
.header-actions{flex:0 0 auto;display:flex;align-items:center;gap:10px}
.main-btn,.secondary-btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0 22px;border-radius:999px;font-weight:800;white-space:nowrap;transition:.2s}
.main-btn{color:#fff;background:var(--gradient);box-shadow:0 9px 22px rgba(22,136,216,.23)}
.secondary-btn{color:var(--deep);background:#fff;border:1px solid var(--border)}
.main-btn:hover,.secondary-btn:hover{transform:translateY(-2px)}
.menu-toggle{width:46px;height:46px;display:none;align-items:center;justify-content:center;flex-direction:column;gap:5px;border:1px solid var(--border);border-radius:14px;background:#fff;color:var(--blue);cursor:pointer}
.menu-toggle span{width:20px;height:2px;border-radius:999px;background:currentColor}
.drawer-overlay{position:fixed;inset:0;z-index:1090;background:rgba(7,58,104,.34);opacity:0;transition:opacity .22s}
.drawer-overlay.is-visible{opacity:1}
.mobile-drawer{position:fixed;top:0;right:0;z-index:1100;width:min(88vw,380px);height:100dvh;padding:18px;display:flex;flex-direction:column;background:#fff;box-shadow:-18px 0 50px rgba(7,58,104,.16);transform:translateX(104%);transition:transform .24s;overflow-y:auto}
.mobile-drawer.is-open{transform:translateX(0)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:16px;border-bottom:1px solid var(--border)}
.drawer-logo img{width:118px;max-height:42px;object-fit:contain}
.drawer-close{width:42px;height:42px;border:0;border-radius:12px;background:var(--soft);color:var(--blue);font-size:28px;line-height:1;cursor:pointer}
.mobile-nav{display:grid;gap:6px;padding:18px 0}
.mobile-nav .nav-link{width:100%;padding:13px 15px;border-radius:12px;font-size:15px}
.drawer-register{width:100%;margin-top:auto}
main{padding-top:var(--header)}
.container{width:min(100% - 32px,1200px);margin-inline:auto}
.wide-container{width:min(100% - 32px,1360px);margin-inline:auto}
.section-space{margin-top:clamp(46px,7vw,92px)}
.section-pad{padding-block:clamp(54px,7vw,92px)}
.page-hero{position:relative;overflow:hidden;padding:clamp(72px,9vw,116px) 0 clamp(54px,7vw,86px);background:linear-gradient(135deg,rgba(232,247,255,.96),rgba(244,251,255,.88));border-bottom:1px solid var(--border)}
.page-hero::after{content:"";position:absolute;width:300px;height:300px;right:-110px;bottom:-150px;border-radius:50%;border:36px solid rgba(17,174,234,.08)}
.page-hero-inner{position:relative;z-index:1;max-width:840px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;margin-bottom:12px;color:var(--deep);font-size:13px;font-weight:900;letter-spacing:.08em}
.eyebrow::before{content:"";width:22px;height:3px;border-radius:999px;background:var(--gradient)}
h1,h2,h3,p{margin-top:0}
h1{margin-bottom:18px;color:var(--blue);font-size:clamp(34px,5vw,64px);line-height:1.12;letter-spacing:-.03em}
h2{margin-bottom:14px;color:var(--blue);font-size:clamp(26px,3.2vw,42px);line-height:1.22;letter-spacing:-.02em}
h3{margin-bottom:10px;color:var(--blue);font-size:clamp(19px,2vw,24px);line-height:1.35}
p{margin-bottom:14px}
.lead{max-width:780px;margin-bottom:0;color:#48667F;font-size:clamp(17px,1.7vw,21px);line-height:1.8}
.hero-actions,.section-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:24px}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:28px}
.section-head>div{max-width:760px}
.section-head p{margin-bottom:0;color:var(--muted)}
.text-link{display:inline-flex;align-items:center;gap:8px;color:var(--deep);font-weight:800}
.text-link::after{content:"→";transition:transform .2s}
.text-link:hover::after{transform:translateX(3px)}
.hero-carousel{position:relative;width:min(100% - 32px,1360px);margin:clamp(22px,3.2vw,42px) auto 0;overflow:hidden;border:1px solid var(--border);border-radius:clamp(18px,2.5vw,32px);background:var(--soft);box-shadow:var(--shadow)}
.carousel-viewport{overflow:hidden}
.carousel-track{display:flex;transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.carousel-slide{min-width:100%;aspect-ratio:16/6.3;display:flex;align-items:center;justify-content:center;background:var(--soft)}
.carousel-slide img{width:100%;height:100%;object-fit:contain}
.carousel-arrow{position:absolute;top:50%;z-index:3;width:clamp(42px,4.5vw,56px);height:clamp(42px,4.5vw,56px);display:grid;place-items:center;border:1px solid rgba(255,255,255,.72);border-radius:50%;background:rgba(7,58,104,.52);color:#fff;font-size:clamp(28px,3vw,40px);line-height:1;cursor:pointer;transform:translateY(-50%);backdrop-filter:blur(10px)}
.carousel-prev{left:clamp(10px,2vw,24px)}.carousel-next{right:clamp(10px,2vw,24px)}
.carousel-dots{position:absolute;left:50%;bottom:clamp(10px,1.5vw,18px);z-index:4;display:flex;align-items:center;gap:8px;transform:translateX(-50%)}
.carousel-dot{width:9px;height:9px;padding:0;border:1px solid rgba(255,255,255,.88);border-radius:999px;background:rgba(7,58,104,.44);cursor:pointer;transition:.2s}
.carousel-dot.is-active{width:28px;background:#fff}
.intro-panel{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:clamp(26px,4vw,58px);align-items:center;padding:clamp(28px,4vw,54px);border:1px solid var(--border);border-radius:var(--r-lg);background:linear-gradient(135deg,#fff,#F4FBFF);box-shadow:var(--soft-shadow)}
.intro-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.intro-point{padding:18px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--soft)}
.intro-point strong{display:block;margin-bottom:5px;color:var(--deep);font-size:18px}
.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.card-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.card-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.info-card,.quick-card,.feedback-card,.faq-item,.notice-card{border:1px solid var(--border);border-radius:var(--r-md);background:#fff;box-shadow:var(--soft-shadow)}
.info-card,.quick-card,.notice-card{padding:clamp(22px,2.8vw,30px)}
.info-card p,.quick-card p,.notice-card p{color:var(--muted)}
.quick-card{min-height:220px;display:flex;flex-direction:column}
.quick-card .text-link{margin-top:auto}
.quick-index{width:42px;height:42px;display:grid;place-items:center;margin-bottom:20px;border-radius:14px;background:var(--soft);color:var(--deep);font-weight:900}
.feature-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);gap:clamp(28px,5vw,70px);align-items:center}
.feature-split.reverse .feature-media{order:-1}
.feature-copy p{color:var(--muted)}
.feature-list{display:grid;gap:12px;margin:22px 0 0;padding:0;list-style:none}
.feature-list li{position:relative;padding-left:28px;color:#3D5C76}
.feature-list li::before{content:"✓";position:absolute;left:0;top:0;width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:var(--soft);color:var(--deep);font-size:12px;font-weight:900}
.feature-media{overflow:hidden;min-height:300px;display:flex;align-items:center;justify-content:center;padding:clamp(18px,3vw,34px);border:1px solid var(--border);border-radius:var(--r-lg);background:linear-gradient(145deg,var(--soft),#fff);box-shadow:var(--shadow)}
.feature-media img{width:100%;max-height:470px;object-fit:contain}
.soft-section{padding:clamp(44px,6vw,76px);border:1px solid var(--border);border-radius:var(--r-lg);background:linear-gradient(145deg,rgba(232,247,255,.85),rgba(255,255,255,.96))}
.feedback-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.feedback-card{padding:24px}.feedback-card p{margin-bottom:0;color:#506B82}
.feedback-role{display:inline-flex;margin-bottom:14px;padding:6px 10px;border-radius:999px;background:var(--soft);color:var(--deep);font-size:13px;font-weight:900}
.notice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.step-list{counter-reset:steps;display:grid;gap:14px;margin:0;padding:0;list-style:none}
.step-list li{counter-increment:steps;position:relative;min-height:52px;padding:14px 16px 14px 62px;border:1px solid var(--border);border-radius:14px;background:#fff}
.step-list li::before{content:counter(steps);position:absolute;left:14px;top:12px;width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:var(--gradient);color:#fff;font-weight:900}
.faq-list{display:grid;gap:14px}
.faq-item{overflow:hidden}
.faq-item summary{position:relative;padding:20px 56px 20px 22px;color:var(--blue);font-weight:900;cursor:pointer;list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";position:absolute;right:22px;top:50%;color:var(--deep);font-size:26px;transform:translateY(-50%)}
.faq-item[open] summary::after{content:"−"}
.faq-answer{padding:0 22px 22px;color:var(--muted)}
.legal-reminder{width:min(100% - 32px,1200px);margin-inline:auto;margin-bottom:clamp(52px,7vw,94px);display:flex;align-items:center;justify-content:space-between;gap:28px;padding:clamp(28px,4vw,46px);border-radius:var(--r-lg);background:linear-gradient(135deg,#0D5D95,#073A68);color:#EAF8FF;box-shadow:0 24px 55px rgba(7,58,104,.22)}
.legal-reminder h2,.legal-reminder p{color:#fff}.legal-reminder p{max-width:820px;margin-bottom:0;opacity:.88}.legal-reminder .eyebrow{color:#9BE9FF}.light-link{flex:0 0 auto;color:#fff}
.tag-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.tag{padding:8px 13px;border-radius:999px;background:var(--soft);color:var(--deep);font-size:14px;font-weight:800}
.contact-panel{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.service-box{padding:clamp(24px,3vw,34px);border:1px solid var(--border);border-radius:var(--r-md);background:#fff;box-shadow:var(--soft-shadow)}
.site-footer{background:var(--footer);color:#EAF8FF}
.footer-inner{width:min(100% - 32px,1200px);margin-inline:auto;display:grid;grid-template-columns:minmax(260px,1fr) 2fr;gap:clamp(40px,7vw,96px);padding:68px 0 46px}
.footer-logo img{width:126px;max-height:44px;object-fit:contain;filter:brightness(0) invert(1)}
.footer-brand p{max-width:430px;margin-top:18px;margin-bottom:0;color:rgba(234,248,255,.74)}
.footer-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.footer-links h2{margin-bottom:16px;color:#fff;font-size:17px}.footer-links a{display:block;margin:9px 0;color:rgba(234,248,255,.76)}.footer-links a:hover{color:#fff}
.footer-bottom{width:min(100% - 32px,1200px);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 0 30px;border-top:1px solid rgba(234,248,255,.13);color:rgba(234,248,255,.66);font-size:13px}.footer-bottom p{margin-bottom:0}
@media(max-width:1179px){.desktop-nav{display:none}.menu-toggle{display:flex}.header-inner{justify-content:space-between}}
@media(max-width:920px){.card-grid,.card-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-split,.intro-panel,.contact-panel{grid-template-columns:1fr}.feature-split.reverse .feature-media{order:0}.feedback-grid{grid-template-columns:1fr 1fr}.footer-inner{grid-template-columns:1fr}}
@media(max-width:700px){
:root{--header:66px}.header-inner,.container,.wide-container,.hero-carousel,.legal-reminder,.footer-inner,.footer-bottom{width:min(100% - 24px,1200px)}
.brand-logo img{width:98px}.header-actions .main-btn{min-height:40px;padding-inline:17px;font-size:14px}.menu-toggle{width:42px;height:42px}
.carousel-slide{aspect-ratio:16/8.6}.carousel-arrow{width:40px;height:40px;font-size:30px}.carousel-prev{left:8px}.carousel-next{right:8px}
.section-head{align-items:flex-start;flex-direction:column}.card-grid,.card-grid.two,.card-grid.four,.feedback-grid,.notice-grid,.intro-points{grid-template-columns:1fr}
.soft-section{padding:28px 20px;border-radius:22px}.feature-media{min-height:220px}.legal-reminder{align-items:flex-start;flex-direction:column}
.footer-links{grid-template-columns:1fr 1fr}.footer-bottom{align-items:flex-start;flex-direction:column}}
@media(max-width:460px){.header-actions{gap:7px}.header-actions .main-btn{padding-inline:14px}.page-hero{padding-top:56px}.footer-links{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;transition-duration:.001ms!important}}