/* TANOSEA.LAB — 下層ページ共通（お問い合わせ・プライバシーポリシー・見つかりません）
   色と字は site.html の :root[data-pal="A"] と同じ値をそのまま使う（別の見た目を作らない）。 */
:root{
  --navy:#0A1F44; --blue:#1F5FE8; --coral:#FF7A59; --sun:#FFD23F;
  --mint:#7FE0C3; --ink:#4A5A73;
  --bg:#FFFDF5; --card:#FFF9E4; --line:rgba(10,31,68,.12);
}
*{box-sizing:border-box}
body{
  margin:0;background:var(--bg);color:var(--navy);
  font-family:"Zen Kaku Gothic New","Yu Gothic",sans-serif;line-height:1.9;
  display:flex;flex-direction:column;min-height:100dvh;
}
img{max-width:100%;display:block}
a{color:var(--blue)}

header{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 28px;border-bottom:1px solid var(--line);
  background:color-mix(in srgb, var(--bg) 82%, transparent);
  position:sticky;top:0;z-index:20;backdrop-filter:blur(10px);
}
.logo{font-family:Outfit,"Zen Kaku Gothic New",sans-serif;font-weight:800;font-size:20px;letter-spacing:.02em;color:var(--navy);text-decoration:none}
.logo .sea{color:var(--blue)}
.logo small{display:block;font-size:9px;letter-spacing:.28em;color:var(--ink);font-weight:600;margin-top:-2px}
header .back{font-size:14px;font-weight:700;color:var(--navy);text-decoration:none;border:1px solid var(--line);border-radius:999px;padding:8px 16px}
header .back:hover{background:var(--card)}

main{flex:1;width:100%;max-width:760px;margin:0 auto;padding:56px 24px 80px}
h1{font-size:clamp(24px,3vw,34px);font-weight:900;letter-spacing:.02em;margin:0 0 10px}
.lead{font-size:15px;color:var(--ink);margin:0 0 40px}
h2{font-size:17px;font-weight:800;margin:36px 0 10px}
p{font-size:15.5px;margin:0 0 16px}
ul{padding-left:1.2em;margin:0 0 16px}
li{font-size:15.5px;margin-bottom:6px}
.note{font-size:13.5px;color:var(--ink)}

/* フォーム */
.field{margin-bottom:22px}
label{display:block;font-weight:700;font-size:14.5px;margin-bottom:7px}
.req,.opt{font-size:11.5px;font-weight:700;border-radius:999px;padding:2px 9px;margin-left:8px;vertical-align:2px}
.req{background:var(--coral);color:#fff}
.opt{background:var(--card);color:var(--ink);border:1px solid var(--line)}
input,select,textarea{
  width:100%;font-family:inherit;font-size:16px;line-height:1.7;color:var(--navy);
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px 15px;
}
textarea{min-height:170px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--blue);outline-offset:1px;border-color:transparent}
input:user-invalid,textarea:user-invalid{border-color:var(--coral)}
.agree{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin:28px 0 22px}
.agree p{font-size:13.5px;margin:0}
button{
  font-family:inherit;font-weight:800;font-size:16px;color:var(--navy);
  background:var(--sun);border:0;border-radius:999px;padding:16px 40px;cursor:pointer;
  transition:transform .2s, box-shadow .2s;
}
button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 26px rgba(10,31,68,.16)}
button:disabled{background:#E6E9EE;color:#98A3B3;cursor:not-allowed}
.msg{border-radius:14px;padding:16px 18px;margin-bottom:24px;font-size:14.5px}
.msg.wait{background:#FFF1B8;border:1px solid rgba(10,31,68,.14)}
.msg.err{background:#FFE3E3;border:1px solid var(--coral)}
.msg.done{background:#DFF6EE;border:1px solid var(--mint)}
[hidden]{display:none !important}

/* 見つかりません */
.center{text-align:center;padding-top:40px}
.center .big{font-family:Outfit,sans-serif;font-weight:800;font-size:clamp(64px,12vw,120px);color:var(--sun);line-height:1;margin:0 0 8px}
.btn{display:inline-block;font-weight:800;font-size:15.5px;color:var(--navy);background:var(--sun);border-radius:999px;padding:15px 34px;text-decoration:none;margin-top:14px}

footer{border-top:1px solid var(--line);padding:26px 24px 34px;text-align:center}
footer nav{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:center;margin-bottom:14px}
footer nav a{font-size:13.5px;font-weight:700;color:var(--navy);text-decoration:none}
footer nav a:hover{color:var(--blue)}
footer .copy{font-size:12px;color:var(--ink);letter-spacing:.06em}

@media(max-width:640px){
  header{padding:12px 18px}
  main{padding:36px 18px 64px}
}
