html, body {
	font-family: 'Nunito', sans-serif;
	overflow: hidden;
	margin: 0;
	padding: 0;
}


#head{
	width: 100%;
	height: 70px;
	border-bottom: 1px solid #ccc;
	/*display: flex;*/
	padding: 4px;
	z-index: 600;
	background-color: #ffffff;
	/* display: none; */
	position: fixed;
	top: 0;
	left: 0;
	justify-content: space-between;
	box-sizing: border-box;
}

h1{
  font-size: 14px;
}

.logo_l{
	width: 65px;
}

#wrap{
  overflow: hidden;
}

#map {
	width:100%;
	height:100vh;
	z-index: 200;
}

.inner{
overflow-y: scroll;
    /*height: 80%;*/
    max-height:100%;
    padding: 10px;
background-color: #f7e7e7;
    border: solid 2px #ff9090;
    border-radius: 5px;
    scrollbar-color: #FAF8D8 #deb394;
    scrollbar-width: thin;
}

#slide_menu{
    position: fixed;
    left: -300px;
    width: 280px;
    height: 480px;
    /*background: #ffffff;*/
    z-index:500;
    font-size: 16px;
    padding: 50px 10px 10px 20px;
    /*border: 1px solid #ccc;*/
    top: 10px;
}

.job-title {
  font-size: 18px;
  font-weight: normal;
  margin-bottom: 8px;
  line-height: 1.4;
  color: #333;
}

.hourly {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 8px;
  line-height: 1.4;
  color: #c73f01;
}

.job-description {
  font-size: 14px;
  color: #555;
  line-height: 1.6;
  margin-bottom: 16px;
  white-space: pre-wrap;
}

#ch_area{
    position: absolute;
    z-index: 5000;
    top: 80px;
    overflow-x: scroll;
    width: 95%;
    height: 60px;
 /* IE, Edge 対応 */
 -ms-overflow-style: none;
 /* Firefox 対応 */
 scrollbar-width: none;
padding-top: 6px;

}

#ch_area::-webkit-scrollbar {
 display:none;
}

.in_box{
    padding: 10px;
    display: flex;
    flex-wrap: nowrap;
    width: max-content;
}

label {
	margin-right: 5px; /* ボタン同士の間隔 */
}
label input {
	display: none; /* デフォルトのinputは非表示にする */
}
label span {
	color: #333; /* 文字色を黒に */
	font-size: 14px; /* 文字サイズを14pxに */
	border: 1px solid #ccc; /* 淵の線を指定 */
	border-radius: 20px; /* 角丸を入れて、左右が丸いボタンにする */
	padding: 5px 20px; /* 上下左右に余白をトル */
	background-color: #fff;
}
label input:checked + span {
	color: #FFF; /* 文字色を白に */
	background: #FBB; /* 背景色を薄い赤に */
	border: 1px solid #FBB; /* 淵の線を薄い赤に */
}


#testwrap2{

display:none;

}

.close_mark{
    cursor: pointer;
    margin-right: 0;
    margin-left: auto;
    display: block;
    width: 20px;
    font-size: 30px;
    font-weight: bold;
    color: #ca7d9d;
}


@media screen and (max-width: 789px) {

.inner{
overflow-y: scroll;
    height: 80%;
    padding: 10px;
    background-color: #fffde9;
    border: solid 2px #d7ceb6;
    border-radius: 5px;
    scrollbar-color: #FAF8D8 #deb394;
    scrollbar-width: thin;
}

#testwrap2{
  position: absolute;
  bottom: 0px;
  width: 100%;
  margin: 0 auto;
  display: none;
  height: 350px;
  background: #ffffff;
  z-index:500;
  font-size: 18px;
  padding: 10px 10px 40px 10px;
  box-sizing:border-box;
  overflow: hidden;
}

.close_mark{
    cursor: pointer;
margin-right: 0;
    margin-left: auto;
    display: block;
    width: 20px;
    font-size: 30px;
    font-weight: bold;
    color: #ca7d9d;
}

}


.leaflet-popup:not(.special-popup-wrap) .leaflet-popup-content {
    line-height: 0.3;
}


.popup_tokyo .leaflet-popup-content-wrapper { background: #f0ceb3; }
.popup_tokyo .leaflet-popup-tip             { background: #f0ceb3; }
.popup_tokyo .leaflet-popup-content { color: #110f0f; !important; font: bold 10pt monospace;margin: 4px;}
.popup_tokyo h3{margin: 0;}


/*エントリーボタンエリア*/
.bt_area{
    padding: 20px 0;
}

.button002 a {
    background: #4cc961;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    max-width: 220px;
    padding: 10px 25px;
    color: #fff;
    transition: 0.3s ease-in-out;
    font-weight: 500;
    text-decoration: none;
}

.button002 a::before {
	  margin-right: 10px;
	  padding-top: 2px;
	  color: #474747
	  font-size: .92em;
	  font-family: "Font Awesome 5 Free"; /*←ココ！！！！！！！*/
	  font-weight: 900;
	  content: "\f3cd";
}

.button002 a:hover {
    background: #8ccf98;
    color: #286736;
}

.button003 a {
    background: #ad637b;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    max-width: 220px;
    padding: 10px 25px;
    color: #fff;
    transition: 0.3s ease-in-out;
    font-weight: 500;
    text-decoration: none;
}

.button003 a::before {
	  margin-right: 10px;
	  padding-top: 2px;
	  color: #474747
	  font-size: .92em;
	  font-family: "Font Awesome 5 Free"; /*←ココ！！！！！！！*/
	  font-weight: 900;
	  content: "\f095";
}

.button003 a:hover {
    background: #cf98aa;
    color: #286736;
}

#re-search-prompt {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: white;
  padding: 1.2em 1.8em;
  box-shadow: 0 6px 20px rgba(0,0,0,0.2);
  border-radius: 12px;
  z-index: 9999;
  display: none;
  animation: fadeIn 0.3s ease;
  max-width: 90vw;
  width: 360px;
  text-align: center;
  font-size: 16px;
}

#re-search-prompt button {
  background-color: #43b762;
  color: white;
  border: none;
  padding: 0.6em 1.2em;
  font-size: 16px;
  border-radius: 8px;
  margin-top: 0.8em;
  cursor: pointer;
  transition: background 0.2s;
}

#re-search-prompt button:hover {
  background-color: #c32f3a;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translate(-50%, -60%);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%);
  }
}

@media screen and (max-width: 480px) {
  #re-search-prompt {
    width: 90vw;
    font-size: 15px;
    padding: 1em 1.5em;
    box-sizing: border-box;
  }

  #re-search-prompt button {
    width: 100%;
  }
}

#toast {
  position: fixed;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,0.75);
  color: #fff;
  padding: 0.7em 1.4em;
  border-radius: 6px;
  font-size: 14px;
  z-index: 9999;
  display: none;
  pointer-events: none;
  max-width: 90vw; /* ← スマホでは画面幅の90%までに制限 */
  word-break: keep-all;
  text-align: center;
  white-space: nowrap; /* 折り返しを防ぐ（必要に応じて外してOK） */
}

.modal-container {
    position: fixed;
    z-index: 10000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    justify-content: center;
    align-items: center;
    background: rgba(0,0,0,0.4);
}
.modal-container.active {
    display: flex;
}
.modal-content {
    background: #fff;
    padding: 20px 30px;
    border-radius: 6px;
    text-align: center;
    font-size: 16px;
}
.spinner {
    margin: 10px auto;
    width: 32px;
    height: 32px;
    border: 4px solid #ccc;
    border-top: 4px solid #333;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}
@keyframes spin {
    to { transform: rotate(360deg); }
}

.spinner {
  width: 48px;
  height: 48px;
  border: 6px solid #ddd;
  border-top-color: #19c064;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

/* PCのときだけカーソルをポインターに */
@media (hover: hover) and (pointer: fine) {
  .popup-clickable {
    cursor: pointer;
  }
}

.leaflet-popup:not(.special-popup-wrap) .leaflet-popup-content {
  line-height: 0.3;
  margin: 4px;
}



.leaflet-popup.popup_tokyo {
  z-index: 1100 !important;
}

.leaflet-popup-content-wrapper, .leaflet-popup-tip {
    background: rgb(255, 255, 255);
    color: #333;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3) !important;
}

/* モーダル全体 */
.modal-container {
  display: none;
  position: fixed;
  z-index: 10000;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  justify-content: center;
  align-items: center;
  /*padding: 20px;*/
}

/* モーダルの中身 */
.modal-content {
  background-color: #fff;
  padding: 20px 24px;
  border-radius: 10px;
  max-width: 90%;
  width: 320px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  text-align: center;
}

/* モーダルメッセージ */
#modal-message {
  font-size: 1.1em;
  margin-bottom: 1.5em;
  line-height: 1.5;
}

/* ボタン配置 */
.modal-buttons {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

/* 各ボタン */
.modal-buttons button {
  flex: 1;
  padding: 12px;
  font-size: 1em;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.3s;
}

/* 表示ボタン */
#modal-ok {
  background-color: #36bb58ff;
  color: white;
}

#modal-ok:hover {
  background-color: #2fa94e;
}

/* キャンセルボタン */
#modal-cancel {
  background-color: #ccc;
  color: #333;
}

#modal-cancel:hover {
  background-color: #bbb;
}

/* ✅ スマホ向けに位置を少し下げる */
@media (max-width: 768px) {
  .modal-container {
    align-items: flex-start;
  }

  .modal-content {
    margin-top: 20vh;
  }

  #modal-message {
      font-size: 0.9em;
  }  

}

#loading {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255,255,255,0.8);
  z-index: 99999;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  font-size: 18px;
  color: #333;
}

input,
textarea,
select {
  font-size: 16px; /* ✅ これがないとSafariが勝手にズーム */
}

/* ▼ 特別ポップアップ専用（.special-popup-wrap が付くやつ） */
.special-popup-wrap .leaflet-popup-content-wrapper {
  min-width: 320px !important;   /* 細くなりすぎ防止 */
  max-width: 360px !important;   /* PC上限（好みで 360〜480） */
  border-radius: 14px;
  box-shadow: 0 4px 18px rgba(0,0,0,0.12);
}
.special-popup-wrap .leaflet-popup-content {
  margin: 10px 12px !important;
  line-height: 1.5 !important;   /* 既存の line-height:0.3 を打ち消す */
  width: auto !important;
}

/* モバイルは画面幅に追従 */
@media (max-width: 768px) {
  .special-popup-wrap .leaflet-popup-content-wrapper {
    min-width: auto !important;
    max-width: 92vw !important;
  }
}

/* ▼ 既存（特別以外）のポップアップは従来通り詰める
   ※ あなたのCSSにある .leaflet-popup-content のグローバル指定を上書きして分離 */
.leaflet-popup:not(.special-popup-wrap) .leaflet-popup-content {
  line-height: 0.3;
  margin: 4px;
}

/* ▼ 既存の .popup_tokyo の !important 位置ミス修正（任意だが安全） */
.popup_tokyo .leaflet-popup-content {
  color: #110f0f !important;
  font: bold 10pt monospace;
  margin: 4px;
}

/* PC用（そのままでOK） */
.leaflet-popup.special-popup-wrap .leaflet-popup-content-wrapper {
  width: 380px !important;
  max-width: none !important;   /* Leafletの既定300pxを無効化 */
  min-width: 320px !important;
  box-sizing: border-box;
  border-radius: 14px;
  box-shadow: 0 4px 18px rgba(0,0,0,0.12) !important;
}
.leaflet-popup.special-popup-wrap .leaflet-popup-content {
  margin: 10px 12px !important;
  line-height: 1.5 !important;
  width: auto !important;
}

/* 📱スマホ用に幅を“画面幅基準”に強制 */
@media (max-width: 789px) {
  .leaflet-popup.special-popup-wrap,
  .leaflet-popup.special-popup-wrap * {
    box-sizing: border-box;
  }
  .leaflet-popup.special-popup-wrap .leaflet-popup-content-wrapper {
    /*width: calc(100vw - 32px) !important; /* 画面左右16px余白 */
    max-width: none !important;
    min-width: 0 !important;
    border-radius: 12px;
  }
  .leaflet-popup.special-popup-wrap .leaflet-popup-content {
    margin: 12px 14px !important;
    line-height: 1.6 !important;
    overflow-wrap: anywhere;
    word-break: break-word;           /* 長い単語でのはみ出し防止 */
    -webkit-line-break: anywhere;     /* iOS対策 */
  }
}

/* ▼ 特別モーダル専用の上書き（他のモーダルには影響なし） */

/* 特別モーダルは中央寄せをやめて上寄せにする */
#special-modal {
  display: none;          /* .active で flex になるのは既存どおり */
  align-items: flex-start; /* ← 縦方向は上寄せ */
  justify-content: center; /* ← 横は中央 */
  padding-top: 150px;      /* ← ここで「上から150px」相当の位置に */
  box-sizing: border-box;
  width:100%;
}
#special-modal.active { display: flex; }

/* 中身：横は中央、幅は任意で */
#special-modal .modal-content {
  width: 80%;
  max-width: 560px;   /* 好みで 420〜640px */
  margin: 0 auto;     /* 横中央固定 */
  text-align: center; /* 全体中央寄せ */
}



/* 📱スマホはノッチ等のセーフエリアを考慮して少し調整（任意） */
@media (max-width: 789px) {
  #special-modal {
    padding-top: calc(150px + env(safe-area-inset-top, 0px));
    padding-left:  max(16px, env(safe-area-inset-left, 0px));
    padding-right: max(16px, env(safe-area-inset-right, 0px));
    padding-bottom:max(16px, env(safe-area-inset-bottom, 0px));
  }

  /* タイトルは中央のまま */
  #special-modal .modal-content h2,
  #special-modal .modal-content h3 {
    text-align: center;
  }

  /* タイトル以外は左寄せ */
  #special-modal .modal-content p,
  #special-modal .modal-content ul,
  #special-modal .modal-content ol,
  #special-modal .modal-content div,
  #special-modal .modal-content span {
    text-align: left;
  }

}

#info-modal {
  position: fixed;
  top: 0; left: 0;
  width: 100vw; height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999999; /* ← かなり上に */
}

.modal-overlay {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.5);
}

.modal-content {
  position: relative;
  background: #fff;
  border-radius: 8px;
  padding: 20px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
  max-width: 400px;
  width: 80vw;
  max-height: 80vh;
  overflow-y: auto;
  z-index: 10001;

  /* 通常は真ん中 */
  transform: translateY(0);
  transition: transform 0.3s ease;
}

.modal-close {
  position: absolute;
  top: 10px;
  right: 14px;
  font-size: 24px;
  font-weight: bold;
  color: #333;
  cursor: pointer;
}

.modal-open {
  overflow: hidden;
  height: 100%;
  touch-action: none;
}

.modal-title {
  text-align: center;
  font-size: 1.2em;
  margin-bottom: 12px;
}

.modal-message {
  text-align: center;
  font-size: 14px;
  line-height: 1.6;
  word-break: break-word;
}

.modal-footer {
  margin-top: 20px;
  text-align: center;
}

.modal-close-btn {
  padding: 10px 20px;
  background-color: #666;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 16px;
  cursor: pointer;
}

.modal-close-btn:hover {
  background-color: #444;
}

/* スマホでは少し上へ（画面サイズが768px以下の場合） */
@media screen and (max-width: 768px) {
  #info-modal {
    align-items: flex-start;
  }
  .modal-content {
    margin-top: 150px;
  }

  .modal-message {
  text-align: left;
  }

}

/* ベース: 右下で背景なし・影なし・極薄表示 */
.leaflet-control-attribution {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  padding: 0 4px !important;
  margin: 0 6px 4px 0 !important;
  line-height: 1.1 !important;
  font-size: 10px !important;
  letter-spacing: 0.01em;
  color: rgba(0, 0, 0, 0.22) !important; /* 明色地図向けに薄いグレー */
  text-shadow: none !important;
  opacity: 0.10;                         /* ほぼ見えない */
  transition: opacity .2s ease, color .2s ease, filter .2s ease;
}

/* リンクは下線消し・色は継承で馴染ませる */
.leaflet-control-attribution a {
  color: inherit !important;
  text-decoration: none !important;
  border-bottom: 0 !important;
  pointer-events: auto; /* クリックは可能にしておく */
}

/* ホバー/フォーカス/タップ時だけハッキリ（アクセシビリティ確保） */
.leaflet-control-attribution:hover,
.leaflet-control-attribution:focus-within {
  opacity: 0.95;
  color: rgba(0, 0, 0, 0.8) !important;
}

/* モバイルはさらに控えめ（でも読める範囲） */
@media (max-width: 768px) {
  .leaflet-control-attribution {
    font-size: 9px !important;
    opacity: 0.12;
    margin: 0 4px 3px 0 !important;
    padding: 0 3px !important;
  }
}

/* ダーク系タイルを使うページ（例: #mapを暗色にしている等）のための上書き */
.map--dark .leaflet-control-attribution {
  color: rgba(255, 255, 255, 0.28) !important;
}
.map--dark .leaflet-control-attribution:hover,
.map--dark .leaflet-control-attribution:focus-within {
  color: rgba(255, 255, 255, 0.92) !important;
  opacity: 0.95;
}



/* ----------------------------------
   地図表示
---------------------------------- */
/* ページ全体でスクロールを殺している指定があれば打ち消す */
html, body {
  height: auto !important;
  min-height: 100% !important;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch; /* iOSの慣性スクロール */
  overscroll-behavior-y: none;       /* 変な引っかかり防止（必要なら） */
}

/* #wrap に hidden が残っていると下が見えなくなる */
#wrap {
  position: static !important;
  height: auto !important;
  overflow: visible !important;
}

/* 地図は全画面でOK */
#map {
  height: 100svh;
  min-height: 100vh;
}

/* 固定ボタンに隠れて“最下部が触れない”のを防止（スマホ下部の余白） */
body {
  padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px));
}

/* 固定ヘッダーがあるならアンカーの食い込みを回避 */
#latest-jobs {
  scroll-margin-top: 80px; /* ヘッダー高に合わせて調整 */
}

/* ----------------------------------
   固定ジャンプリンク（画面外に独立配置）
---------------------------------- */
.jump-link {
  position: fixed;
  left: 50%;
  bottom: 12px;
  transform: translateX(-50%);
  z-index: 999999;             /* 最前面 */
  pointer-events: auto;
  touch-action: manipulation;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);

  background: rgba(255,255,255,.9);
  border: 1px solid #eee;
  border-radius: 999px;
  padding: 10px 16px;
  font-size: 13px;
  text-decoration: none;
  color: #0a65cc;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}

/* ----------------------------------
   ラベル切替
---------------------------------- */
.jump-open  { display: inline-flex; }
.jump-close { display: none; }

/* #latest-jobs がターゲット状態で反転 */
body:has(#latest-jobs:target) .jump-open  { display: none; }
body:has(#latest-jobs:target) .jump-close { display: inline-flex; }

/* ----------------------------------
   固定ヘッダーがある場合のスクロール補正
---------------------------------- */
#latest-jobs {
  scroll-margin-top: 80px; /* 固定ヘッダーの高さに応じて調整 */
}

/* スムーススクロールで移動 */
html, body {
  scroll-behavior: smooth;
}

/* ボタンの基本デザイン */
.jump-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, .9);
  border: 1px solid #eee;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 13px;
  text-decoration: none;
  color: #0a65cc;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  pointer-events: auto;
  transition: background 0.2s, color 0.2s;
}
.jump-link:hover {
  background: #0a65cc;
  color: #fff;
}

/* デフォルトは「下へ」を表示、「上へ」を隠す */
.jump-open  { display: inline-flex; }
.jump-close { display: none; }

/* #latest-jobs がターゲットのときだけ反転表示 */
body:has(#latest-jobs:target) .jump-open  { display: none; }
body:has(#latest-jobs:target) .jump-close { display: inline-flex; }

/* セクション全体 */
#latest-jobs {
  background: #f7f9fc;
  padding: 24px 16px 96px; /* 下は固定ボタン考慮で少し多め */
}

/* タイトル */
#latest-jobs .jobs-title {
  max-width: 1080px;
  margin: 0 auto 12px;
  font-size: 1.25rem;
  font-weight: 700;
  color: #9e551c;
}

/* 絞り込みサマリー等（任意） */
#latest-jobs .jobs-summary {
  max-width: 1080px;
  margin: 0 auto 16px;
  font-size: 0.95rem;
  color: #6b7280;
}

/* リストグリッド */
#latest-jobs .jobs-list {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

@media (min-width: 640px) {
  #latest-jobs .jobs-list { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
  #latest-jobs .jobs-list { grid-template-columns: 1fr 1fr 1fr; }
}

/* カード */
#latest-jobs .job-item {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 14px;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  transition: transform .12s ease, box-shadow .12s ease;
}
#latest-jobs .job-item:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(0,0,0,.08);
}

/* タイトルリンク */
#latest-jobs .job-title {
  display: inline-block;
  font-weight: 700;
  color: #2cb029;
  text-decoration: none;
  margin-bottom: 6px;
  /* ↓追加（省略表示用） */
  max-width: 100%;              /* 親幅に収める */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;          /* 1行で省略 */  
}
#latest-jobs .job-title:hover { text-decoration: underline; }

/* メタ情報（時給・エリアなど） */
#latest-jobs .job-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 0.9rem;
  color: #4b5563;
  margin-bottom: 6px;
}

/* 説明文 */
#latest-jobs .job-desc {
  font-size: 0.95rem;
  color: #374151;
  line-height: 1.6;
  /* ↓追加（2行省略） */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;  
}

/* もっと見る */
#latest-jobs .jobs-more {
  max-width: 1080px;
  margin: 14px auto 0;
  text-align: center;
}
#latest-jobs .jobs-more a {
  display: inline-block;
  text-decoration: none;
  color: #0a65cc;
  padding: 8px 14px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #e5e7eb;
}
#latest-jobs .jobs-more a:hover {
  background: #0a65cc;
  color: #fff;
}