/* 採用ページ共通：応募ポップアップ／右側固定の話を聞くボタン（デザインはメンバーインタビューのページに合わせる） */

/* PC：右側に固定 */
.ap-side{position:fixed;right:32px;top:50%;transform:translateY(-50%);width:260px;z-index:40;padding:0 0 22px;overflow:hidden;border:1px solid #e8e8e8;border-radius:16px;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.06);text-align:center}
.ap-side-img{aspect-ratio:4/3;overflow:hidden;margin-bottom:18px}
.ap-side-img img{width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block}
.ap-side-t{padding:0 20px;font-size:15px;font-weight:700;line-height:1.6;color:#111}
.ap-side-d{padding:0 20px;margin-top:10px;font-size:12.5px;line-height:1.8;color:#666}
.ap-side-btn{display:block;width:calc(100% - 40px);margin:16px 20px 0;padding:13px 0;border:0;border-radius:999px;background:#111;color:#fff;font-family:inherit;font-size:14px;font-weight:700;letter-spacing:.06em;cursor:pointer}
.ap-side-btn:hover{background:#333}
@media (max-width:1519px){.ap-side{display:none}}
@media (max-height:760px){.ap-side-img{display:none}.ap-side{padding-top:22px}}

/* SP：右下に正方形のカード（閉じられる） */
.ap-float{display:none}
@media (max-width:1519px){
  .ap-float{display:block;position:fixed;right:14px;bottom:calc(96px + env(safe-area-inset-bottom,0px));z-index:60;width:160px}
  .ap-float[hidden]{display:none}
}
.ap-float-in{display:flex;flex-direction:column;align-items:stretch;width:100%;aspect-ratio:1/1;overflow:hidden;padding:0;background:#fff;border:1px solid #e8e8e8;border-radius:16px;box-shadow:0 8px 24px rgba(0,0,0,.16);color:#111;font-family:inherit;cursor:pointer}
.ap-float-in img{width:100%;height:48%;object-fit:cover;display:block}
.ap-float-t{flex:1;display:flex;align-items:center;justify-content:center;padding:4px 8px;font-size:11.5px;font-weight:700;line-height:1.45;text-align:center}
.ap-float-b{margin:0 10px 10px;padding:6px 0;text-align:center;font-size:11px;font-weight:700;color:#fff;background:#111;border-radius:999px}
.ap-float-x{position:absolute;top:-10px;right:-8px;width:28px;height:28px;border-radius:50%;border:1px solid #e0e0e0;background:#fff;color:#555;font-size:18px;line-height:1;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.12);display:flex;align-items:center;justify-content:center;padding:0;z-index:1}

/* ポップアップ */
.ap-modal{position:fixed;inset:0;z-index:2147483000;display:none;align-items:center;justify-content:center;padding:24px}
.ap-modal.open{display:flex}
.ap-bg{position:absolute;inset:0;background:rgba(17,17,17,.55)}
.ap-card{position:relative;width:100%;max-width:560px;max-height:calc(100vh - 48px);overflow-y:auto;background:#fff;border-radius:18px;padding:36px 34px 30px;box-shadow:0 24px 60px rgba(0,0,0,.25);color:#111;font-family:'Noto Sans JP',sans-serif}
.ap-x{position:absolute;top:14px;right:14px;width:36px;height:36px;border:0;border-radius:50%;background:#f3f3f3;color:#555;font-size:20px;line-height:1;cursor:pointer}
.ap-x:hover{background:#e8e8e8}
.ap-label{font-family:'Nunito Sans',sans-serif;font-size:12px;font-weight:700;letter-spacing:.14em;color:#888}
.ap-title{margin-top:6px;padding-right:28px;font-size:21px;font-weight:700;line-height:1.55;letter-spacing:.02em}
.ap-sub{margin-top:8px;font-size:13px;line-height:1.8;color:#666}
.ap-pos-fixed{padding:13px 14px;border-radius:10px;background:#f3f3f3;font-size:16px;font-weight:700;color:#111}
.ap-field select{width:100%;padding:13px 40px 13px 14px;border:1px solid #dcdcdc;border-radius:10px;font-family:inherit;font-size:16px;color:#111;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23111' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 16px center;-webkit-appearance:none;appearance:none;outline:none;transition:border-color .2s}
.ap-field select:focus{border-color:#111}
.ap-form{margin-top:22px;display:flex;flex-direction:column;gap:16px}
.ap-field label{display:block;font-size:13px;font-weight:700;margin-bottom:7px}
.ap-field label span{margin-left:6px;font-size:11px;font-weight:700;color:#d24b4b}
.ap-field input{width:100%;padding:13px 14px;border:1px solid #dcdcdc;border-radius:10px;font-family:inherit;font-size:16px;color:#111;background:#fff;outline:none;transition:border-color .2s}
.ap-field input:focus{border-color:#111}
.ap-submit,.ap-go,.ap-link{display:block;width:100%;margin-top:6px;padding:16px;border:0;border-radius:999px;background:#111;color:#fff;font-family:inherit;font-size:15px;font-weight:700;letter-spacing:.06em;text-align:center;text-decoration:none;cursor:pointer}
.ap-submit:hover,.ap-go:hover:not(:disabled),.ap-link:hover{background:#333}
.ap-submit:disabled,.ap-go:disabled{opacity:.45;cursor:default}
.ap-note{font-size:11.5px;line-height:1.8;color:#888;text-align:center}
.ap-err{font-size:12.5px;font-weight:700;color:#c43c3c;text-align:center}

/* 日程予約 */
.ap-done-badge{width:52px;height:52px;border-radius:50%;background:#111;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.ap-done-badge svg{width:26px;height:26px;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.ap-body{margin-top:20px}
.ap-msg{font-size:13.5px;color:#666;text-align:center;padding:24px 0;line-height:1.8}
.ap-days{display:flex;gap:10px;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:thin}
.ap-day{flex:0 0 auto;min-width:80px;padding:10px 8px;border:1.5px solid #e2e2e2;border-radius:12px;background:#fff;cursor:pointer;font-family:inherit;color:#111;text-align:center}
.ap-day b{display:block;font-size:17px;font-weight:700}
.ap-day span{font-size:12px;color:#777}
.ap-day:hover,.ap-time:hover{border-color:#111}
.ap-day.on,.ap-time.on{border-color:#111;background:#111;color:#fff}
.ap-day.on span{color:#ddd}
.ap-times{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:14px}
.ap-time{padding:12px 0;border:1.5px solid #e2e2e2;border-radius:12px;background:#fff;cursor:pointer;font-family:inherit;font-size:15px;font-weight:700;color:#111}
.ap-go{margin-top:20px}
.ap-foot{margin-top:12px;font-size:12.5px;color:#777;text-align:center;line-height:1.7}
.ap-done{text-align:center;padding:6px 0 2px}
.ap-done .ap-done-badge{margin:0 auto 14px}
.ap-done-when{font-size:20px;font-weight:700;margin:4px 0 10px}
.ap-done p{font-size:13.5px;color:#555;line-height:1.8}
.ap-done a{color:#111;word-break:break-all}

@media (max-width:640px){
  .ap-modal{padding:12px;align-items:flex-end}
  .ap-card{padding:30px 20px 24px;border-radius:18px;max-height:calc(100vh - 24px)}
  .ap-title{font-size:18px}
  .ap-times{grid-template-columns:repeat(3,1fr);gap:8px}
  .ap-day{min-width:72px}
}
body.ap-lock{overflow:hidden}

/* <a> から <button> に変えた応募ボタンの見た目をそろえる */
button.jd-cta-btn,button.empty-state-cta{font-family:inherit;cursor:pointer;line-height:inherit}
button.jd-cta-btn{border:0}
.ap-nb{display:inline-block}

/* CTAボタンは右上の採用情報ボタンと同じ色にそろえる */
.jd-cta-btn,button.jd-cta-btn,.ap-side-btn,.ap-float-b,.ap-submit,.ap-go,.ap-link{background:#F36161;color:#fff}
.jd-cta-btn:hover,.ap-side-btn:hover,.ap-submit:hover,.ap-go:hover:not(:disabled),.ap-link:hover{background:#F57C7C}
button.empty-state-cta{background:#F36161;border-color:#F36161;color:#fff}
button.empty-state-cta:hover{background:#F57C7C;border-color:#F57C7C}
.ap-day.on,.ap-time.on{background:#F36161;border-color:#F36161}
.ap-day:hover,.ap-time:hover,.ap-field input:focus{border-color:#F36161}
.ap-done-badge{background:#F36161}

/* 応募完了画面：中央揃え＋ポップなアニメーション */
.ap-inner.is-done{text-align:center}
.ap-inner.is-done .ap-title{padding:0 8px}
.ap-burst{position:relative;width:96px;height:96px;margin:4px auto 18px}
.ap-burst .ap-done-badge{position:absolute;inset:16px;width:64px;height:64px;margin:0;animation:apPop .6s cubic-bezier(.2,1.6,.4,1) both}
.ap-burst .ap-done-badge svg{width:32px;height:32px;stroke-dasharray:30;stroke-dashoffset:30;animation:apDraw .35s .4s ease-out forwards}
.ap-burst::before{content:"";position:absolute;inset:16px;border-radius:50%;border:3px solid #F36161;animation:apRing .7s .15s ease-out both}
.ap-burst i{position:absolute;left:50%;top:50%;width:9px;height:9px;margin:-4.5px;border-radius:50%;opacity:0;animation:apFly .8s .2s cubic-bezier(.15,.7,.3,1) forwards}
.ap-burst i:nth-child(3n){border-radius:2px;width:7px;height:12px}
.ap-burst i:nth-child(1){--x:-62px;--y:-30px;background:#F36161}
.ap-burst i:nth-child(2){--x:-44px;--y:-58px;background:#FFC233}
.ap-burst i:nth-child(3){--x:-6px;--y:-70px;background:#3EC6B6}
.ap-burst i:nth-child(4){--x:40px;--y:-60px;background:#7B8CFF}
.ap-burst i:nth-child(5){--x:64px;--y:-26px;background:#FF8FB1}
.ap-burst i:nth-child(6){--x:66px;--y:22px;background:#FFC233}
.ap-burst i:nth-child(7){--x:42px;--y:56px;background:#3EC6B6}
.ap-burst i:nth-child(8){--x:-4px;--y:66px;background:#F36161}
.ap-burst i:nth-child(9){--x:-46px;--y:52px;background:#7B8CFF}
.ap-burst i:nth-child(10){--x:-66px;--y:16px;background:#FF8FB1}
.ap-inner.is-done .ap-title,.ap-inner.is-done .ap-sub,.ap-inner.is-done .ap-body{animation:apUp .5s ease-out both}
.ap-inner.is-done .ap-title{animation-delay:.25s}
.ap-inner.is-done .ap-sub{animation-delay:.35s}
.ap-inner.is-done .ap-body{animation-delay:.45s}
@keyframes apPop{0%{transform:scale(0)}100%{transform:scale(1)}}
@keyframes apDraw{to{stroke-dashoffset:0}}
@keyframes apRing{0%{transform:scale(.6);opacity:1}100%{transform:scale(1.9);opacity:0}}
@keyframes apFly{0%{transform:translate(0,0) scale(.4) rotate(0);opacity:1}70%{opacity:1}100%{transform:translate(var(--x),var(--y)) scale(1) rotate(200deg);opacity:0}}
@keyframes apUp{0%{transform:translateY(12px);opacity:0}100%{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.ap-burst *,.ap-burst::before,.ap-inner.is-done *{animation:none!important;stroke-dashoffset:0!important;opacity:1}.ap-burst i{display:none}}