@import url('./fonts.css');

/* ============================================================
   真似元: トゥモローゲート(tomorrowgate.co.jp/recruit/)
   観察: 白基調・黒テキスト rgb(29,29,29)・Noto Sans JP
        ナビ: 左 TOMORROWGATE ロゴ、右 Adult/Child タブ + Download/Contact 黒ボタン
        ヒーロー: 「Recruit」巨大 + サブ「採用情報」+ h2 + リード
        2列×3 カードグリッド(各カード ● + タイトル + 説明)
        集合写真(白背景)+ Download/Contact 2列ブロック
        黒フッター
   ============================================================ */
:root{
  --p01-bg:        #FFFFFF;
  --p01-ink:       #1D1D1D;
  --p01-ink-soft:  #555555;
  --p01-line:      #E5E5E5;
  --p01-dark:      #1A1A1A;
  --p01-paper:     #FAFAFA;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{background:var(--p01-bg);color:var(--p01-ink);font-family:var(--p01-font-body);font-weight:400;font-size:14px;line-height:1.85;-webkit-font-smoothing:antialiased}
body{min-height:100vh;position:relative;overflow-x:hidden}
main,header,footer,section,nav{position:relative;z-index:2}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}

/* NAV: 左 TOMORROWGATE 文字ロゴ、右 Adult/Child タブ + Download/Contact 黒ボタン */
.p01-nav{position:sticky;top:0;z-index:30;background:var(--p01-bg);padding:20px 36px;display:grid;grid-template-columns:auto 1fr auto auto;gap:0;align-items:center;border-bottom:1px solid transparent}
.p01-nav__brand{font-family:var(--p01-font-display);font-weight:900;font-size:17px;letter-spacing:.06em;color:var(--p01-ink);text-transform:uppercase}
.p01-nav__tabs{justify-self:end;display:flex;gap:14px;align-items:center;font-family:var(--p01-font-display);font-size:13px;font-weight:500;margin-right:20px}
.p01-nav__tabs a{color:var(--p01-ink-soft);padding:6px 0;border-bottom:2px solid transparent}
.p01-nav__tabs a[aria-current],.p01-nav__tabs a:hover{color:var(--p01-ink);border-bottom-color:var(--p01-ink)}
.p01-nav__cta{display:flex;gap:8px}
.p01-nav__cta a{font-family:var(--p01-font-display);font-weight:700;font-size:12px;letter-spacing:.04em;padding:10px 22px;background:var(--p01-dark);color:#fff;border-radius:4px}
.p01-nav__cta a:hover{background:#333}
@media (max-width:880px){.p01-nav{grid-template-columns:1fr auto;gap:14px;padding:14px 20px}.p01-nav__tabs{display:none}}

/* HERO */
.p01-hero{padding:80px 36px 60px;max-width:1280px;margin:0 auto}
.p01-hero__h{display:flex;align-items:baseline;gap:18px;margin:0 0 26px}
.p01-hero__h__big{font-family:var(--p01-font-display);font-weight:900;font-size:clamp(56px,9vw,108px);line-height:1;letter-spacing:.005em;color:var(--p01-ink);margin:0}
.p01-hero__h__small{font-family:var(--p01-font-body);font-weight:500;font-size:15px;color:var(--p01-ink);margin:0}
.p01-hero__copy{font-family:var(--p01-font-body);font-weight:700;font-size:clamp(20px,2.4vw,28px);line-height:1.7;color:var(--p01-ink);margin:0 0 18px}
.p01-hero__lead{font-size:14px;line-height:2;color:var(--p01-ink-soft);margin:0;max-width:68ch}

/* CARDS: 2列×3 のグリッド、各カードに ● + タイトル + 説明 */
.p01-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;max-width:1180px;margin:48px auto 0;padding:0 36px}
.p01-card{background:var(--p01-paper);border:1px solid var(--p01-line);padding:32px 36px;display:block;text-decoration:none;color:var(--p01-ink);transition:background .2s,border-color .2s}
.p01-card:hover{background:#fff;border-color:var(--p01-ink)}
.p01-card__title{font-family:var(--p01-font-body);font-weight:700;font-size:18px;letter-spacing:.01em;color:var(--p01-ink);margin:0 0 10px;display:flex;align-items:center;gap:10px}
.p01-card__title::before{content:"●";color:var(--p01-ink);font-size:14px}
.p01-card__sub{font-size:13px;line-height:1.85;color:var(--p01-ink-soft);margin:0}
@media (max-width:680px){.p01-cards{grid-template-columns:1fr;padding:0 20px}.p01-card{padding:24px 24px}}

/* GROUP PHOTO: 白背景・集合写真 */
.p01-photo{margin:80px auto;max-width:1280px;padding:0 36px}
.p01-photo__plate{aspect-ratio:16/9;background:#F0EEE9;overflow:hidden}
.p01-photo__plate img{width:100%;height:100%;object-fit:cover}

/* DOWNLOAD / CONTACT: 2列ブロック */
.p01-blocks{display:grid;grid-template-columns:1fr 1fr;gap:36px;max-width:1180px;margin:80px auto 60px;padding:0 36px}
.p01-block{text-align:center;padding:36px 24px}
.p01-block h2{font-family:var(--p01-font-display);font-weight:900;font-size:42px;letter-spacing:.02em;margin:0 0 6px;color:var(--p01-ink)}
.p01-block p{font-size:13px;color:var(--p01-ink-soft);margin:0 0 8px}
.p01-block__lead{font-size:13px;line-height:1.85;color:var(--p01-ink-soft);margin:0 auto 18px;max-width:38ch}
.p01-block__btn{display:inline-flex;align-items:center;gap:10px;padding:14px 36px;background:var(--p01-dark);color:#fff;font-family:var(--p01-font-body);font-weight:500;font-size:13.5px}
.p01-block__btn:hover{background:#333}
@media (max-width:680px){.p01-blocks{grid-template-columns:1fr;padding:0 20px;gap:24px}}

/* SOCIAL ROW */
.p01-social{display:flex;gap:14px;justify-content:center;max-width:760px;margin:0 auto 80px;padding:0 36px;flex-wrap:wrap}
.p01-social a{flex:1 1 200px;display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 16px;border:1px solid var(--p01-line);font-family:var(--p01-font-body);font-size:13px;color:var(--p01-ink);min-width:160px}
.p01-social a:hover{background:var(--p01-paper)}

/* FOOTER: 黒地・3列・サイトマップ */
.p01-foot{background:var(--p01-dark);color:#FFFFFF;padding:60px 36px 24px;font-family:var(--p01-font-body)}
.p01-foot__top{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:auto 1fr 1fr 1fr 1fr;gap:36px}
.p01-foot__brand h3{font-family:var(--p01-font-display);font-weight:900;font-size:18px;letter-spacing:.06em;margin:0 0 12px;color:#fff}
.p01-foot__brand p{font-size:11px;color:#aaa;margin:0;line-height:1.85}
.p01-foot__brand p small{display:block;margin-top:8px}
.p01-foot__col h4{font-family:var(--p01-font-display);font-weight:700;font-size:13px;color:#fff;margin:0 0 10px;letter-spacing:.04em}
.p01-foot__col h4 + h4{margin-top:18px}
.p01-foot__col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:5px}
.p01-foot__col a{font-size:12.5px;color:#ccc}
.p01-foot__col a:hover{color:#fff}
.p01-foot__bot{max-width:1280px;margin:36px auto 0;padding-top:18px;border-top:1px solid #333;display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:11px;color:#888}
@media (max-width:880px){.p01-foot__top{grid-template-columns:1fr 1fr}.p01-foot__brand{grid-column:1 / -1}}

.p01-skip{position:absolute;left:-9999px;top:0;background:var(--p01-dark);color:#fff;padding:8px 14px;font-size:12px}
.p01-skip:focus{left:14px;top:14px;z-index:100}

/* ============ 動的要素 ============ */
html.p01-motion-ready .p01-hero,
html.p01-motion-ready .p01-job__hero{
  opacity:0;transform:translateY(20px);transition:opacity .9s cubic-bezier(.22,.61,.36,1),transform .9s cubic-bezier(.22,.61,.36,1);
}
html.p01-motion-ready .p01-hero.p01-fadein,
html.p01-motion-ready .p01-job__hero.p01-fadein{opacity:1;transform:none}

html.p01-motion-ready .p01-reveal{
  opacity:0;transform:translateY(16px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1) var(--p01-delay,0ms),transform .7s cubic-bezier(.22,.61,.36,1) var(--p01-delay,0ms);
}
html.p01-motion-ready .p01-reveal.p01-in{opacity:1;transform:none}

html.p01-motion-ready .p01-card{transition:background .25s ease,border-color .25s ease,transform .15s ease}
html.p01-motion-ready .p01-jobcard{transition:background .25s ease,border-color .25s ease,box-shadow .25s ease}
html.p01-motion-ready .p01-jobcard:hover{box-shadow:0 12px 32px -16px rgba(0,0,0,.25);transform:translateY(-3px)}
html.p01-motion-ready .p01-block__btn,
html.p01-motion-ready .p01-nav__cta a,
html.p01-motion-ready .p01-form button{transition:background .2s ease,transform .15s ease;will-change:transform}
html.p01-motion-ready .p01-block__btn:hover,
html.p01-motion-ready .p01-form button:hover{transform:translateY(-2px)}

html.p01-motion-ready .p01-nav{transition:box-shadow .25s ease}
html.p01-motion-ready .p01-nav.p01-nav--shadow{box-shadow:0 4px 16px -8px rgba(0,0,0,.12)}

html.p01-motion-ready .p01-faqitem div{overflow:hidden;max-height:0;opacity:0;transition:max-height .35s ease,opacity .3s ease}
html.p01-motion-ready .p01-faqitem[open] div{max-height:1000px;opacity:1}

/* hero タイトル文字ごとの load アニメ */
html.p01-motion-ready .p01-hero__h__big{display:inline-block;animation:p01-rise .9s cubic-bezier(.22,.61,.36,1) .15s both}
html.p01-motion-ready .p01-hero__h__small{animation:p01-rise .9s cubic-bezier(.22,.61,.36,1) .35s both}
html.p01-motion-ready .p01-hero__copy{animation:p01-rise .9s cubic-bezier(.22,.61,.36,1) .55s both}
html.p01-motion-ready .p01-hero__lead{animation:p01-rise .9s cubic-bezier(.22,.61,.36,1) .75s both}
@keyframes p01-rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}

/* ============ 下層ページ共通 ============ */
.p01-page{max-width:1080px;margin:0 auto;padding:60px 36px}
.p01-page__crumb{font-size:11.5px;color:var(--p01-ink-soft);margin:0 0 18px;letter-spacing:.06em}
.p01-page__crumb a{color:var(--p01-ink-soft)}
.p01-page__crumb a:hover{color:var(--p01-ink)}
.p01-page__h{display:flex;align-items:baseline;gap:18px;margin:0 0 36px}
.p01-page__h__big{font-family:var(--p01-font-display);font-weight:900;font-size:clamp(48px,7vw,84px);line-height:1;color:var(--p01-ink);margin:0;letter-spacing:.005em}
.p01-page__h__small{font-family:var(--p01-font-body);font-weight:500;font-size:14px;color:var(--p01-ink)}
.p01-page__lead{font-family:var(--p01-font-body);font-weight:700;font-size:clamp(18px,2.2vw,24px);line-height:1.7;color:var(--p01-ink);margin:0 0 36px;max-width:64ch}
@media (max-width:680px){.p01-page{padding:40px 20px}}

/* JOBS INDEX: カードグリッド(2列) */
.p01-jobs__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.p01-jobcard{background:var(--p01-paper);border:1px solid var(--p01-line);text-decoration:none;color:var(--p01-ink);display:flex;flex-direction:column;transition:background .2s,border-color .2s}
.p01-jobcard:hover{background:#fff;border-color:var(--p01-ink)}
.p01-jobcard__plate{aspect-ratio:16/10;overflow:hidden;background:#eee}
.p01-jobcard__plate img{width:100%;height:100%;object-fit:cover}
.p01-jobcard__body{padding:24px 28px}
.p01-jobcard__code{font-family:var(--p01-font-display);font-weight:700;font-size:11px;letter-spacing:.18em;color:var(--p01-ink-soft);margin:0 0 8px}
.p01-jobcard__title{font-family:var(--p01-font-body);font-weight:700;font-size:20px;color:var(--p01-ink);margin:0 0 6px;display:flex;align-items:center;gap:10px}
.p01-jobcard__title::before{content:"●";color:var(--p01-ink);font-size:13px}
.p01-jobcard__sub{font-size:13px;color:var(--p01-ink-soft);margin:0 0 14px;line-height:1.85}
.p01-jobcard__meta{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--p01-ink-soft);padding-top:12px;border-top:1px solid var(--p01-line)}
.p01-jobcard__meta b{color:var(--p01-ink);font-weight:700}
@media (max-width:680px){.p01-jobs__grid{grid-template-columns:1fr}}

/* JOB DETAIL: 個別求人ページ */
.p01-job__hero{background:var(--p01-paper);padding:48px 0;margin-bottom:60px;border-bottom:1px solid var(--p01-line)}
.p01-job__hero__inner{max-width:1080px;margin:0 auto;padding:0 36px;display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}
.p01-job__hero__plate{aspect-ratio:4/3;overflow:hidden;background:#ddd}
.p01-job__hero__plate img{width:100%;height:100%;object-fit:cover}
.p01-job__hero__code{font-family:var(--p01-font-display);font-weight:900;font-size:14px;letter-spacing:.18em;color:var(--p01-ink-soft);margin:0 0 14px;text-transform:uppercase}
.p01-job__hero__title{font-family:var(--p01-font-body);font-weight:900;font-size:clamp(28px,3.4vw,42px);line-height:1.25;color:var(--p01-ink);margin:0 0 14px}
.p01-job__hero__sub{font-family:var(--p01-font-body);font-weight:500;font-size:15.5px;line-height:1.85;color:var(--p01-ink-soft);margin:0 0 22px}
.p01-job__hero__meta{display:grid;grid-template-columns:auto 1fr;gap:8px 24px;font-size:13.5px;padding-top:18px;border-top:1px solid var(--p01-line)}
.p01-job__hero__meta dt{font-family:var(--p01-font-display);font-size:11.5px;font-weight:700;letter-spacing:.16em;color:var(--p01-ink-soft);text-transform:uppercase}
.p01-job__hero__meta dd{margin:0;color:var(--p01-ink);font-weight:500}
@media (max-width:880px){.p01-job__hero__inner{grid-template-columns:1fr}}

.p01-job__sec{max-width:1080px;margin:0 auto;padding:0 36px 60px}
.p01-job__sec__head{font-family:var(--p01-font-body);font-weight:700;font-size:20px;color:var(--p01-ink);margin:0 0 18px;padding-bottom:10px;border-bottom:2px solid var(--p01-ink);display:flex;align-items:center;gap:10px}
.p01-job__sec__head::before{content:"●";color:var(--p01-ink);font-size:14px}
.p01-job__sec p{font-size:14.5px;line-height:1.95;color:var(--p01-ink);margin:0 0 14px}
.p01-job__sec ul{padding-left:1.4em;margin:0;font-size:14.5px;line-height:1.95}
.p01-job__sec ul li{margin-bottom:6px}

/* 1日の流れ */
.p01-day{display:grid;grid-template-columns:120px 1fr;gap:0;border:1px solid var(--p01-line);background:#fff}
.p01-day__time{background:var(--p01-paper);padding:18px 18px;border-bottom:1px solid var(--p01-line);font-family:var(--p01-font-display);font-weight:900;font-size:18px;color:var(--p01-ink)}
.p01-day__body{padding:18px 24px;border-bottom:1px solid var(--p01-line)}
.p01-day__body h4{font-family:var(--p01-font-body);font-weight:700;font-size:15px;color:var(--p01-ink);margin:0 0 4px}
.p01-day__body p{font-size:13px;color:var(--p01-ink-soft);margin:0;line-height:1.75}
.p01-day__row{display:contents}
.p01-day__row:last-child .p01-day__time,.p01-day__row:last-child .p01-day__body{border-bottom:0}

/* REQUIREMENTS: 表 */
.p01-reqtable{width:100%;border-collapse:collapse;border-top:1px solid var(--p01-ink);font-size:14px}
.p01-reqtable tr{border-bottom:1px solid var(--p01-line)}
.p01-reqtable th{font-family:var(--p01-font-display);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--p01-ink-soft);text-align:left;padding:18px 20px 18px 0;width:200px;vertical-align:top;background:var(--p01-paper)}
.p01-reqtable td{padding:18px 20px;color:var(--p01-ink);line-height:1.85}
@media (max-width:680px){.p01-reqtable th{width:auto;display:block;padding:14px 20px 4px}.p01-reqtable td{display:block;padding:0 20px 14px}}

/* FAQ: details/summary 一覧 */
.p01-faqlist{border-top:1px solid var(--p01-ink)}
.p01-faqitem{border-bottom:1px solid var(--p01-line)}
.p01-faqitem summary{font-family:var(--p01-font-body);font-weight:700;font-size:15px;color:var(--p01-ink);cursor:pointer;list-style:none;padding:18px 20px;display:flex;gap:14px;align-items:flex-start}
.p01-faqitem summary::before{content:"Q";font-family:var(--p01-font-display);font-weight:900;color:var(--p01-ink);font-size:18px}
.p01-faqitem summary::after{content:"+";margin-left:auto;font-family:var(--p01-font-display);font-weight:700;color:var(--p01-ink-soft)}
.p01-faqitem[open] summary::after{content:"−"}
.p01-faqitem div{padding:0 20px 18px 56px;font-size:14px;color:var(--p01-ink-soft);line-height:1.85}

/* APPLY: フォーム */
.p01-form{display:grid;gap:18px;max-width:680px;margin:0 auto}
.p01-form label{display:block;font-family:var(--p01-font-body);font-weight:700;font-size:13px;color:var(--p01-ink);margin:0 0 6px}
.p01-form label small{font-weight:400;color:#c00;margin-left:6px}
.p01-form input,.p01-form select,.p01-form textarea{width:100%;font:inherit;padding:12px 14px;border:1px solid var(--p01-line);background:var(--p01-paper);color:var(--p01-ink);border-radius:0}
.p01-form input:focus,.p01-form select:focus,.p01-form textarea:focus{outline:none;border-color:var(--p01-ink);background:#fff}
.p01-form button{background:var(--p01-dark);color:#fff;padding:14px 36px;font-family:var(--p01-font-body);font-weight:700;font-size:14px;border:0;cursor:pointer;justify-self:start;margin-top:6px}
.p01-form button:hover{background:#333}
.p01-form__note{font-size:12px;color:var(--p01-ink-soft);background:var(--p01-paper);padding:14px 18px;border-left:3px solid var(--p01-ink);margin-bottom:18px}

/* COMPANY: 商号 表 + 沿革 + 代表メッセージ */
.p01-company__profile{margin-bottom:60px}
.p01-history{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--p01-line)}
.p01-history__row{display:grid;grid-template-columns:120px 1fr;gap:24px;padding:18px 0;border-bottom:1px solid var(--p01-line)}
.p01-history__year{font-family:var(--p01-font-display);font-weight:900;font-size:18px;color:var(--p01-ink)}
.p01-history__event{font-size:14px;color:var(--p01-ink);line-height:1.7}
.p01-message{background:var(--p01-paper);padding:48px 36px;margin-top:60px}
.p01-message__title{font-family:var(--p01-font-body);font-weight:700;font-size:clamp(22px,2.6vw,30px);line-height:1.5;color:var(--p01-ink);margin:0 0 22px}
.p01-message__body{font-size:14.5px;line-height:2;color:var(--p01-ink);max-width:64ch;white-space:pre-line}
.p01-message__sign{margin-top:24px;padding-top:14px;border-top:1px solid var(--p01-line);font-family:var(--p01-font-display);font-weight:700;font-size:13px;color:var(--p01-ink-soft);letter-spacing:.06em}
.p01-message__sign b{color:var(--p01-ink)}