/* /assets/css/legal.css
   規約・プライバシー・特商法・お問い合わせ等のテキスト系ページ用。
   Tailwind CDN の代替として、これらのページで実際に使っている
   ユーティリティクラスだけを実装（ブランド配色に調整）。 */

/* ---- base reset ---- */
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0;font-family:'Zen Kaku Gothic New','Hiragino Sans','Noto Sans JP',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;line-height:1.6;color:#0f172a;background:#f8fafc;}
h1,h2,h3,p,dl,dd,figure{margin:0;}
a{color:inherit;}
img{max-width:100%;height:auto;}
button{font-family:inherit;}

/* ---- display / layout ---- */
.block{display:block;} .inline-block{display:inline-block;} .inline-flex{display:inline-flex;}
.hidden{display:none;} .flex{display:flex;} .grid{display:grid;}
.flex-col{flex-direction:column;} .flex-wrap{flex-wrap:wrap;}
.items-center{align-items:center;} .items-start{align-items:flex-start;} .items-end{align-items:flex-end;}
.justify-center{justify-content:center;} .justify-between{justify-content:space-between;}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr));}
.gap-2{gap:.5rem;} .gap-3{gap:.75rem;} .gap-4{gap:1rem;}

/* ---- sizing ---- */
.mx-auto{margin-left:auto;margin-right:auto;}
.max-w-4xl{max-width:56rem;}
.w-full{width:100%;} .w-4{width:1rem;} .h-4{height:1rem;}

/* ---- spacing ---- */
.p-4{padding:1rem;} .p-5{padding:1.25rem;} .p-6{padding:1.5rem;}
.px-3{padding-left:.75rem;padding-right:.75rem;} .px-4{padding-left:1rem;padding-right:1rem;} .px-6{padding-left:1.5rem;padding-right:1.5rem;}
.py-2{padding-top:.5rem;padding-bottom:.5rem;} .py-3{padding-top:.75rem;padding-bottom:.75rem;} .py-10{padding-top:2.5rem;padding-bottom:2.5rem;}
.mt-1{margin-top:.25rem;} .mt-2{margin-top:.5rem;} .mt-3{margin-top:.75rem;} .mt-4{margin-top:1rem;} .mt-6{margin-top:1.5rem;}
.mb-3{margin-bottom:.75rem;} .mr-2{margin-right:.5rem;}
.space-y-2>*+*{margin-top:.5rem;} .space-y-4>*+*{margin-top:1rem;} .space-y-5>*+*{margin-top:1.25rem;}

/* ---- radius / border ---- */
.rounded{border-radius:.25rem;} .rounded-xl{border-radius:.75rem;} .rounded-2xl{border-radius:1rem;} .rounded-3xl{border-radius:1.5rem;} .rounded-full{border-radius:999px;}
.border{border-width:1px;border-style:solid;border-color:#e5e7eb;}
.border-slate-200{border-color:#e2e8f0;} .border-slate-300{border-color:#cbd5e1;}

/* ---- background ---- */
.bg-white{background:#fff;} .bg-slate-50{background:#f8fafc;}
.bg-emerald-600{background:#16160F;} /* ボタン等：ブランドのチャコール（白文字が乗る） */

/* ---- typography ---- */
.text-xs{font-size:12px;} .text-sm{font-size:14px;} .text-lg{font-size:18px;} .text-2xl{font-size:24px;line-height:1.25;}
.font-medium{font-weight:500;} .font-semibold{font-weight:600;} .font-bold{font-weight:700;}
.leading-relaxed{line-height:1.75;}
.tracking-tight{letter-spacing:-.02em;}
.text-white{color:#fff;}
.text-slate-500{color:#64748b;} .text-slate-600{color:#475569;} .text-slate-700{color:#334155;} .text-slate-900{color:#0f172a;}
.text-emerald-600,.text-emerald-700{color:#5C8A28;} /* ブランドの読みやすい緑 */

/* ---- misc ---- */
.outline-none{outline:none;}
.-ml-1{margin-left:-.25rem;}
@keyframes spin{to{transform:rotate(360deg);}}
.animate-spin{animation:spin 1s linear infinite;}
.transition{transition:all .15s ease;}
.opacity-25{opacity:.25;} .opacity-75{opacity:.75;}

/* ---- states ---- */
.hover\:bg-slate-50:hover{background:#f8fafc;}
.hover\:bg-emerald-700:hover{background:#23231A;}
.hover\:underline:hover{text-decoration:underline;}
.hover\:text-slate-900:hover{color:#0f172a;}
.focus\:ring-2:focus{box-shadow:0 0 0 2px rgba(198,255,61,.55);}
.focus\:ring-emerald-200:focus{box-shadow:0 0 0 3px #DCEBBE;}
a.hover\:underline,a.hover\:text-slate-900{text-decoration:none;}

/* ---- sm: (>=640px) ---- */
@media (min-width:640px){
  .sm\:flex-row{flex-direction:row;}
  .sm\:items-center{align-items:center;}
  .sm\:gap-3{gap:.75rem;}
  .sm\:w-28{width:7rem;}
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
}

/* ---- md: (>=768px) ---- */
@media (min-width:768px){
  .md\:p-8{padding:2rem;}
  .md\:flex-row{flex-direction:row;}
  .md\:items-end{align-items:flex-end;}
  .md\:justify-between{justify-content:space-between;}
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
  .md\:text-xl{font-size:20px;}
  .md\:text-3xl{font-size:30px;line-height:1.2;}
}

/* 入力欄の見た目（Tailwind preflight相当の最低限） */
input,textarea,select{font-family:inherit;font-size:15px;color:#0f172a;background:#fff;}
