﻿/* =====================================
   クイック応募・共通
===================================== */
.entry-cta {
  margin: 0 0 10px;
  padding: 10px;
  background: #fff;
  border: 2px solid var(--site-primary);
  border-radius: 8px;
}
.entry-cta hr {
  margin: 15px auto;
  border: none;
  border-top: 1px solid #edeceb;
}
/* 求人タイトル */
.entry-cta-info {
  margin-bottom: 10px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
}
/* アクセス */
.entry-access {
  margin-bottom: 10px;
  color: #858585;
  font-size: 12px;
}
.access-item {
  margin-bottom: 4px;
}
/* 雇用形態・職種 */
.entry-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}
.entry-tags .tag {
  padding: 4px 8px;
  background: var(--site-primary-soft);
  border-radius: 20px;
  color: #333;
  font-size: 11px;
  white-space: nowrap;
}
.entry-tags .tag-job {
  display: inline-block;
  max-width: 300px;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 給与 */
.entry-salary {
  display: table;
  margin: 0 auto 10px;
  padding: 4px 12px;
  background: #fff8e6;
  border: 1px solid #f0c36d;
  border-radius: 20px;
  color: #b36b00;
  font-size: 13px;
}
/* =====================================
   WEB応募ボタン
===================================== */
.entry-cta-btn {
  position: relative;
  display: block;
  padding: 12px 8px;
  background: var(--site-cta);
  border-radius: 14px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-weight: 700;
  transition: opacity .2s, transform .2s;
}
.entry-cta-btn .main {
  display: inline-block;
  font-size: 15px;
  letter-spacing: .05em;
}
.entry-cta-btn .arrow {
  margin-left: 6px;
  font-size: 16px;
}
.entry-cta-btn .sub {
  display: block;
  width: fit-content;
  margin: 10px auto 0;
  padding: 5px 12px;
  background: #fff;
  border-radius: 20px;
  color: var(--site-cta);
  font-size: 12px;
}
.entry-cta-btn:hover {
  opacity: .9;
  transform: translateY(-2px);
}
/* =====================================
   LINE応募ボタン
===================================== */
.line-apply {
  margin: 10px 0;
}
.line-apply-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px 10px;
  box-sizing: border-box;
  background: #06c755;
  border-radius: 12px;
  color: #fff !important;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  text-decoration: none !important;
  transition: background .2s;
}
.line-apply-btn .fa-line {
  flex-shrink: 0;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 23px;
  line-height: 1;
}
.line-apply-btn span {
  margin: 0 !important;
  padding: 0 !important;
}
.line-apply-btn:hover, .line-apply-btn:focus {
  background: #05ad49;
  color: #fff !important;
  text-decoration: none !important;
}
/* PCではスマホ用LINEボタンを非表示 */
.line-apply-btn--sp {
  display: none;
}
/* ==============================
   LINE応募 QRコードモーダル
============================== */
.kyline-qr-dialog {
  position: fixed !important;
  inset: 0 !important;
  box-sizing: border-box !important;
  width: min(440px, calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  max-height: calc(100dvh - 32px) !important;
  height: auto !important;
  margin: auto !important;
  padding: 0 !important;
  border-radius: 18px !important;
  background: #fff !important;
  color: #222 !important;
  overflow-y: auto !important;
  box-shadow: 0 18px 55px rgba(0, 0, 0, .22);
  text-align: center;
}
.kyline-qr-dialog:not([open]) {
  display: none !important;
}
.kyline-qr-dialog::backdrop {
  background: rgba(0, 0, 0, .65);
}
/* モーダル内部 */
.kyline-qr-dialog__panel {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  padding: 34px 26px 30px;
  background: #fff;
  color: #222;
  text-align: center;
}
/* 見出し */
.kyline-qr-dialog__panel h2 {
  margin: 0 30px 16px;
  color: #06A847;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .02em;
}
/* 説明文 */
.kyline-qr-dialog__panel p {
  margin: 0 0 12px;
  color: #444;
  font-size: 14px;
  line-height: 1.8;
}
/* 閉じるボタン */
.kyline-qr-dialog__close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #f0f7f3;
  color: #333;
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
  transition: background .2s, color .2s;
}
.kyline-qr-dialog__close:hover {
  background: #06C755;
  color: #fff;
}
/* QRコード */
.kyline-qr-dialog__image {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 310px;
  height: auto;
  margin: 18px auto;
  padding: 12px;
  border: 2px solid #d6f5e3;
  border-radius: 14px;
  background: #fff;
}
/* 読み取り案内 */
.kyline-qr-dialog__panel .kyline-qr-dialog__guide {
  margin-bottom: 12px;
  color: #333;
  font-size: 14px;
  font-weight: 500;
}
/* 補足テキスト */
.kyline-qr-dialog__panel .kyline-qr-dialog__note {
  margin: 0;
  padding: 12px;
  border-radius: 8px;
  background: #effbf4;
  color: #397451;
  font-size: 12px;
  line-height: 1.8;
}
/* スマホ・小画面 */
@media (max-width: 480px) {
  .kyline-qr-dialog {
    width: calc(100vw - 32px) !important;
    border-radius: 14px !important;
  }
  .kyline-qr-dialog__panel {
    padding: 28px 18px 24px;
  }
  .kyline-qr-dialog__panel h2 {
    font-size: 19px;
  }
  .kyline-qr-dialog__image {
    max-width: 260px;
  }
}
/* =====================================
   その他の求人
===================================== */
.related-job-list > a {
  display: block;
  color: inherit;
  text-decoration: none;
}
.related-job-list > a:hover {
  color: var(--site-primary);
}
.related-job-item {
  position: relative;
}
/* 掲載ステータス */
.related-job-status {
  position: absolute;
  right: 5px;
  bottom: 5px;
  z-index: 5;
  padding: 3px 6px;
  border-radius: 6px;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .03em;
  white-space: nowrap;
}
.related-job-status-private {
  background: #323232;
}
.related-job-status-closed {
  background: #263758;
}
.related-job-status-hold {
  background: #ffa000;
}
.related-job-status-dummy {
  background: #8b62c8;
}
/* WEB応募：ホバー・フォーカス時も白文字 */
.entry-cta-btn:hover, .entry-cta-btn:focus, .entry-cta-btn:active, .entry-cta-btn:visited {
  color: #fff !important;
  text-decoration: none !important;
}
/* 文字・矢印も白で固定 */
.entry-cta-btn .main, .entry-cta-btn .arrow, .entry-cta-btn:hover .main, .entry-cta-btn:hover .arrow {
  color: #fff !important;
}
/* =====================================
   スマホ専用（767px以下）
===================================== */
@media screen and (max-width: 767px) {
  /* ---------------------------------
     クイック応募バー
  --------------------------------- */
  .entry-cta:not(.related-jobs-box) {
    position: fixed !important;
    bottom: 0;
    left: 0;
    z-index: 9999;
    display: flex !important;
    align-items: stretch;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
    box-sizing: border-box;
    background: #fff;
    border: none;
    border-top: 1px solid #ddd;
    border-radius: 0;
    box-shadow: 0 -3px 12px rgba(0, 0, 0, .12);
  }
  /* 求人情報を非表示 */
  .entry-cta:not(.related-jobs-box) .entry-cta-info, .entry-cta:not(.related-jobs-box) .entry-access, .entry-cta:not(.related-jobs-box) .entry-tags, .entry-cta:not(.related-jobs-box) .entry-salary, .entry-cta:not(.related-jobs-box) hr {
    display: none !important;
  }
  /* ---------------------------------
     LINE・WEB共通レイアウト
  --------------------------------- */
  .entry-cta:not(.related-jobs-box) .line-apply, .entry-cta:not(.related-jobs-box) .entry-cta-btn {
    flex: 1 1 0;
    min-width: 0;
    max-width: 240px;
    margin: 0;
    box-sizing: border-box;
  }
  /* LINEボタンがない場合は枠も非表示 */
  .entry-cta:not(.related-jobs-box) .line-apply:not(:has(.line-apply-btn--sp)) {
    display: none !important;
  }
  /* ---------------------------------
     LINE応募
  --------------------------------- */
  .entry-cta:not(.related-jobs-box) .line-apply {
    display: flex;
  }
  /* PC用LINEを非表示 */
  .entry-cta:not(.related-jobs-box) .line-apply-btn--pc {
    display: none !important;
  }
  /* スマホ用LINE */
  .entry-cta:not(.related-jobs-box) .line-apply-btn--sp {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 5px !important;
    width: 100%;
    min-height: 56px;
    margin: 0;
    padding: 8px 4px;
    border-radius: 8px;
    font-size: 12px;
    line-height: 1.3;
    white-space: nowrap;
  }
  .entry-cta:not(.related-jobs-box) .line-apply-btn .fa-line {
    font-size: 20px;
  }
  /* ---------------------------------
     WEB応募
  --------------------------------- */
  .entry-cta:not(.related-jobs-box) .entry-cta-btn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-height: 56px;
    padding: 8px 4px;
    border-radius: 8px;
    line-height: 1.3;
    transform: none !important;
  }
  .entry-cta:not(.related-jobs-box) .entry-cta-btn .main {
    font-size: 12px;
    white-space: nowrap;
  }
  /* スマホでは矢印・補足文を非表示 */
  .entry-cta:not(.related-jobs-box) .entry-cta-btn .arrow, .entry-cta:not(.related-jobs-box) .entry-cta-btn .sub {
    display: none !important;
  }
  /* LINEなしの場合も中央配置 */
  /* 親のjustify-content:centerと
     最大幅240pxで自動調整 */
  /* ---------------------------------
     その他の調整
  --------------------------------- */
  /* 本文との重なり防止 */
  body.single-post {
    padding-bottom: calc(90px + env(safe-area-inset-bottom));
  }
  /* 旧応募バーを非表示 */
  .btm-contact {
    display: none !important;
  }
  /* ページトップボタン */
  .page-top2 {
    bottom: calc(95px + env(safe-area-inset-bottom)) !important;
  }
  /* 関連求人の掲載ステータス */
  .related-job-status {
    top: 8px;
    right: 8px;
    bottom: auto;
    padding: 5px 8px;
    font-size: 11px;
  }
}