/* 採用パンフ（電子ブック）の入口とアンケート（[midori_pamphlet]）、プライバシーポリシーのページの見た目。
   お問い合わせフォーム（/otoiawase/）と同じ：細い文字・広い字間・極細の線・小さな丸のラジオ・オレンジの「必須」・白地に緑枠のボタン。
   ?v=更新時刻 つきで読み込む（inc/pamphlet.php）。 */
.mp,.mp *{box-sizing:border-box}
.mp{--ink:#1c1c1c;--ink2:#4c4c4c;--muted:#9b9b9b;--line:#d9d9d9;--soft:#ededed;--bgsoft:#f7f8f6;--primary:#8bb79a;--primary-d:#7dae8d;--mark:#f5a01b;--alert:#c2553f;
  /* 全幅の薄い帯にして、前後のページの内容から独立した部品に見せる */
  max-width:none;margin:96px 0;padding:72px 20px;background:var(--bgsoft);color:var(--ink2);letter-spacing:.08em;
  font-family:"Noto Sans JP","Hiragino Sans","ヒラギノ角ゴシック","Yu Gothic Medium","游ゴシック Medium",YuGothic,Meiryo,"Noto Sans CJK JP",IPAGothic,sans-serif}
.mp button,.mp input{font-family:inherit}

/* ---- 入口：表紙のサムネと、ことば ---- */
.mp__hero,.mp__panel{max-width:880px;margin-left:auto;margin-right:auto}
.mp__hero{display:flex;align-items:center;justify-content:center;gap:56px}
.mp__cover{position:relative;flex:0 0 232px;width:232px;padding:0;border:0;background:none;cursor:pointer;display:block;-webkit-tap-highlight-color:transparent}
.mp__cover img{position:relative;display:block;width:100%;height:auto;aspect-ratio:720/1018;background:#fff;box-shadow:0 10px 30px rgba(28,28,28,.14);transition:transform .35s ease,box-shadow .35s ease}
.mp__sheet{position:absolute;inset:0;background:#fff;box-shadow:0 2px 10px rgba(28,28,28,.1);transition:transform .35s ease}
.mp__sheet--a{transform:translate(7px,6px)}
.mp__sheet--b{transform:translate(14px,12px);opacity:.85}
.mp__cover:hover img,.mp__cover:focus-visible img{transform:translate(-2px,-3px);box-shadow:0 14px 34px rgba(28,28,28,.18)}
.mp__cover:hover .mp__sheet--a,.mp__cover:focus-visible .mp__sheet--a{transform:translate(10px,8px)}
.mp__cover:hover .mp__sheet--b,.mp__cover:focus-visible .mp__sheet--b{transform:translate(19px,15px)}
.mp__cover:focus-visible{outline:2px solid var(--primary);outline-offset:6px}
.mp__text{flex:1 1 auto;max-width:420px}
.mp__tag{display:inline-block;margin:0 0 22px;padding:5px 18px;border:1px solid var(--primary);border-radius:999px;font-size:11px;letter-spacing:.2em;color:var(--primary)}
.mp .mp__title{margin:0;font-size:26px;font-weight:700;text-align:inherit;letter-spacing:.22em;color:var(--ink);line-height:1.5;white-space:nowrap}
/* 採用ページの枠（.recruit-recruitment h2）の太字・中央揃いに負けないよう、.mp の中の指定にしてある。1行のまま、画面の幅に合わせて大きさを変える（11文字×1.22＝約13.4倍が、欄の幅に収まるように。欄は769px以上で420px、それより狭いと幅に応じて縮む） */
@media (min-width:641px) and (max-width:768px){.mp .mp__title{font-size:min(26px,calc((100vw - 340px)/14.5))}}
.mp__en{margin:6px 0 22px;font-family:"Jost","Century Gothic","Avenir Next",sans-serif;font-size:12px;letter-spacing:.3em;color:var(--muted)}
.mp__lead{margin:0 0 30px;font-size:14px;line-height:2.1;color:var(--ink2)}

/* ---- ボタン（お問い合わせフォームと同じ：白地に緑の枠。乗せると緑） ---- */
.mp__btn{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-width:240px;padding:15px 30px;border:1px solid var(--primary);background:#fff;color:var(--primary);
  font-size:14px;font-weight:500;letter-spacing:.24em;text-indent:.24em;line-height:1.4;text-decoration:none;cursor:pointer;transition:background .25s,color .25s}
.mp__btn i{display:block;width:22px;height:1px;background:currentColor;position:relative;flex:none}
.mp__btn i::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.mp__btn:hover{background:var(--primary);color:#fff}
.mp__btn:focus-visible{outline:2px solid var(--primary-d);outline-offset:3px}
.mp__btn[disabled]{opacity:.55;cursor:default}

/* ---- アンケート ---- */
.mp__panel{margin-top:48px;padding:40px 0 0;border-top:1px solid var(--line)}
.mp__panel[hidden],.mp__done[hidden],.mp__form[hidden],.mp__err[hidden]{display:none}
.mp__lede{margin:0 0 34px;font-size:12.5px;color:var(--muted);letter-spacing:.1em}
.mp__req{display:inline-block;margin-left:6px;padding:1px 8px;background:var(--mark);color:#fff;font-size:10px;line-height:1.7;letter-spacing:.12em;vertical-align:1px}
.mp__lede .mp__req{margin-left:0;margin-right:4px}
.mp__field{border:0;margin:0 0 36px;padding:0;min-width:0}
.mp__field legend{display:block;width:100%;padding:0 0 14px;margin:0 0 22px;border-bottom:1px solid var(--line);font-size:13px;font-weight:500;letter-spacing:.2em;color:var(--ink)}
.mp__chips{display:flex;flex-wrap:wrap;gap:10px}
.mp__chip,.mp__row{position:relative;display:block;cursor:pointer;-webkit-tap-highlight-color:transparent}
.mp__chip input,.mp__row input{position:absolute;opacity:0;width:1px;height:1px}
.mp__chip span{display:block;padding:10px 20px;border:1px solid var(--line);border-radius:999px;font-size:13px;line-height:1.5;color:var(--ink2);background:#fff;transition:border-color .2s,color .2s,background .2s}
.mp__chip:hover span{border-color:var(--primary)}
.mp__chip input:checked+span{border-color:var(--primary);background:#f1f6f2;color:var(--primary-d);font-weight:500}
.mp__rows{display:flex;flex-direction:column}
.mp__row{display:flex;align-items:center;gap:16px;padding:16px 4px;border-bottom:1px solid var(--soft)}
.mp__row:first-child{border-top:1px solid var(--soft)}
.mp__row i{flex:none;position:relative;width:18px;height:18px;border:1px solid var(--line);border-radius:50%;background:#fff;transition:border-color .2s}
.mp__row i::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--primary);transform:scale(0);transition:transform .2s}
.mp__row span{font-size:14px;line-height:1.6;color:var(--ink)}
.mp__row:hover i{border-color:var(--primary)}
.mp__row input:checked+i{border-color:var(--primary)}
.mp__row input:checked+i::after{transform:scale(1)}
.mp__chip input:focus-visible+span,.mp__row input:focus-visible+i{outline:2px solid var(--primary-d);outline-offset:2px}
.mp__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.mp__ts{display:flex;justify-content:center;min-height:70px;margin:24px 0 32px}
.mp__err{margin:10px 0 18px;color:var(--alert);font-size:13px;letter-spacing:.06em;text-align:center}
.mp__form .mp__btn{display:flex;width:100%;max-width:360px;margin:6px auto 0}
.mp__form .mp__submit{padding:22px 30px;background:var(--primary);color:#fff;font-weight:700;letter-spacing:.08em}
.mp__form .mp__submit:hover{background:var(--primary-d);border-color:var(--primary-d)}
.mp__note{margin:22px 0 0;font-size:12px;line-height:1.9;color:var(--muted);letter-spacing:.06em;text-align:center}
.mp__note a{color:var(--ink2);text-decoration:underline}

/* ---- URLを出したあと ---- */
.mp__done{text-align:center;padding:6px 0 10px}
.mp__done-title{margin:0 0 26px;font-size:16px;font-weight:500;letter-spacing:.2em;color:var(--ink)}
.mp__done .mp__btn{margin:0 auto}
.mp__url-row{display:flex;gap:10px;max-width:520px;margin:28px auto 0}
.mp__url{flex:1;min-width:0;border:1px solid var(--line);background:#fff;padding:10px 14px;font-size:12px;color:var(--ink2);letter-spacing:.04em}
.mp__copy{flex:none;border:1px solid var(--line);background:#fff;color:var(--ink2);padding:10px 18px;font-size:12px;letter-spacing:.12em;cursor:pointer;transition:border-color .2s,color .2s}
.mp__copy:hover{border-color:var(--primary);color:var(--primary)}
.mp__copy:focus-visible,.mp__url:focus-visible{outline:2px solid var(--primary-d);outline-offset:2px}
.mp__expire{margin:22px 0 0;font-size:12px;color:var(--muted);letter-spacing:.06em;line-height:1.9}
.mp-notice{max-width:880px;margin:24px auto;padding:10px 16px;border:1px dashed #c9a14a;background:#fff9e8;font-size:13px}

@media (max-width:640px){
  .mp{margin:64px 0;padding:48px 20px}
  .mp__hero{flex-direction:column;gap:34px;text-align:center}
  .mp__cover{flex:none;width:200px;margin:0 14px 0 0}
  .mp__text{max-width:none}
  .mp .mp__title{font-size:min(24px,calc((100vw - 40px)/14.5))}
  .mp__btn{width:100%;min-width:0}
  .mp__chip span{padding:10px 16px}
  .mp__url-row{flex-direction:column}
  .mp__copy{width:100%}
}
@media (prefers-reduced-motion:reduce){.mp *{transition:none!important;scroll-behavior:auto!important}}

/* ---- プライバシーポリシーのページ（フォームと同じ、細い文字） ---- */
/* 固定ヘッダー（高さは画面の幅に比例：スマホ幅は約17.4%、769px以上は約7.8%）に重ならないよう、上の余白は padding で取る（margin だと親へ突き抜けてヘッダーごと動く） */
.mp-policy{max-width:820px;margin:0 auto 90px;padding:calc(17.4vw + 48px) 20px 0;color:#4c4c4c;line-height:2;font-size:14px;letter-spacing:.06em}
@media(min-width:769px){.mp-policy{padding-top:calc(7.8vw + 48px)}}
.mp-policy h1{font-size:24px;font-weight:400;letter-spacing:.2em;color:#1c1c1c;margin:0 0 6px}
.mp-policy h2{font-size:14px;font-weight:500;letter-spacing:.2em;color:#1c1c1c;margin:2.6em 0 1em;padding-bottom:12px;border-bottom:1px solid #d9d9d9}
.mp-policy table{border-collapse:collapse;width:100%;margin:.8em 0;font-size:13px}
.mp-policy th,.mp-policy td{border-top:1px solid #ededed;border-bottom:1px solid #ededed;padding:12px 10px;text-align:left;vertical-align:top}
.mp-policy th{width:28%;font-weight:500;color:#1c1c1c;background:#f7f8f6}
.mp-policy a{color:#4c4c4c;text-decoration:underline}
.mp-policy .meta{color:#9b9b9b;font-size:12px}
.mp-policy .todo{background:#fff3df;color:#7a3f00;font-weight:700}
@media (max-width:600px){.mp-policy th{width:34%}.mp-policy h1{font-size:20px}}