*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#f9fafb;--bg-card:#fff;--bg-sub:#f3f4f6;--bg-accent:#fff7ed;
  --tx:#1f2937;--tx2:#6b7280;--tx3:#9ca3af;
  --bd:#e5e7eb;--bd2:#f3f4f6;
  --ac:#f97316;--ac2:#fff7ed;--ac3:#ea580c;
  --green:#10b981;--blue:#3b82f6;--purple:#8b5cf6;--rose:#f43f5e;--amber:#f59e0b;--teal:#14b8a6;
  --sh:0 1px 3px rgba(0,0,0,.06);--sh2:0 4px 8px rgba(0,0,0,.05);
  --r:12px;--rs:8px
}
html{scroll-behavior:smooth;font-size:16px}
body{
  font-family:'Noto Sans JP','Noto Sans SC','Noto Sans KR','Noto Sans',-apple-system,BlinkMacSystemFont,'Segoe UI','Hiragino Sans',Meiryo,sans-serif;
  background:var(--bg);color:var(--tx);line-height:1.85;
  -webkit-font-smoothing:antialiased;letter-spacing:.01em
}
a{color:var(--ac);text-decoration:none}
a:hover{text-decoration:underline}

/* HEADER */
.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(249,250,251,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--bd);transition:box-shadow .3s}
.site-header.scrolled{box-shadow:var(--sh)}
.header-inner{max-width:1080px;margin:0 auto;padding:0 20px;height:56px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.site-logo{display:flex;align-items:center;gap:7px;font-weight:700;font-size:.95rem;color:var(--tx);white-space:nowrap;text-decoration:none}
.site-logo:hover{text-decoration:none}
.logo-icon{font-size:1.3rem}
.header-right{display:flex;align-items:center;gap:8px}

/* LANG SWITCHER */
.lang-switcher{position:relative}
.lang-btn{padding:5px 10px;border:1px solid var(--bd);border-radius:var(--rs);font-size:.78rem;font-weight:500;cursor:pointer;background:var(--bg-card);color:var(--tx2);font-family:inherit;display:flex;align-items:center;gap:4px;transition:border-color .15s}
.lang-btn:hover{border-color:var(--tx3)}
.lang-dropdown{position:absolute;top:calc(100% + 4px);right:0;background:var(--bg-card);border:1px solid var(--bd);border-radius:var(--rs);box-shadow:var(--sh2);min-width:140px;z-index:1001;display:none;overflow:hidden}
.lang-dropdown.open{display:block}
.lang-option{display:block;width:100%;padding:8px 14px;font-size:.82rem;cursor:pointer;border:none;background:none;text-align:left;font-family:inherit;color:var(--tx);transition:background .1s}
.lang-option:hover{background:var(--bg-sub)}
.lang-option.active{color:var(--ac);font-weight:600}

/* NAV */
.site-nav{display:flex;align-items:center;gap:2px}
.site-nav a{padding:6px 11px;border-radius:var(--rs);font-size:.82rem;font-weight:500;color:var(--tx2);transition:all .15s;white-space:nowrap;text-decoration:none}
.site-nav a:hover{background:var(--bg-sub);color:var(--tx);text-decoration:none}
.nav-toggle{display:none;background:none;border:none;font-size:1.4rem;cursor:pointer;padding:4px;color:var(--tx2)}
@media(max-width:768px){
  .nav-toggle{display:block}
  .site-nav{display:none;position:absolute;top:56px;left:0;right:0;background:var(--bg-card);border-bottom:1px solid var(--bd);padding:10px 20px;flex-direction:column;align-items:stretch;gap:1px;box-shadow:var(--sh2)}
  .site-nav.open{display:flex}
  .site-nav a{padding:10px 12px}
}

/* MAIN */
main{padding-top:56px;min-height:100vh}
.page{animation:fadeIn .3s ease-out}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* CONTAINER */
.container{max-width:1040px;margin:0 auto;padding:0 20px}
.narrow{max-width:760px;margin:0 auto;padding:0 20px}

/* SECTION */
.sec{padding:44px 0}
.sec-h{text-align:center;margin-bottom:36px}
.sec-h .ico{font-size:1.8rem;margin-bottom:6px;display:block}
.sec-h h2{font-size:1.4rem;font-weight:700;margin-bottom:6px}
.sec-h p{font-size:.9rem;color:var(--tx2)}

/* HERO */
.hero{padding:64px 20px 52px;text-align:center;background:linear-gradient(180deg,var(--bg),var(--bg-accent))}
.hero-ico{font-size:3rem;margin-bottom:14px;display:inline-block}
.hero h1{font-size:1.8rem;font-weight:700;line-height:1.5;margin-bottom:14px}
.hero .hl{color:var(--ac)}
.hero .desc{font-size:.95rem;color:var(--tx2);line-height:1.95;margin:0 auto 28px;max-width:540px}
.hero-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:5px;padding:11px 24px;border-radius:50px;font-size:.87rem;font-weight:600;cursor:pointer;transition:all .15s;border:none;font-family:inherit;text-decoration:none}
.btn:hover{text-decoration:none}
.btn-p{background:var(--ac);color:#fff;box-shadow:0 2px 8px rgba(249,115,22,.22)}
.btn-p:hover{background:var(--ac3);transform:translateY(-1px)}
.btn-o{background:transparent;color:var(--ac);border:1.5px solid var(--ac)}
.btn-o:hover{background:var(--ac2)}
.btn-back{display:inline-flex;align-items:center;gap:3px;padding:5px 12px;border-radius:var(--rs);font-size:.84rem;font-weight:500;color:var(--ac);cursor:pointer;margin-bottom:20px;transition:background .15s;background:none;border:none;font-family:inherit;text-decoration:none}
.btn-back:hover{background:var(--ac2);text-decoration:none}

/* CARD */
.card{background:var(--bg-card);border-radius:var(--r);padding:22px;border:1px solid var(--bd2);box-shadow:0 1px 2px rgba(0,0,0,.03);transition:box-shadow .2s,transform .2s}
.card.cl{cursor:pointer}
.card.cl:hover{box-shadow:var(--sh2);transform:translateY(-2px)}
.c-ico{width:44px;height:44px;border-radius:var(--rs);display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin-bottom:10px;flex-shrink:0}
.c-ico.g{background:#ecfdf5}.c-ico.b{background:#eff6ff}.c-ico.o{background:#fff7ed}.c-ico.p{background:#f5f3ff}.c-ico.a{background:#fffbeb}.c-ico.r{background:#fff1f2}.c-ico.t{background:#f0fdfa}
.card h3{font-size:.95rem;font-weight:600;margin-bottom:5px}
.card p,.card .desc{font-size:.875rem;color:var(--tx2);line-height:1.8}

/* GRID */
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}

/* CHIP */
.ch{display:inline-block;padding:3px 9px;border-radius:18px;font-size:.73rem;font-weight:500;background:var(--bg-sub);color:var(--tx2);margin:2px 3px 2px 0}
.ch.g{background:#ecfdf5;color:#047857}.ch.b{background:#eff6ff;color:#1d4ed8}.ch.o{background:#fff7ed;color:#c2410c}.ch.p{background:#f5f3ff;color:#6d28d9}.ch.a{background:#fffbeb;color:#b45309}.ch.r{background:#fff1f2;color:#be123c}.ch.t{background:#f0fdfa;color:#0f766e}

/* TABLE */
.tw{overflow-x:auto;border-radius:var(--r);border:1px solid var(--bd2);background:var(--bg-card)}
.tw table{width:100%;border-collapse:collapse;font-size:.85rem}
.tw th{padding:12px 18px;text-align:left;font-weight:600;font-size:.8rem;background:var(--bg-sub);border-bottom:1px solid var(--bd);white-space:nowrap}
.tw td{padding:11px 18px;border-bottom:1px solid var(--bd2);color:var(--tx2)}
.tw tr:last-child td{border-bottom:none}
.tw .sn{font-weight:600;color:var(--tx);white-space:nowrap}

/* CHECK LIST */
.cl-list{list-style:none;display:grid;gap:9px}
.cl-list li{display:flex;align-items:flex-start;gap:9px;font-size:.875rem;line-height:1.75}
.cl-list li::before{content:"✓";display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:5px;background:#ecfdf5;color:var(--green);font-size:.68rem;font-weight:700;flex-shrink:0;margin-top:3px}

/* NOTICE */
.notice{padding:18px 22px;border-radius:var(--rs);background:var(--ac2);border-left:4px solid var(--ac);font-size:.875rem;line-height:2;color:var(--tx)}
.notice a{font-weight:600}
.warn{padding:14px 18px;border-radius:var(--rs);background:#fef3c7;border-left:4px solid var(--amber);font-size:.82rem;line-height:1.8;color:#92400e;margin-top:8px}

/* DETAIL */
.dh{text-align:center;margin-bottom:32px}
.dh .di{width:68px;height:68px;border-radius:18px;display:inline-flex;align-items:center;justify-content:center;font-size:2rem;margin-bottom:12px}
.dh h1{font-size:1.5rem;font-weight:700;margin-bottom:6px}
.dh .dd{font-size:.9rem;color:var(--tx2)}
.ds{margin-bottom:20px}
.ds h3{font-size:.95rem;font-weight:600;margin-bottom:10px;display:flex;align-items:center;gap:7px}
.db{font-size:.9rem;line-height:2;color:var(--tx)}

/* RELATED */
.rel{margin-top:32px}
.rel h4{font-size:.85rem;font-weight:600;color:var(--tx2);margin-bottom:10px}
.rel-list{display:flex;flex-wrap:wrap;gap:7px}
.rel-item{display:flex;align-items:center;gap:5px;padding:7px 14px;border-radius:var(--rs);background:var(--bg-card);border:1px solid var(--bd2);cursor:pointer;font-size:.8rem;font-weight:500;transition:all .15s;text-decoration:none;color:var(--tx)}
.rel-item:hover{border-color:var(--bd);box-shadow:0 1px 3px rgba(0,0,0,.04);text-decoration:none}

/* INTUITIVE */
.int-card{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center}
.int-ico{width:52px;height:52px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0;background:var(--bg-sub)}
@media(max-width:480px){.int-card{grid-template-columns:1fr;gap:8px}.int-ico{width:42px;height:42px;font-size:1.2rem}}

/* LINK LIST */
.lnk{display:grid;gap:7px}
.lnk a{display:flex;align-items:center;gap:7px;padding:11px 15px;border-radius:var(--rs);background:var(--bg-sub);font-size:.85rem;font-weight:500;color:var(--tx);transition:background .15s;text-decoration:none}
.lnk a:hover{background:var(--bd2);text-decoration:none}

/* FOOTER */
.ft{background:var(--bg-sub);border-top:1px solid var(--bd);padding:44px 20px 24px;text-align:center}
.ft-logo{font-size:1.6rem;margin-bottom:6px}
.ft-title{font-size:.95rem;font-weight:700;margin-bottom:14px;color:var(--tx)}
.ft-links{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-bottom:20px}
.ft-links a{font-size:.8rem;color:var(--tx3);text-decoration:none}
.ft-links a:hover{color:var(--tx2)}
.ft-notice{max-width:620px;margin:0 auto 14px;padding:14px 18px;background:var(--bg-card);border-radius:var(--rs);font-size:.76rem;color:var(--tx3);line-height:1.9}
.ft-notice a{font-weight:600}
.ft-copy{font-size:.7rem;color:var(--tx3)}

/* QUICK LINKS */
.ql{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-top:40px}
.ql .card{padding:16px 18px}
.ql .qi{font-size:1.3rem;margin-bottom:5px}
.ql h4{font-size:.87rem;font-weight:600;margin-bottom:3px}
.ql p{font-size:.76rem;color:var(--tx3)}

/* CAT HEADER */
.cat-h{display:flex;align-items:center;gap:10px;margin-bottom:16px;cursor:pointer;text-decoration:none}
.cat-h:hover h3{color:var(--ac)}
.cat-h:hover{text-decoration:none}
.cat-ico{width:38px;height:38px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:1.05rem;background:var(--bg-sub)}
.cat-h h3{font-size:1rem;font-weight:700;transition:color .15s}
.cat-h p{font-size:.78rem;color:var(--tx3)}

/* PHILOSOPHY */
.phi{display:flex;align-items:center;gap:10px;padding:14px 18px}
.phi .pi{font-size:1.2rem;flex-shrink:0}
.phi .pt{font-size:.84rem;font-weight:500}