@charset "UTF-8";
/* =========================================================
   プライバシーポリシー・404　PC版（末尾にスマホ版）
   1rem = デザイン上の10px（1440px幅基準）。共通パーツは style.css
   ========================================================= */
:root { --beige: #f6f4ed; --line: #d9d3c7; --sub: #8a8378; }

/* ---------- KV（下層共通の帯） ---------- */
.lg-hero { height: 43.7rem; }
.lg-hero__img { position: absolute; left: 0; top: 7.7rem; width: 144rem; height: 36rem; overflow: hidden; }
.lg-hero__img img { width: 100%; height: 100%; object-fit: cover; }
.lg-hero__ttl { position: absolute; left: 0; top: 23.92rem; width: 144rem; text-align: center; font-size: 3.4rem; line-height: 3.4rem; font-weight: 700; }

/* ---------- プライバシーポリシー ---------- */
.pp { width: 96rem; margin: 0 auto; padding: 4.8rem 0 14rem; }
.pp-en { font-family: "Barlow", sans-serif; font-weight: 600; font-size: 12rem; line-height: 1; letter-spacing: .04em; color: transparent; -webkit-text-stroke: .25rem #e0d2b8; white-space: nowrap; }
.pp-ttl { margin-top: -3rem; font-size: 3.2rem; line-height: 4.8rem; font-weight: 700; }
.pp-lead { margin-top: 3.2rem; font-size: 1.8rem; line-height: 3.4rem; }
.pp-sec { margin-top: 6.4rem; }
.pp-sec__ttl { display: flex; align-items: baseline; gap: 1.6rem; padding-bottom: 1.6rem; border-bottom: .3rem solid var(--ink); font-size: 2.4rem; line-height: 3.6rem; font-weight: 700; }
.pp-sec__ttl b { font-family: "Barlow", sans-serif; font-size: 2.8rem; color: var(--teal); }
.pp-sec__body { margin-top: 2.4rem; font-size: 1.7rem; line-height: 3.2rem; }
.pp-sec__body > * + * { margin-top: 1.6rem; }
.pp-sec__body ol { list-style: none; counter-reset: pp; padding: 2.4rem 3.2rem; border-radius: 1.2rem; background: var(--beige); }
.pp-sec__body ol > li { position: relative; padding-left: 3.6rem; counter-increment: pp; }
.pp-sec__body ol > li + li { margin-top: 1rem; }
.pp-sec__body ol > li::before { content: counter(pp); position: absolute; left: 0; top: .5rem; display: flex; align-items: center; justify-content: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: var(--teal); color: var(--white); font-family: "Barlow", sans-serif; font-size: 1.4rem; font-weight: 700; line-height: 1; }
.pp-sec__body ul { list-style: none; margin-top: .8rem; }
.pp-sec__body ul li { position: relative; padding-left: 1.6rem; }
.pp-sec__body ul li::before { content: ""; position: absolute; left: .2rem; top: 1.4rem; width: .6rem; height: .6rem; border-radius: 50%; background: var(--sub); }
.pp-dl div { display: grid; grid-template-columns: 18rem 1fr; gap: 2.4rem; padding: 1.6rem 0; border-bottom: .15rem solid var(--line); }
.pp-dl dt { font-weight: 700; color: var(--teal); }
.pp-contact { padding: 2.8rem 3.2rem; border: .3rem solid var(--ink); border-radius: 1.2rem; }
.pp-contact__ttl { font-weight: 700; }
.pp-contact dl { margin-top: 1.2rem; }
.pp-contact dl div { display: flex; gap: 2.4rem; }
.pp-contact dl div + div { margin-top: .4rem; }
.pp-contact dt { flex: none; width: 14rem; color: var(--sub); }
/* メールアドレスも画像（電話番号と同じしくみ） */
.u-mail { display: inline-block; width: 11.425em; height: 1.4em; vertical-align: -.32em; background: currentColor; -webkit-mask: url(../img/common/mail.png) left center / auto 100% no-repeat; mask: url(../img/common/mail.png) left center / auto 100% no-repeat; }
.pp-dates { margin-top: 6.4rem; font-size: 1.5rem; line-height: 2.6rem; color: var(--sub); text-align: right; }
.pp-end { margin-top: 1.2rem; text-align: right; font-size: 1.7rem; }

/* ---------- 404 ---------- */
/* 背景は横幅いっぱい。上の空に文章、下の丘を人形が歩き回る */
.nf { position: relative; height: 88rem; overflow: hidden; background: #e9edf0; }
.nf-scene { position: absolute; left: 0; right: 0; top: 7.7rem; bottom: 0; }
.nf-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 100%; }
.nf-walker { position: absolute; left: 0; top: 0; width: 0; height: 0; will-change: transform; }
.nf-person { position: absolute; left: -3.4rem; bottom: 0; width: 6.8rem; height: auto; transform-origin: 50% 100%; filter: drop-shadow(0 .6rem .5rem rgba(40, 60, 30, .28)); }
.nf-box { position: absolute; left: 50%; top: 12rem; z-index: 1; width: 76rem; margin-left: -38rem; padding: 3.2rem 4rem 3.6rem; border-radius: 2.4rem; text-align: center; background: rgba(255, 255, 255, .25); -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); } /* TOP「DEGORAができること」の枠と同じ半透明 */
.nf-num { display: flex; justify-content: center; font-family: "Barlow", sans-serif; font-weight: 600; font-size: 14rem; line-height: .9; letter-spacing: .02em; color: transparent; -webkit-text-stroke: .3rem #b9a987; }
.nf-num span { display: inline-block; }
.nf-ttl { margin-top: 1.6rem; font-size: 3.2rem; line-height: 4.8rem; font-weight: 700; white-space: nowrap; }
.nf-txt { margin-top: 1.2rem; font-size: 1.8rem; line-height: 3rem; }
.nf .nf-btn { position: relative; left: auto; top: auto; margin: 2.8rem auto 0; }
/* 「TOPへ戻る」も半透明（TOP「DEGORAができること」の枠と同じ白25%＋ぼかし） */
.nf .nf-btn { background: rgba(255, 255, 255, .25); -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); }
.nf-links { display: flex; flex-wrap: nowrap; justify-content: center; gap: 1rem 2rem; margin-top: 2.8rem; font-size: 1.6rem; line-height: 2.6rem; white-space: nowrap; }
.nf-links a { text-decoration: underline; text-underline-offset: .4rem; text-decoration-color: var(--ink); transition: color .3s; }
@media (hover: hover) { .nf-links a:hover { color: var(--teal); } }

/* =========================================================
   スマホ版（767px以下・375px幅基準）
   ========================================================= */
@media (max-width: 767px) {
  .lg-hero { height: 18rem; }
  .lg-hero__img { top: 6rem; width: 37.5rem; height: 12rem; }
  .lg-hero__img img { object-position: 18% 50%; }
  .lg-hero__ttl { top: 10.4rem; width: 37.5rem; font-size: 2.2rem; line-height: 2.2rem; }

  .pp { width: auto; margin: 0 2rem; padding: 3.6rem 0 6rem; }
  .pp-en { font-size: 4.8rem; -webkit-text-stroke-width: .12rem; white-space: normal; }
  .pp-ttl { margin-top: -1.2rem; font-size: 1.9rem; line-height: 2.8rem; }
  .pp-lead { margin-top: 2rem; font-size: 1.35rem; line-height: 2.4rem; }
  .pp-sec { margin-top: 4rem; }
  .pp-sec__ttl { gap: 1rem; padding-bottom: 1rem; border-bottom-width: .2rem; font-size: 1.6rem; line-height: 2.4rem; }
  .pp-sec__ttl b { font-size: 1.8rem; }
  .pp-sec__body { margin-top: 1.6rem; font-size: 1.35rem; line-height: 2.4rem; }
  .pp-sec__body > * + * { margin-top: 1.2rem; }
  .pp-sec__body ol { padding: 1.6rem; border-radius: .8rem; }
  .pp-sec__body ol > li { padding-left: 2.8rem; }
  .pp-sec__body ol > li::before { top: .3rem; width: 1.9rem; height: 1.9rem; font-size: 1.1rem; }
  .pp-sec__body ul li::before { top: 1rem; width: .5rem; height: .5rem; }
  .pp-dl div { grid-template-columns: 1fr; gap: .4rem; padding: 1.2rem 0; }
  .pp-contact { padding: 1.8rem 1.6rem; border-width: .2rem; border-radius: .8rem; }
  .pp-contact dl div { flex-direction: column; gap: 0; }
  .pp-contact dl div + div { margin-top: .8rem; }
  .pp-contact dt { width: auto; font-size: 1.2rem; }
  .pp-dates { margin-top: 4rem; font-size: 1.2rem; line-height: 2rem; }
  .pp-end { font-size: 1.35rem; }

  .nf { height: auto; padding: 0 0 4rem; background: var(--white); }
  .nf-scene { position: relative; top: auto; bottom: auto; height: 34rem; margin-top: 6rem; }
  .nf-bg { object-position: 55% 100%; }
  .nf-person { left: -2.2rem; width: 4.4rem; }
  .nf-box { position: relative; left: auto; top: auto; width: auto; margin: -3.2rem 1.6rem 0; padding: 2.4rem 1.6rem 2.8rem; border-radius: 1.6rem; background: rgba(255, 255, 255, .6); }
  .nf-num { font-size: 8rem; -webkit-text-stroke-width: .15rem; }
  .nf-ttl { margin-top: 1.2rem; font-size: 1.9rem; line-height: 3rem; }
  .nf-txt { margin-top: 1rem; font-size: 1.3rem; line-height: 2.3rem; }
  .nf .nf-btn { margin-top: 2.4rem; }
  .nf-links { flex-wrap: wrap; white-space: normal; gap: .6rem 1.6rem; margin-top: 2.4rem; font-size: 1.25rem; line-height: 2rem; }
}