/* 下層ページ（プライバシー・利用規約・サポート）共通。
   会社サイト index.html と同じ配色・世界観に揃える。 */
:root{
  color-scheme: dark;
  --bg:#03070d;
  --panel:rgba(13,19,29,.72);
  --panel-2:rgba(23,32,45,.5);
  --line:rgba(255,255,255,.10);
  --line-soft:rgba(255,255,255,.055);
  --text:#f5f7fb;
  --muted:#9aa6b5;
  --faint:rgba(245,247,251,.42);
  --blue:#40bdf8;
  --mint:#67e8c9;
  --r:18px;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",YuGothic,Meiryo,sans-serif;
  line-height:1.95; font-size:16px;
  -webkit-font-smoothing:antialiased; -webkit-text-size-adjust:100%;
}
.sky{position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden}
.aurora{
  position:absolute; left:50%; top:-40vmin; width:120vmax; height:120vmax;
  transform:translateX(-50%);
  background:
    radial-gradient(closest-side, rgba(64,189,248,.08), transparent 70%),
    radial-gradient(closest-side, rgba(103,232,201,.05), transparent 72%);
  background-position:38% 42%, 66% 58%;
  background-repeat:no-repeat;
  background-size:62% 62%, 55% 55%;
  filter:blur(30px);
}
header,main,footer{position:relative; z-index:1}
.wrap{width:min(760px, calc(100% - 44px)); margin:0 auto}

header{
  position:sticky; top:0; z-index:30;
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  background:linear-gradient(to bottom, rgba(3,7,13,.9), rgba(3,7,13,.5));
  border-bottom:1px solid var(--line-soft);
}
.bar{display:flex; align-items:center; justify-content:space-between; padding:15px 0; gap:16px}
.brand{display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--text)}
.mark{
  width:22px; height:22px; border-radius:50%; flex:none;
  background:radial-gradient(circle at 32% 30%, #cbeeff, #40bdf8 42%, #14507a 78%, #071a2a);
  box-shadow:0 0 0 1px rgba(64,189,248,.34), 0 0 18px rgba(64,189,248,.3);
}
.brand b{font-size:14px; font-weight:700; letter-spacing:.05em}
.back{color:var(--muted); text-decoration:none; font-size:13px; transition:color .3s var(--ease)}
.back:hover{color:var(--text)}

main{padding:56px 0 40px}
h1{font-size:clamp(23px,3.4vw,31px); margin:0 0 10px; font-weight:700; letter-spacing:.01em}
.updated{color:var(--faint); font-size:13px; margin:0 0 40px}
h2{
  font-size:18px; margin:44px 0 14px; font-weight:700;
  padding-top:26px; border-top:1px solid var(--line-soft);
}
h2:first-of-type{border-top:0; padding-top:0; margin-top:34px}
h3{font-size:15.5px; margin:26px 0 8px; font-weight:700}
p{margin:0 0 15px; color:var(--muted); font-size:15px}
p.lead{color:var(--text)}
ul,ol{margin:0 0 16px; padding-left:1.4em; color:var(--muted); font-size:15px}
li{margin:0 0 7px}
a{color:var(--blue); text-decoration:none}
a:hover{text-decoration:underline}
strong{color:var(--text); font-weight:700}

.card{
  border:1px solid var(--line-soft); border-radius:var(--r);
  background:var(--panel);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  padding:24px 28px; margin:0 0 18px;
}
.card h3{margin-top:0}
.card p:last-child{margin-bottom:0}

table{border-collapse:collapse; width:100%; font-size:14.5px; margin:0 0 18px}
th,td{text-align:left; padding:13px 0; border-bottom:1px solid var(--line-soft); vertical-align:top}
th{width:34%; font-weight:600; color:var(--faint); padding-right:16px; font-size:13.5px}
td{color:var(--muted)}
@media (max-width:560px){
  th,td{display:block; width:100%; border:none; padding:2px 0}
  th{padding-top:14px}
  td{padding-bottom:13px; border-bottom:1px solid var(--line-soft)}
}

.mailbtn{
  display:inline-flex; align-items:center; gap:9px;
  padding:12px 24px; border-radius:999px; font-size:14.5px; font-weight:700;
  text-decoration:none; color:var(--text);
  background:linear-gradient(120deg, rgba(64,189,248,.2), rgba(103,232,201,.16));
  border:1px solid rgba(64,189,248,.45);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.mailbtn:hover{transform:translateY(-2px); box-shadow:0 10px 30px rgba(64,189,248,.15); text-decoration:none}

footer{
  border-top:1px solid var(--line-soft); padding:28px 0 44px;
  color:var(--faint); font-size:12.5px;
}
footer .wrap{display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap}
footer a{color:var(--faint)}

@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important}
  html{scroll-behavior:auto}
}