:root{
  --color-primary:#F6C6DE;
  --color-secondary:#0D0D0D;
  --color-bg:#FFFFFF;
  --color-bg-alt:#FBF3F7;
  --color-text-main:#111111;
  --color-text-muted:#4A4A4A;
  --color-border:rgba(13,13,13,.15);
}
*{box-sizing:border-box}
body{margin:0;background:var(--color-bg);font-family:"Noto Sans JP","Hiragino Sans",sans-serif;line-break:strict;overflow-wrap:break-word}
h1,h2{text-wrap:balance}
p,li{text-wrap:pretty}
a{color:var(--color-text-main)}
a:hover{color:#E85C3A}

.site-header{background:var(--color-primary);height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 40px}
.brand-mark{font:500 16px/1.3 'Zen Maru Gothic',serif;letter-spacing:.08em;color:var(--color-secondary);text-decoration:none}
.back-link{color:var(--color-secondary);text-decoration:none;font:400 13px 'Noto Sans JP',sans-serif;letter-spacing:.03em}
.back-link:hover{color:#E85C3A}

main{max-width:760px;margin:0 auto;padding:96px 40px 120px}
.page-label{font:500 13px "Quicksand",sans-serif;letter-spacing:.24em;color:var(--color-secondary);margin-bottom:20px}
h1{margin:0 0 16px;font:500 34px/1.5 'Zen Maru Gothic',serif;letter-spacing:.03em;color:#111111}
.updated-at{margin:0 0 56px;font:300 14px 'Noto Sans JP',sans-serif;color:var(--color-text-muted)}
section{margin-bottom:48px}
h2{margin:0 0 20px;font:500 20px/1.6 'Zen Maru Gothic',serif;color:#111111;padding-bottom:12px;border-bottom:1px solid var(--color-border)}
p{margin:0 0 16px;font:300 16px/2 'Noto Sans JP',sans-serif;color:var(--color-text-muted)}
ul{margin:0 0 16px;padding-left:1.4em;font:300 16px/2 'Noto Sans JP',sans-serif;color:var(--color-text-muted)}
li{margin-bottom:4px}
.contact-box{background:var(--color-bg-alt);border-radius:16px;padding:28px 32px;margin-top:8px}
.contact-box p{margin:0}

footer{background:var(--color-secondary);padding:40px}
footer .inner{max-width:1120px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px}
footer a{color:rgba(255,255,255,.6);text-decoration:none;font:400 11px 'Noto Sans JP',sans-serif}
footer a:hover{color:#ffffff}
footer .copyright{color:rgba(255,255,255,.5);font:400 11px 'Quicksand',sans-serif;letter-spacing:.05em}

@media (max-width:680px){
  .site-header{padding:0 24px}
  main{padding:72px 24px 88px}
  h1{font-size:28px}
}