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

/* 真似元: toyota-recruit.com / recruit.toyota (トヨタ自動車 新卒採用)
   観察結果:
   - 白〜クリームベージュ背景(#EDE5D3 系)、TOYOTAレッド(#EB0A1E)が差し色
   - ロゴは TOYOTA(レッド) + RECRUITING(細字)
   - ヒーロー: 巨大な日本語キャッチ「目的地は、この道の先にある。」 + 薄いPinアイコン
   - 上ナビ: お知らせ / トヨタの仕事と人 / トヨタの環境 / トヨタを知る / 新卒採用(○ボタン) / キャリア採用(○ボタン)
   - JOB&PEOPLE 等カテゴリヒロー: 左にレッドのPinアイコン + 巨大日本語 + 英字小さく
   - コンテンツ: 大きな写真カード 2列グリッド、英字小見出し + 日本語タイトル + 説明文
   - フッター: ダークグレー #2C2C2C、白文字、4列リンク、ENTRY角丸ボタン2つ
   - 主色: TOYOTAレッド #EB0A1E、ベージュ #EDE5D3、ダーク #2C2C2C */

:root{
  --p19-bg:#ffffff;
  --p19-cream:#EDE5D3;
  --p19-cream-soft:#F5F0E2;
  --p19-ink:#1A1A1A;
  --p19-ink-soft:#4A4A4A;
  --p19-mute:#888888;
  --p19-line:#E0DCD0;
  --p19-line-light:#EEEAE0;
  --p19-red:#EB0A1E;
  --p19-red-dark:#C00718;
  --p19-dark:#2C2C2C;
  --p19-dark-soft:#3A3A3A;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{background:var(--p19-bg);color:var(--p19-ink);font-family:var(--p19-font-body);font-weight:400;font-size:14px;line-height:1.85;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}

/* ===== HEADER ===== */
.p19-skip{position:absolute;left:-9999px;top:0;background:var(--p19-red);color:#fff;padding:8px 14px}
.p19-skip:focus{left:14px;top:14px;z-index:100}

.p19-header{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid var(--p19-line);padding:16px 36px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:32px}
.p19-header__brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--p19-ink)}
.p19-header__brand__logo{font-family:var(--p19-font-display);font-weight:800;font-size:18px;letter-spacing:.04em;color:var(--p19-red);line-height:1}
.p19-header__brand__sub{font-family:var(--p19-font-display);font-weight:500;font-size:11px;letter-spacing:.2em;color:var(--p19-ink-soft);padding-left:12px;border-left:1px solid var(--p19-line)}
.p19-header__nav{display:flex;justify-content:center;align-items:center;gap:28px;font-size:13px;font-weight:500}
.p19-header__nav a{color:var(--p19-ink);position:relative;padding:6px 0}
.p19-header__nav a:hover{color:var(--p19-red)}
.p19-header__util{display:flex;align-items:center;gap:10px}
.p19-header__util a{font-family:var(--p19-font-display);font-weight:600;font-size:12px;letter-spacing:.06em;padding:9px 22px;border-radius:30px;border:1px solid var(--p19-ink);color:var(--p19-ink);transition:all .15s}
.p19-header__util a.is-primary{background:var(--p19-red);border-color:var(--p19-red);color:#fff}
.p19-header__util a:hover{background:var(--p19-red);border-color:var(--p19-red);color:#fff}

/* ===== HERO ===== */
.p19-hero{position:relative;background:#fff;padding:80px 8% 0;min-height:560px;overflow:hidden}
.p19-hero__copy{font-family:var(--p19-font-body);font-weight:700;font-size:clamp(36px,5.2vw,72px);line-height:1.4;letter-spacing:.02em;color:var(--p19-ink);margin:0;max-width:980px;position:relative;z-index:2}
.p19-hero__copy em{font-style:normal;color:var(--p19-red)}
.p19-hero__sub{margin-top:36px;font-size:15px;line-height:2;color:var(--p19-ink-soft);max-width:560px;position:relative;z-index:2}
/* 巨大Pinアイコン(背景装飾) */
.p19-hero__pin{position:absolute;right:8%;bottom:-80px;width:340px;height:520px;opacity:.5;pointer-events:none;z-index:1}
.p19-hero__pin::before{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);width:340px;height:340px;background:var(--p19-cream);clip-path:circle(50% at 50% 50%)}
.p19-hero__pin::after{content:"";position:absolute;left:50%;top:170px;transform:translateX(-50%);width:0;height:0;border-left:170px solid transparent;border-right:170px solid transparent;border-top:280px solid var(--p19-cream)}
.p19-hero__pin span{position:absolute;left:50%;top:110px;transform:translateX(-50%);width:120px;height:120px;background:#fff;border-radius:50%;z-index:2}

.p19-hero__bg{background:var(--p19-cream);height:280px;margin-top:60px}

/* ===== カテゴリヒーロー(下層共通: トヨタの仕事と人 / 数値で紐解く 等) ===== */
.p19-cathero{background:var(--p19-cream);padding:64px 8% 56px;display:flex;align-items:center;gap:24px;position:relative;overflow:hidden}
.p19-cathero__pinicon{width:36px;height:48px;flex-shrink:0;position:relative}
.p19-cathero__pinicon::before{content:"";position:absolute;inset:0;background:var(--p19-red);clip-path:path('M18 0C8 0 0 8 0 18c0 14 18 30 18 30s18-16 18-30C36 8 28 0 18 0z')}
.p19-cathero__pinicon::after{content:"";position:absolute;left:12px;top:10px;width:12px;height:12px;background:#fff;border-radius:50%}
.p19-cathero__title{font-weight:700;font-size:clamp(26px,3.4vw,40px);letter-spacing:.04em;color:var(--p19-ink);margin:0;line-height:1.3}
.p19-cathero__title small{display:block;font-family:var(--p19-font-display);font-weight:500;font-size:11px;letter-spacing:.3em;color:var(--p19-ink-soft);margin-top:6px;text-transform:uppercase}
.p19-cathero__deco{position:absolute;right:6%;bottom:-40px;width:180px;height:240px;opacity:.4}
.p19-cathero__deco::before{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);width:180px;height:180px;background:#fff;border-radius:50%}
.p19-cathero__deco::after{content:"";position:absolute;left:50%;top:90px;transform:translateX(-50%);width:0;height:0;border-left:90px solid transparent;border-right:90px solid transparent;border-top:140px solid #fff}

/* ===== CONTENTS GRID(2列) ===== */
.p19-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px 56px;max-width:1080px;margin:0 auto;padding:80px 6% 100px}
.p19-card{display:block;color:var(--p19-ink)}
.p19-card__img{aspect-ratio:16/10;overflow:hidden;background:var(--p19-cream-soft)}
.p19-card__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.p19-card:hover .p19-card__img img{transform:scale(1.04)}
.p19-card__cat{font-family:var(--p19-font-display);font-weight:600;font-size:11px;letter-spacing:.16em;color:var(--p19-red);margin:20px 0 6px;text-transform:uppercase}
.p19-card__title{font-size:18px;font-weight:700;color:var(--p19-ink);margin:0 0 10px;line-height:1.5}
.p19-card__desc{font-size:13px;line-height:1.85;color:var(--p19-ink-soft);margin:0}

/* ===== お知らせ(NEWS) ===== */
.p19-news{max-width:980px;margin:0 auto;padding:64px 6% 100px}
.p19-news__list{border-top:1px solid var(--p19-line)}
.p19-news__item{display:grid;grid-template-columns:120px 110px 1fr;gap:24px;padding:22px 0;border-bottom:1px solid var(--p19-line);align-items:baseline}
.p19-news__date{font-family:var(--p19-font-display);font-weight:500;font-size:13px;color:var(--p19-ink-soft);letter-spacing:.04em}
.p19-news__tag{display:inline-block;font-size:11px;letter-spacing:.1em;border:1px solid var(--p19-ink);padding:3px 10px;color:var(--p19-ink);text-align:center}
.p19-news__title{font-size:14px;color:var(--p19-ink);line-height:1.7}

/* ===== 共通: 下層ページ ===== */
.p19-page{background:#fff}
.p19-page__inner{max-width:980px;margin:0 auto;padding:64px 6%}
.p19-page__lead{font-size:15px;line-height:2;color:var(--p19-ink-soft);margin:0 0 48px;max-width:760px}
.p19-page__crumb{max-width:980px;margin:0 auto;padding:14px 6%;font-size:11px;color:var(--p19-mute);letter-spacing:.04em}
.p19-page__crumb a{color:var(--p19-red)}

/* ===== JOBS INDEX: 大きな写真カード一覧 ===== */
.p19-jobs__grid{max-width:1080px;margin:0 auto;padding:60px 6% 100px;display:grid;grid-template-columns:1fr 1fr;gap:56px 48px}
.p19-jobcard{display:block;color:var(--p19-ink)}
.p19-jobcard__plate{aspect-ratio:16/10;overflow:hidden;background:var(--p19-cream-soft);position:relative}
.p19-jobcard__plate img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.p19-jobcard:hover .p19-jobcard__plate img{transform:scale(1.04)}
.p19-jobcard__plate::after{content:"";position:absolute;left:18px;top:18px;width:28px;height:36px;background:var(--p19-red);clip-path:path('M14 0C6 0 0 6 0 14c0 11 14 22 14 22s14-11 14-22C28 6 22 0 14 0z')}
.p19-jobcard__code{font-family:var(--p19-font-display);font-weight:600;font-size:11px;letter-spacing:.16em;color:var(--p19-red);margin:20px 0 6px;text-transform:uppercase}
.p19-jobcard__title{font-size:20px;font-weight:700;color:var(--p19-ink);margin:0 0 8px;line-height:1.4}
.p19-jobcard__sub{font-size:13px;color:var(--p19-ink-soft);margin:0 0 14px}
.p19-jobcard__meta{display:flex;flex-wrap:wrap;gap:8px;font-size:11px}
.p19-jobcard__meta span{background:var(--p19-cream-soft);padding:5px 12px;color:var(--p19-ink-soft)}
.p19-jobcard__meta b{color:var(--p19-ink);margin-right:6px;font-weight:600}

/* ===== JOB DETAIL ===== */
.p19-job__hero{background:var(--p19-cream);padding:72px 8% 56px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.p19-job__hero__img{aspect-ratio:4/3;overflow:hidden;position:relative;background:#fff}
.p19-job__hero__img img{width:100%;height:100%;object-fit:cover}
.p19-job__hero__num{position:absolute;left:18px;top:18px;background:var(--p19-red);color:#fff;font-family:var(--p19-font-display);font-weight:700;font-size:12px;letter-spacing:.12em;padding:6px 12px}
.p19-job__hero__body__code{font-family:var(--p19-font-display);font-weight:600;font-size:11px;letter-spacing:.2em;color:var(--p19-red);text-transform:uppercase;margin:0 0 14px}
.p19-job__hero__body h1{font-size:clamp(26px,3.2vw,38px);font-weight:700;color:var(--p19-ink);margin:0 0 18px;line-height:1.35;letter-spacing:.03em}
.p19-job__hero__body p{font-size:14px;line-height:2;color:var(--p19-ink-soft);margin:0 0 24px}
.p19-job__hero__meta{display:grid;grid-template-columns:auto 1fr;gap:10px 18px;margin:0;font-size:13px}
.p19-job__hero__meta dt{font-family:var(--p19-font-display);font-weight:600;font-size:10px;letter-spacing:.16em;color:var(--p19-mute);text-transform:uppercase;align-self:center}
.p19-job__hero__meta dd{margin:0;color:var(--p19-ink);font-weight:500}

.p19-job__sec{max-width:880px;margin:0 auto;padding:48px 6%;border-bottom:1px solid var(--p19-line-light)}
.p19-job__sec:last-child{border-bottom:0}
.p19-job__sec__head{display:flex;align-items:baseline;gap:18px;margin-bottom:24px;padding-bottom:14px;border-bottom:2px solid var(--p19-red)}
.p19-job__sec__head__en{font-family:var(--p19-font-display);font-weight:700;font-size:11px;letter-spacing:.24em;color:var(--p19-red);text-transform:uppercase}
.p19-job__sec__head__jp{font-size:18px;font-weight:700;color:var(--p19-ink);letter-spacing:.04em}
.p19-job__sec p{font-size:14px;line-height:2;color:var(--p19-ink-soft);margin:0 0 14px}
.p19-job__sec ul{margin:0;padding-left:1.2em;font-size:14px;line-height:2;color:var(--p19-ink-soft)}
.p19-job__sec ul li{margin-bottom:6px}
.p19-job__sec ul li::marker{color:var(--p19-red)}

/* ===== A DAY(1日の流れ) ===== */
.p19-day{display:grid;gap:0;margin-top:8px}
.p19-day__row{display:grid;grid-template-columns:120px 1fr;gap:24px;padding:18px 0;border-bottom:1px dashed var(--p19-line)}
.p19-day__row:last-child{border-bottom:0}
.p19-day__time{font-family:var(--p19-font-display);font-weight:700;font-size:18px;color:var(--p19-red);letter-spacing:.04em}
.p19-day__body h4{margin:0 0 4px;font-size:14px;font-weight:700;color:var(--p19-ink)}
.p19-day__body p{margin:0;font-size:13px;color:var(--p19-ink-soft);line-height:1.85}

/* ===== 募集要項テーブル ===== */
.p19-reqtable{width:100%;border-collapse:collapse;margin:0;font-size:13px;border-top:1px solid var(--p19-line)}
.p19-reqtable tr{border-bottom:1px solid var(--p19-line)}
.p19-reqtable th{text-align:left;padding:18px 0;width:140px;font-weight:700;color:var(--p19-ink);vertical-align:top;font-size:13px;letter-spacing:.04em}
.p19-reqtable td{padding:18px 0 18px 20px;color:var(--p19-ink-soft);line-height:2;vertical-align:top}

/* ===== FAQ ===== */
.p19-faqlist{margin:0;border-top:1px solid var(--p19-line)}
.p19-faqitem{border-bottom:1px solid var(--p19-line);padding:0}
.p19-faqitem summary{padding:20px 40px 20px 32px;cursor:pointer;list-style:none;font-weight:700;font-size:14px;color:var(--p19-ink);position:relative;display:flex;gap:14px}
.p19-faqitem summary::-webkit-details-marker{display:none}
.p19-faqitem summary::before{content:"Q";color:var(--p19-red);font-family:var(--p19-font-display);font-weight:800;font-size:14px;width:18px;flex-shrink:0}
.p19-faqitem summary::after{content:"+";position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:22px;color:var(--p19-red);font-weight:300;line-height:1}
.p19-faqitem[open] summary::after{content:"−"}
.p19-faqitem div{padding:0 40px 22px 64px;color:var(--p19-ink-soft);line-height:2;font-size:13px;position:relative}
.p19-faqitem div::before{content:"A";position:absolute;left:32px;top:0;color:var(--p19-mute);font-family:var(--p19-font-display);font-weight:800;font-size:14px}

/* ===== FORM(ENTRY) ===== */
.p19-form{display:grid;gap:24px;max-width:680px;margin:24px 0 0}
.p19-form > div{display:flex;flex-direction:column;gap:8px}
.p19-form label{font-size:12px;font-weight:700;color:var(--p19-ink);letter-spacing:.06em}
.p19-form label small{display:inline-block;background:var(--p19-red);color:#fff;font-size:9.5px;padding:2px 7px;margin-left:8px;letter-spacing:.06em;vertical-align:1px}
.p19-form input,.p19-form textarea,.p19-form select{font:inherit;padding:14px 16px;border:1px solid var(--p19-line);background:#fff;color:var(--p19-ink);width:100%;font-size:14px;transition:border-color .15s}
.p19-form input:focus,.p19-form textarea:focus,.p19-form select:focus{outline:none;border-color:var(--p19-red)}
.p19-form button{margin-top:14px;padding:18px 48px;background:var(--p19-red);color:#fff;border:0;font-family:var(--p19-font-display);font-weight:700;font-size:14px;letter-spacing:.14em;cursor:pointer;border-radius:30px;justify-self:start;transition:background .15s}
.p19-form button:hover{background:var(--p19-red-dark)}
.p19-form__note{font-size:12px;color:var(--p19-mute);line-height:1.85;margin:0 0 24px;padding:16px 18px;background:var(--p19-cream-soft);border-left:3px solid var(--p19-red)}

/* ===== TOP MESSAGE ===== */
.p19-message{background:var(--p19-cream);padding:72px 8%;display:grid;grid-template-columns:1fr 1.4fr;gap:56px;align-items:start}
.p19-message__photo{aspect-ratio:1;overflow:hidden;background:#fff}
.p19-message__photo img{width:100%;height:100%;object-fit:cover}
.p19-message__body__en{font-family:var(--p19-font-display);font-weight:600;font-size:11px;letter-spacing:.24em;color:var(--p19-red);text-transform:uppercase;margin:0 0 14px}
.p19-message__body h2{font-size:clamp(22px,2.6vw,30px);font-weight:700;color:var(--p19-ink);margin:0 0 28px;line-height:1.55;letter-spacing:.03em}
.p19-message__body__text{font-size:14px;line-height:2.05;color:var(--p19-ink-soft);margin:0 0 32px;white-space:pre-line}
.p19-message__sign{font-size:12px;color:var(--p19-ink-soft)}
.p19-message__sign b{display:block;font-size:18px;font-weight:700;color:var(--p19-ink);margin-top:6px;letter-spacing:.04em}

/* ===== HISTORY(沿革) ===== */
.p19-history{margin:32px 0 0;border-top:1px solid var(--p19-line)}
.p19-history__row{display:grid;grid-template-columns:120px 1fr;gap:24px;padding:18px 0;border-bottom:1px solid var(--p19-line)}
.p19-history__year{font-family:var(--p19-font-display);font-weight:700;font-size:16px;color:var(--p19-red);letter-spacing:.04em}
.p19-history__event{font-size:14px;color:var(--p19-ink-soft);line-height:1.85}

/* ===== 数値で紐解く ===== */
.p19-figures{max-width:1080px;margin:0 auto;padding:80px 6% 60px;display:grid;grid-template-columns:repeat(4,1fr);gap:36px 32px}
.p19-fig{border-top:2px solid var(--p19-red);padding-top:18px}
.p19-fig__label{font-family:var(--p19-font-display);font-weight:600;font-size:10px;letter-spacing:.18em;color:var(--p19-ink-soft);text-transform:uppercase;margin:0 0 10px}
.p19-fig__num{font-family:var(--p19-font-display);font-weight:800;font-size:56px;color:var(--p19-ink);line-height:1;letter-spacing:-.01em}
.p19-fig__unit{font-size:18px;font-weight:600;margin-left:4px;color:var(--p19-ink-soft)}
.p19-fig__note{margin:10px 0 0;font-size:11px;color:var(--p19-mute)}

/* ===== FOOTER ===== */
.p19-foot{background:var(--p19-dark);color:#d8d8d8;padding:64px 8% 36px}
.p19-foot__brand{display:flex;align-items:center;gap:16px;margin-bottom:48px;padding-bottom:32px;border-bottom:1px solid #444}
.p19-foot__brand__logo{font-family:var(--p19-font-display);font-weight:800;font-size:22px;letter-spacing:.04em;color:var(--p19-red);line-height:1}
.p19-foot__brand__sub{font-family:var(--p19-font-display);font-weight:500;font-size:12px;letter-spacing:.2em;color:#d8d8d8;padding-left:14px;border-left:1px solid #555}
.p19-foot__brand__title{margin-left:auto;font-size:13px;color:#d8d8d8;letter-spacing:.04em}
.p19-foot__cols{display:grid;grid-template-columns:repeat(4,1fr);gap:40px}
.p19-foot__col h4{font-family:var(--p19-font-display);font-size:13px;font-weight:700;letter-spacing:.06em;color:#fff;margin:0 0 18px;padding-bottom:12px;border-bottom:1px solid #444}
.p19-foot__col ul{list-style:none;padding:0;margin:0}
.p19-foot__col li{margin-bottom:10px;font-size:12px;line-height:1.65}
.p19-foot__col li a{color:#bcbcbc}
.p19-foot__col li a:hover{color:#fff}
.p19-foot__entry{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.p19-foot__entry a{display:inline-block;background:#fff;color:var(--p19-dark);font-family:var(--p19-font-display);font-weight:700;font-size:12px;letter-spacing:.08em;padding:10px 18px;border-radius:24px;text-align:left;position:relative}
.p19-foot__entry a::after{content:"›";position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--p19-red);font-size:16px}
.p19-foot__copy{margin-top:48px;padding-top:24px;border-top:1px solid #444;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;font-size:11px;color:#999;letter-spacing:.04em}
.p19-foot__copy__links{display:flex;gap:24px}
.p19-foot__copy__links a:hover{color:#fff}

/* ===== Responsive ===== */
@media (max-width: 900px){
  .p19-header{padding:14px 18px;gap:16px;grid-template-columns:auto auto}
  .p19-header__nav{display:none}
  .p19-header__util a{padding:7px 14px;font-size:11px}
  .p19-hero{padding:48px 6% 40px;min-height:auto}
  .p19-hero__pin{display:none}
  .p19-hero__bg{height:120px}
  .p19-cathero{padding:40px 6%}
  .p19-cathero__deco{display:none}
  .p19-grid,.p19-jobs__grid{grid-template-columns:1fr;gap:36px;padding:48px 6% 60px}
  .p19-job__hero{grid-template-columns:1fr;gap:24px;padding:40px 6%}
  .p19-message{grid-template-columns:1fr;gap:32px;padding:48px 6%}
  .p19-news__item{grid-template-columns:auto 90px;gap:10px 14px}
  .p19-news__title{grid-column:1/-1}
  .p19-figures{grid-template-columns:repeat(2,1fr);padding:48px 6%}
  .p19-foot__cols{grid-template-columns:1fr 1fr;gap:28px}
  .p19-foot__brand{flex-wrap:wrap}
  .p19-foot__brand__title{margin-left:0;width:100%}
}

/* ===== Motion ===== */
.p19-reveal{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s ease;transition-delay:var(--p19-delay,0ms)}
.p19-reveal.p19-in{opacity:1;transform:none}