/* ろうどうぶつ（roudoubutsu.jp）だけの見た目。スマホファースト。functions.php が site key=roudoubutsu のときだけ読む。
   ちいかわのように、白地にやさしいパステル・丸いフォント・手描きの絵が主役。片側だけの線は使わない。 */
:root {
  --rb-ink: #4a3b36; --rb-soft-ink: #8a7a73; --rb-bg: #fffaf6; --rb-line: #3a2e2a;
  --rb-pink: #e9849c; --rb-pink-soft: #fdeef2; --rb-yellow: #f6c75b; --rb-mint: #4fb08b; --rb-sky: #dfeefc;
  --rb-radius: 22px;
}
body { font-family: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", sans-serif; color: var(--rb-ink); background: var(--rb-bg)
  radial-gradient(circle at 1px 1px, rgba(233, 132, 156, .13) 1.5px, transparent 1.6px) 0 0 / 22px 22px; }
.l-content, .l-mainContent { background: transparent; }
html, body { overflow-x: hidden; }
.post_content { overflow-wrap: anywhere; }
.post_content a.rb-card, .post_content a.rb-place, .post_content a.rb-sns, .post_content a.rb-btn, .post_content .rb-card *, .post_content .rb-place * { text-decoration: none !important; }
.post_content a.rb-card, .post_content a.rb-place { color: var(--rb-ink); }
.post_content a.rb-sns, .post_content a.rb-btn:not(.rb-btn--ghost) { color: #fff; }
.post_content { font-size: 16px; line-height: 1.9; }
.post_content h2:not(.rb-h) { border-radius: var(--rb-radius); }

/* 見出し */
.post_content .rb-h, .rb-h { position: relative; margin: 0 auto 18px; padding: 0; background: none; border: 0; text-align: center;
  font-size: 1.3rem; font-weight: 900; letter-spacing: .06em; color: var(--rb-ink); }
.post_content .rb-h::before, .rb-h::before { content: ""; display: block; width: 46px; height: 10px; margin: 0 auto 8px; border-radius: 10px;
  background: radial-gradient(circle, var(--rb-pink) 4px, transparent 4.5px) 0 0 / 15px 10px repeat-x; }
.post_content .rb-h::after { display: none; }
.rb-sec { margin: 0 0 44px; }
.rb-sec--soft { padding: 26px 16px 22px; background: var(--rb-pink-soft); border-radius: 28px; }
.rb-center { text-align: center; }
.rb-note { font-size: .82rem; color: var(--rb-soft-ink); text-align: center; }
.rb-more { text-align: center; margin-top: 14px; }
.rb-sec .rb-center:has(.rb-btn) { margin-top: 22px; }
.rb-more a { font-weight: 700; color: var(--rb-pink); text-decoration: none; }
.rb-more a::after { content: " →"; }
.rb-wide { display: block; width: 100%; height: auto; border-radius: var(--rb-radius); border: 3px solid var(--rb-line); }

/* トップの大きな絵 */
.rb-hero { margin: -8px -4vw 34px; padding-top: 0; position: relative; overflow: hidden; }
.rb-hero__img { display: block; width: 100%; height: 62vw; max-height: 520px; object-fit: cover; object-position: center 60%; }
.rb-hero__text { position: relative; margin: -42px 16px 0; padding: 20px 16px 18px; text-align: center; background: #fff;
  border: 3px solid var(--rb-line); border-radius: 28px; box-shadow: 0 6px 0 var(--rb-line); }
.rb-hero__kicker { margin: 0; font-weight: 700; color: var(--rb-pink); letter-spacing: .1em; }
.post_content .rb-hero__logo, .rb-hero__logo { margin: 2px 0 6px; padding: 0; background: none; border: 0; font-size: 2.6rem; font-weight: 900;
  letter-spacing: .04em; line-height: 1.15; color: var(--rb-ink); text-shadow: 3px 3px 0 var(--rb-yellow); }
.rb-hero__logo::before, .rb-hero__logo::after { display: none !important; }
.rb-hero__logo img { display: block; width: 100%; max-width: 380px; height: auto; margin: 0 auto; }
.c-headLogo__img { max-height: 56px; width: auto; }
.rb-hero__lead { margin: 0; font-size: .95rem; line-height: 1.7; }

/* キャラのカード（スマホは2列） */
/* スマホは横スクロール（1枚ずつ止まる・次のカードを少しのぞかせる） */
.rb-cards { display: flex; gap: 12px; margin: 0 -4vw; padding: 4px 4vw 14px; overflow-x: auto; scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.rb-cards::-webkit-scrollbar { display: none; }
.rb-cards > .rb-card { flex: 0 0 62%; scroll-snap-align: start; }
.rb-cards::after { content: ""; flex: 0 0 1px; }
.rb-card { display: flex; flex-direction: column; align-items: center; padding: 10px 8px 12px; text-decoration: none; color: var(--rb-ink);
  background: #fff; border: 3px solid var(--rb-line); border-radius: var(--rb-radius); box-shadow: 0 4px 0 var(--rb-line);
  transition: transform .15s; }
.rb-card:active, .rb-card:hover { transform: translateY(-3px) rotate(-1deg); }
.rb-card__img { display: flex; align-items: flex-end; justify-content: center; width: 100%; height: 210px; border-radius: 16px;
  background: var(--card-bg, var(--rb-pink-soft)); overflow: hidden; }
.rb-card__img img { max-height: 196px; width: auto; }
.rb-card__place { margin-top: 8px; font-size: .68rem; color: var(--rb-soft-ink); }
.rb-card__name { font-size: 1.15rem; font-weight: 900; line-height: 1.3; }
.rb-card__role { font-size: .72rem; color: var(--rb-soft-ink); text-align: center; line-height: 1.4; }

/* はたらく場所 */
.rb-places { display: grid; gap: 14px; }
.rb-place { display: grid; grid-template-columns: 96px minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; column-gap: 12px; padding: 12px 16px;
  text-decoration: none; color: var(--rb-ink); background: var(--card-bg); border: 3px solid var(--rb-line); border-radius: var(--rb-radius);
  box-shadow: 0 4px 0 var(--rb-line); }
.rb-place img { grid-row: 1 / 3; max-height: 110px; width: auto; justify-self: center; }
.rb-place__name { font-size: 1.15rem; font-weight: 900; align-self: end; }
.rb-place__sub { font-size: .8rem; color: var(--rb-soft-ink); align-self: start; }

/* 吹き出し（キャラのセリフ） */
.rb-talk { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 18px; }
.rb-talk--right { flex-direction: row-reverse; }
.rb-talk__icon { flex: 0 0 64px; width: 64px; height: 64px; object-fit: cover; object-position: center 4%; background: #fff;
  border: 3px solid var(--rb-line); border-radius: 50%; }
.rb-talk__body { position: relative; padding: 10px 14px; background: #fff; border: 3px solid var(--rb-line); border-radius: 18px; }
.rb-talk__body p { margin: 0; font-size: .95rem; line-height: 1.7; }
.rb-talk__name { display: block; font-size: .72rem; font-weight: 700; color: var(--rb-pink); }

/* ボタン */
.rb-btn { display: inline-block; padding: 14px 30px; font-size: 1.05rem; font-weight: 900; color: #fff; text-decoration: none;
  background: var(--rb-mint); border: 3px solid var(--rb-line); border-radius: 999px; box-shadow: 0 5px 0 var(--rb-line); }
.rb-btn:active { transform: translateY(3px); box-shadow: 0 2px 0 var(--rb-line); }
.rb-btn--ghost { color: var(--rb-ink); background: #fff; }
.rb-snsrow { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.rb-snsrow > .rb-sns { flex: 1 1 140px; max-width: 240px; }
.rb-sns { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 56px; padding: 8px; font-weight: 900;
  font-size: .92rem; text-decoration: none; color: #fff; border: 3px solid var(--rb-line); border-radius: 18px; box-shadow: 0 4px 0 var(--rb-line); }
.rb-sns--tiktok { background: #2b2b2b; } .rb-sns--youtube { background: #e05252; } .rb-sns--line { background: #3fbf5f; }
.rb-sns.is-soon { opacity: .45; box-shadow: none; }
.rb-sns small { font-size: .65rem; font-weight: 500; }

/* キャラのプロフィール */
.rb-profile { margin: -8px -4vw 30px; padding: 20px 16px 22px; text-align: center; background: var(--card-bg); border-radius: 0 0 36px 36px; }
.rb-profile__img img { max-height: 300px; width: auto; filter: drop-shadow(0 6px 0 rgba(58, 46, 42, .15)); }
.rb-profile__kana { margin: 6px 0 0; font-size: .8rem; color: var(--rb-soft-ink); letter-spacing: .1em; }
.post_content .rb-profile__name, .rb-profile__name { margin: 0 0 8px; padding: 0; background: none; border: 0; font-size: 2rem; font-weight: 900; color: var(--rb-ink); }
.rb-profile__name::before, .rb-profile__name::after { display: none !important; }
.rb-profile__persona { margin: 0 auto 12px; max-width: 34em; font-size: .95rem; text-align: left; }
.rb-phrases { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 0; padding: 0; list-style: none; }
.rb-phrases li { padding: 6px 14px; font-weight: 700; background: #fff; border: 3px solid var(--rb-line); border-radius: 999px; }
.rb-dl { display: grid; grid-template-columns: 6.5em 1fr; gap: 2px; margin: 0; background: #ead8d3; border: 3px solid var(--rb-line); border-radius: var(--rb-radius); overflow: hidden; }
.rb-dl dt, .rb-dl dd { margin: 0; padding: 10px 12px; font-size: .92rem; background: #fff; }
.rb-dl dt { font-weight: 900; background: var(--rb-pink-soft); }

/* 職場のページの頭 */
.rb-placehero { display: flex; gap: 12px; align-items: center; margin: -8px -4vw 22px; padding: 18px 16px; background: var(--card-bg); border-radius: 0 0 32px 32px; }
.rb-placehero img { max-height: 160px; width: auto; }
.rb-placehero p { margin: 0; font-size: .9rem; }

/* 診断（media-kit の部品）をキャラの世界に寄せる */
.mk-shindan { border: 3px solid var(--rb-line) !important; border-radius: var(--rb-radius) !important; box-shadow: 0 5px 0 var(--rb-line); }

/* あなたへ枠（CROで差し替え）。既定は「全員向け」。CRO が [data-cd-slot=seg-style] に style を入れて看護・保育に切り替える */
.rb-seg--kango, .rb-seg--hoiku { display: none; }
.rb-focus { margin: 0 0 40px; padding: 18px 14px 20px; background: #fff; border: 3px solid var(--rb-line); border-radius: var(--rb-radius); box-shadow: 0 5px 0 var(--rb-line); }
.rb-focus__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 10px; }
.rb-btn--yellow { background: var(--rb-yellow); color: var(--rb-ink) !important; }

/* キャラ同士の会話 */
.rb-chat { margin: 0 0 14px; }
.rb-chat .rb-talk { margin-bottom: 12px; }
.rb-talk--right .rb-talk__body { background: var(--rb-pink-soft); }
.post_content .rb-h3, .rb-h3 { margin: 22px 0 10px; padding: 0; background: none; border: 0; font-size: 1.02rem; font-weight: 900; color: var(--rb-ink); }
.rb-h3::before, .rb-h3::after { display: none !important; }
.rb-place.is-soon { opacity: .6; box-shadow: none; }
.rb-place.is-soon img { max-height: 54px; }

/* 記事のカード（スマホは横スクロール） */
.mk-posts { display: flex; gap: 12px; margin: 0 -4vw; padding: 4px 4vw 14px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.mk-posts::-webkit-scrollbar { display: none; }
.mk-posts__item { flex: 0 0 70%; scroll-snap-align: start; display: block; text-decoration: none !important; color: var(--rb-ink) !important; background: #fff;
  border: 3px solid var(--rb-line); border-radius: 18px; overflow: hidden; box-shadow: 0 4px 0 var(--rb-line); }
.mk-posts__img img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.mk-posts__title { display: block; padding: 10px 12px; font-weight: 700; font-size: .92rem; line-height: 1.5; }
.mk-posts__empty { margin: 0 0 18px; padding: 14px; text-align: center; color: var(--rb-soft-ink); background: #fff; border: 3px dashed #e6d4cf; border-radius: 18px; }

/* 見出しの横の小さなキャラ・のぞくキャラ・ならぶキャラ */
.rb-h__chara { display: block; height: 54px; width: auto; margin: 0 auto 2px; }
.post_content .rb-h:has(.rb-h__chara)::before { display: none; }
.rb-sec--soft { position: relative; margin-top: 70px; }
.rb-peek { position: absolute; top: -62px; right: 18px; height: 78px; width: auto; transform: rotate(6deg); }
.rb-crowd { display: flex; justify-content: center; align-items: flex-end; gap: 2px; margin: 4px 0 -10px; }
.rb-crowd img { height: 84px; width: auto; }
.rb-crowd img:nth-child(odd) { transform: rotate(-5deg); } .rb-crowd img:nth-child(even) { transform: rotate(5deg) translateY(-4px); }

/* 診断の結果をキャラが話す形に */
.shindan-result { background: #fff !important; border: 3px solid var(--rb-line); border-radius: var(--rb-radius) !important; box-shadow: 0 5px 0 var(--rb-line); }
.shindan-result__label { color: var(--rb-pink) !important; }
.shindan-result__who { display: flex; gap: 12px; align-items: flex-start; margin: 6px 0 12px; }
.shindan-result__who img { flex: 0 0 92px; width: 92px; height: auto; }
.shindan-result__say { position: relative; flex: 1; min-width: 0; padding: 12px 14px; background: var(--rb-pink-soft); border-radius: 18px; }
.shindan-result__say::before { content: ""; position: absolute; left: -9px; top: 22px; width: 16px; height: 16px; background: var(--rb-pink-soft); transform: rotate(45deg); }
.shindan-result__name { display: block; font-size: .78rem; font-weight: 900; color: var(--rb-pink); }
.shindan-result__say .shindan-result__title { font-size: 1.15rem !important; margin: 2px 0 6px !important; }
.shindan-result__say p { margin: 0; font-size: .92rem; line-height: 1.75; }
.shindan-result__tipwrap { display: flex; gap: 10px; align-items: center; margin: 0 0 16px; padding: 10px 14px; background: var(--rb-sky); border-radius: 18px; }
.shindan-result__tipwrap[hidden] { display: none; }
.shindan-result__tipwrap img { flex: 0 0 58px; width: 58px; height: auto; }
.shindan-result__tipwrap .shindan-result__name { color: #5c7fa3; }
.shindan-result__tipwrap .shindan-result__tip { margin: 0 !important; padding: 0; background: none; font-size: .92rem; }
.shindan { border: 3px solid var(--rb-line) !important; border-radius: var(--rb-radius) !important; box-shadow: 0 5px 0 var(--rb-line); }
.shindan__q span { font-size: 1.05rem !important; }
.shindan select { border: 3px solid var(--rb-line) !important; border-radius: 16px !important; }
.shindan__go { background: var(--rb-mint) !important; border: 3px solid var(--rb-line) !important; box-shadow: 0 5px 0 var(--rb-line); }

/* PC（幅が広いときだけ並べ方を変える） */
@media (min-width: 760px) {
  .rb-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0; overflow: visible; }
  .rb-cards::after { display: none; }
  .rb-card__img { height: 160px; } .rb-card__img img { max-height: 150px; }
  .mk-posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 0; overflow: visible; }
  .rb-places { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px; }
  .rb-places > * { flex: 0 1 260px; min-width: 0; }
  .rb-place img { max-width: 100%; height: auto; }
  .rb-place { grid-template-columns: 1fr; grid-template-rows: auto auto auto; justify-items: center; text-align: center; padding: 18px 16px 20px; row-gap: 4px; }
  .rb-place img { grid-row: auto; max-height: 150px; }
  .rb-place.is-soon img { max-height: 70px; margin: 40px 0 36px; }
  .rb-place__name, .rb-place__sub { align-self: auto; }
  .rb-snsrow > .rb-sns { flex: 0 1 220px; }
  .rb-hero { margin: 0 0 48px; padding-top: 32px; overflow: visible; }
  .rb-hero__img { height: 440px; max-height: none; border: 3px solid var(--rb-line); border-radius: 32px; object-position: center 72%; }
  .rb-hero__text { margin: -64px auto 0; max-width: 460px; padding: 18px 20px 16px; }
  .post_content .rb-hero__logo, .rb-hero__logo { font-size: 3rem; }
  .rb-profile, .rb-placehero { margin: 0 0 30px; border-radius: 36px; }
  .rb-profile { display: flex; gap: 24px; align-items: center; text-align: left; padding: 26px 30px; }
  .rb-phrases { justify-content: flex-start; }
}

/* 占い */
.rb-uranai__form { display: grid; gap: 14px; padding: 18px; background: #fff; border: 3px solid var(--rb-line); border-radius: var(--rb-radius); box-shadow: 0 5px 0 var(--rb-line); }
.rb-uranai__form label { display: grid; gap: 6px; font-weight: 900; }
.rb-uranai__row { display: flex; gap: 8px; }
.rb-uranai__form select { flex: 1; padding: 12px; font-size: 1rem; border: 3px solid var(--rb-line); border-radius: 14px; background: #fff; }
.rb-uranai__form .rb-btn { justify-self: center; cursor: pointer; }
.rb-uranai__result { margin-top: 22px; padding: 18px; background: #fff; border: 3px solid var(--rb-line); border-radius: var(--rb-radius); }
.rb-uranai__date { margin: 0; text-align: center; font-weight: 700; color: var(--rb-pink); }
.rb-uranai__who { display: flex; gap: 14px; align-items: center; justify-content: center; margin: 8px 0 14px; }
.rb-uranai__who img { width: 110px; height: auto; }
.rb-uranai__type { margin: 0; line-height: 1.5; } .rb-uranai__type strong { font-size: 1.6rem; }
.rb-uranai__stars { margin: 4px 0 0; color: var(--rb-yellow); font-size: 1.2rem; letter-spacing: .1em; }
.rb-uranai__lucky { text-align: center; }
.rb-share { display: flex; gap: 10px; justify-content: center; margin: 12px 0; }
.rb-share .rb-sns { flex: 0 1 150px; min-height: 46px; }
.rb-sns--x { background: #111; }

/* ゲーム */
.rb-game__next img { width: 24px; height: 24px; }
#rb-game { max-width: 400px; margin: 0 auto; }
.rb-game__bar { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 8px; font-weight: 700; font-size: .9rem; }
.rb-game__next b { display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px 2px 4px; border: 2px solid var(--rb-line); border-radius: 999px; font-size: .8rem; }
.rb-game__stage { position: relative; }
.rb-game__stage canvas { display: block; width: 100%; height: auto; aspect-ratio: 2 / 3; border: 3px solid var(--rb-line); border-radius: 18px; touch-action: none; background: #fff8f2; }
.rb-game__flash { position: absolute; left: 50%; top: 30%; transform: translateX(-50%); margin: 0; padding: 8px 16px; white-space: nowrap; font-weight: 900; color: #fff;
  background: #e0473f; border: 3px solid var(--rb-line); border-radius: 999px; }
.rb-game__flash[hidden] { display: none; }
.rb-game__start, .rb-game__over { position: absolute; inset: 0; border-radius: 18px; }
.rb-game__start { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; background: rgba(255, 250, 246, .95); }
.rb-game__start[hidden], .rb-game__over[hidden] { display: none; }
.rb-game__start p { margin: 0; font-weight: 700; }
.rb-game__title { font-size: 1.5rem; font-weight: 900 !important; }
.rb-game__jobs { display: flex; flex-direction: column; gap: 14px; margin-top: 6px; }
.rb-game__start .rb-btn { width: 200px; cursor: pointer; }
.rb-game__over { overflow-y: auto; padding: 12px; background: rgba(74, 59, 54, .45); }
.rb-game__card { padding: 16px 14px; text-align: center; background: #fff; border: 3px solid var(--rb-line); border-radius: 20px; }
.rb-game__card p { margin: 0; }
.rb-game__label { font-weight: 900; color: var(--rb-pink); }
.rb-game__big { font-size: 1.15rem; font-weight: 900; } .rb-game__big strong { font-size: 2.2rem; }
.rb-game__sub { margin-bottom: 10px !important; font-size: .82rem; color: var(--rb-soft-ink); }
.rb-game__card .rb-chat { text-align: left; }
.rb-game__card .rb-btn { padding: 11px 20px; font-size: .95rem; cursor: pointer; }
.rb-game__card .rb-center { margin: 14px 0 0 !important; }
.rb-game__card .rb-share { gap: 12px; margin: 18px 0 14px; } .rb-game__card .rb-share .rb-sns { min-height: 40px; font-size: .82rem; white-space: nowrap; }
.rb-game__row { display: flex; gap: 12px; justify-content: center; margin-top: 14px; } .rb-game__row .rb-btn { flex: 1; padding: 9px 8px; font-size: .85rem; }

/* WordPress の自動整形（wpautop）が並びの中に入れる <p>・<br> を、並びに影響させない */
:is(.rb-zk__head, .rb-steps, .rb-places, .rb-cards, .rb-snsrow, .rb-crowd, .rb-chat, .rb-talk, .rb-game__start, .rb-game__jobs, .rb-game__row, .rb-share, .rb-focus__btns, .rb-uranai__form) > p { display: contents; }
:is(.rb-zk__head, .rb-steps, .rb-places, .rb-cards, .rb-snsrow, .rb-crowd, .rb-chat, .rb-talk, .rb-place, .rb-card) br { display: none; }

/* 運営者情報などの表をスマホ幅に収める */
.post_content table { width: 100%; min-width: 0 !important; table-layout: fixed; }
.post_content th, .post_content td { overflow-wrap: anywhere; word-break: break-word; }
.post_content table th { width: 7em; }

/* 日本語の改行を文節で（「カピ/子」のような変な折り返しを防ぐ） */
.rb-h, .rb-place__name, .rb-place__sub, .rb-card__name, .rb-card__sub, .rb-talk__body p, .rb-center, .rb-note, .rb-game__card p, .post_content h2, .post_content h3, .c-pageTitle { word-break: auto-phrase; }
.rb-place__name { line-height: 1.45; }
.rb-after-cards { margin-top: 28px !important; }

/* ゲームページ：ろうどう町の夕暮れの世界観 */
.rb-gamehero { position: relative; margin: 0 0 28px; border: 3px solid var(--rb-line); border-radius: 24px; overflow: hidden; background: #c9c3e6; box-shadow: 0 5px 0 var(--rb-line); }
.rb-gamehero__img { display: block; width: 100%; height: auto; aspect-ratio: 1400 / 781; object-fit: cover; opacity: 1 !important; }
.rb-gamehero__text { padding: 18px 16px 20px; text-align: center; background: #fff; border-top: 3px solid var(--rb-line); }
.rb-gamehero__kicker { display: inline-block; margin-bottom: 8px; padding: 3px 14px; border-radius: 999px; background: var(--rb-line); color: #fff; font-size: .8rem; font-weight: 700; letter-spacing: .08em; }
.rb-gamehero__title { font-size: clamp(1.9rem, 8.4vw, 3rem); font-weight: 900; line-height: 1.15; letter-spacing: .02em; }
.rb-gamehero__title span { color: var(--c); -webkit-text-stroke: 1.5px var(--rb-line); paint-order: stroke fill; text-shadow: 0 3px 0 var(--rb-line); display: inline-block; }
.rb-gamehero__title span:nth-child(odd) { transform: translateY(-2px) rotate(-3deg); } .rb-gamehero__title span:nth-child(even) { transform: translateY(2px) rotate(3deg); }
.rb-gamehero__lead { margin-top: 10px; font-weight: 700; color: var(--rb-soft-ink); line-height: 1.6; }
.rb-gamezone { margin: 24px -4vw 0; padding: 22px 4vw 26px; background: linear-gradient(180deg, #b9b4e3 0%, #e8b9c8 55%, #f6d3b8 100%); border-radius: 26px; }
.rb-gamezone .rb-game__bar { color: #fff; text-shadow: 0 1px 0 rgba(74,59,54,.5); }
.rb-gamezone .rb-game__next b { background-clip: padding-box; color: var(--rb-line); text-shadow: none; }
.rb-gamezone .rb-note { margin-top: 14px; padding: 10px 14px; background: rgba(255,255,255,.85); border-radius: 14px; }
.rb-gamezone .rb-game__stage canvas { background: #f6d3cf; box-shadow: 0 5px 0 var(--rb-line); }
.rb-game__start { background: linear-gradient(180deg, rgba(255,248,244,.25) 0%, rgba(255,248,244,.82) 30%, rgba(255,248,244,.82) 62%, rgba(255,248,244,.1) 82%); }
.rb-place__name > span { display: inline-block; }
.rb-game__start .rb-game__title { font-size: 1.6rem; font-weight: 900; }
.rb-game__start .rb-game__q { font-weight: 700; }
@media (min-width: 960px) { .rb-gamezone { margin: 28px 0 0; padding: 32px 24px 34px; } .rb-gamehero__text { padding: 22px 24px 26px; } }

/* スマホは全画面で遊ぶ */
.rb-game__close, .rb-game__home { display: none; }
.rb-game__top { display: flex; align-items: center; justify-content: flex-end; max-width: 400px; margin: 0 auto 10px; }
.rb-game__topbtns { display: flex; gap: 8px; }
.rb-game__sound { display: inline-flex; align-items: center; padding: 6px 14px; border: 2px solid var(--rb-line); border-radius: 999px; background: #fff; color: var(--rb-line); font: inherit; font-size: .85rem; font-weight: 700; cursor: pointer; }
.rb-game__sound.is-off { background: #eee6e3; color: #8a7a74; }
html.rb-noscroll, html.rb-noscroll body { overflow: hidden; }
.rb-gamezone.is-full { position: fixed; top: 0; left: 0; right: 0; height: var(--rb-vh, 100vh); bottom: auto; z-index: 100000; margin: 0; border-radius: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: calc(env(safe-area-inset-top) + 8px) 12px calc(env(safe-area-inset-bottom) + 12px); overscroll-behavior: contain; }
.rb-gamezone.is-full #rb-game { width: 100%; max-width: min(100%, calc((var(--rb-vh, 100vh) - 150px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) * 2 / 3)); }
.rb-gamezone.is-full .rb-note { display: none; }
.rb-gamezone.is-full .rb-game__home { display: block; }
.rb-gamezone.is-full .rb-game__top { display: flex; align-items: center; justify-content: space-between; width: 100%; max-width: min(100%, calc((var(--rb-vh, 100vh) - 150px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) * 2 / 3)); margin: 0 0 10px; }
.rb-game__home img { display: block; height: 30px; width: auto; filter: drop-shadow(0 1px 0 #fff); }
.rb-gamezone.is-full .rb-game__close { display: inline-flex; align-items: center; margin: 0; padding: 6px 14px; border: 2px solid var(--rb-line); border-radius: 999px; background: #fff; color: var(--rb-line); font: inherit; font-size: .85rem; font-weight: 700; cursor: pointer; }

/* ゲーム終了画面：診断ボタンとシェアの間をあける（p の中の inline-block が p の高さからはみ出していた） */
.rb-game__card .rb-center { display: flex; justify-content: center; }
.rb-game__sharebox { padding: 22px 0 6px; }   /* SWELL が最初の子の margin-top を 0 にするので padding で */
@media (min-width: 960px) { .rb-cards { row-gap: 20px; column-gap: 16px; } }

/* チャンス（スロット）とキャラのカットイン */
.rb-game__slot, .rb-game__cutin { position: absolute; left: 0; right: 0; z-index: 3; }
.rb-game__slot[hidden], .rb-game__cutin[hidden] { display: none; }
.rb-game__slot { top: 26%; margin: 0 14px; padding: 12px 12px 14px; text-align: center; background: #fff; border: 3px solid var(--rb-line); border-radius: 20px; box-shadow: 0 5px 0 var(--rb-line); animation: rbPop .25s ease-out; }
.rb-game__slottitle { margin-bottom: 8px; font-size: 1.3rem; font-weight: 900; color: var(--rb-pink); letter-spacing: .1em; animation: rbBlink .3s steps(2) infinite; }
.rb-game__reels { display: flex; gap: 8px; justify-content: center; }
.rb-game__reels span { width: 30%; aspect-ratio: 3 / 4; background: #fff6e3 center 15% / 150% auto no-repeat; border: 3px solid var(--rb-line); border-radius: 12px; }
.rb-game__reels span.is-stop { background-color: #fdeef2; animation: rbPop .2s ease-out; }
.rb-game__slot.is-hit { background: #fff6e3; } .rb-game__slot.is-hit .rb-game__slottitle { animation: none; }
.rb-game__slot.is-hit .rb-game__slottitle::after { content: " 確定！"; }
.rb-game__cutin { top: 22%; display: flex; align-items: flex-end; height: 46%; padding: 0 10px; background: linear-gradient(180deg, transparent 0 18%, rgba(74,59,54,.82) 18% 100%); animation: rbSlide .35s cubic-bezier(.2,1.4,.4,1); }
.rb-game__cutin img { flex: 0 0 auto; width: 42%; max-height: 100%; object-fit: contain; object-position: bottom; filter: drop-shadow(0 3px 0 rgba(0,0,0,.25)); }
.rb-game__cutbody { flex: 1; display: flex; flex-direction: column; gap: 6px; padding: 0 0 16px 8px; color: #fff; }
.rb-game__cutname { font-size: .8rem; font-weight: 700; opacity: .85; }
.rb-game__cutline { font-size: 1.15rem; font-weight: 900; line-height: 1.4; word-break: auto-phrase; }
.rb-game__cutlabel { align-self: flex-start; padding: 4px 10px; border-radius: 999px; background: #fff; color: var(--rb-pink-strong, #cf5f7c); font-size: .8rem; font-weight: 900; word-break: auto-phrase; }
.rb-game__cutin--fever .rb-game__cutlabel { background: #f0b54a; color: #fff; }
.rb-game__cutin--penalty { background: linear-gradient(180deg, transparent 0 18%, rgba(40,40,60,.86) 18% 100%); }
.rb-game__cutin--penalty .rb-game__cutlabel { background: #e0473f; color: #fff; }
@keyframes rbPop { from { transform: scale(.7); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes rbBlink { 50% { opacity: .35; } }
@keyframes rbSlide { from { transform: translateX(100%); } to { transform: translateX(0); } }
.rb-game__stage { overflow: hidden; border-radius: 18px; }

/* スマホのゲームページはアプリのように：下に隠れるヘッダー・トップへ戻るボタンも出さない */
html.rb-gameapp #pagetop, html.rb-gameapp .p-fixBtnWrap, html.rb-gameapp .l-fixHeader, html.rb-gameapp .l-header, html.rb-gameapp #header, html.rb-gameapp .p-spMenu, html.rb-gameapp .l-footer { display: none !important; }

/* 記事の吹き出し（app の chipper-balloon）をサイトの会話と同じ見た目に：顔のアップ・太い線・短い名前 */
.post_content .chipper-balloon__icon { background: #fff; border: 3px solid var(--rb-line); box-shadow: none; }
.post_content .chipper-balloon__img { object-position: center 4%; }
.post_content .chipper-balloon__name { font-size: .7rem; line-height: 1.35; color: var(--rb-pink); word-break: keep-all; }
.post_content .chipper-balloon__content { border: 3px solid var(--rb-line); border-radius: 18px; }
.post_content .chipper-balloon__content { box-shadow: none; }

/* ズバリ！はたらき方あて */
.rb-ate__guides { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 18px 0 20px; }
.rb-ate__guide { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 12px 8px 14px; background: var(--card-bg, #fff); border: 3px solid var(--rb-line); border-radius: 20px; box-shadow: 0 5px 0 var(--rb-line); font: inherit; color: var(--rb-ink, #4a3b36); cursor: pointer; transition: transform .1s; }
.rb-ate__guide:active { transform: translateY(3px); box-shadow: 0 2px 0 var(--rb-line); }
.rb-ate__guide img { width: 100%; max-width: 120px; aspect-ratio: 1; object-fit: cover; object-position: center 6%; opacity: 1 !important; }
.rb-ate__gname { font-weight: 900; font-size: 1.05rem; }
.rb-ate__gjob { font-size: .75rem; color: var(--rb-soft-ink); }
@media (min-width: 960px) { .rb-ate__guides { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rb-ate__play, .rb-ate__card { padding: 20px 16px 22px; background: #fff; border: 3px solid var(--rb-line); border-radius: 24px; box-shadow: 0 5px 0 var(--rb-line); }
.rb-ate__stage { display: flex; align-items: flex-end; gap: 10px; }
.rb-ate__face { flex: 0 0 34%; max-width: 150px; aspect-ratio: 3 / 4; object-fit: cover; object-position: center 4%; border-radius: 18px; background: #fdeef2; }
.rb-ate__bubble { position: relative; flex: 1; padding: 12px 14px; border: 3px solid var(--rb-line); border-radius: 18px; background: #fff6e3; }
.rb-ate__bubble.is-pop { animation: rbPop .25s ease-out; }
.rb-ate__name { display: block; font-size: .72rem; font-weight: 700; color: var(--rb-pink); }
.rb-ate__say { margin: 2px 0 0 !important; font-weight: 700; line-height: 1.6; word-break: auto-phrase; }
.rb-ate__meter { display: flex; align-items: center; gap: 8px; margin: 18px 0 6px; font-size: .78rem; font-weight: 700; color: var(--rb-soft-ink); }
.rb-ate__bar { flex: 1; height: 10px; border-radius: 999px; background: #f0d9e0; overflow: hidden; }
.rb-ate__bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #f0b54a, #e9849c); transition: width .4s; }
.rb-ate__q { margin: 10px 0 14px !important; font-size: 1.2rem; font-weight: 900; line-height: 1.5; text-align: center; word-break: auto-phrase; }
.rb-ate__answers { display: flex; flex-direction: column; gap: 10px; }
.rb-ate__a { padding: 12px; border: 3px solid var(--rb-line); border-radius: 999px; background: #fff; font: inherit; font-weight: 700; color: var(--rb-line); cursor: pointer; box-shadow: 0 3px 0 var(--rb-line); }
.rb-ate__a[data-a="1"] { background: #e3f1dc; } .rb-ate__a[data-a="0"] { background: #fde3d9; }
.rb-ate__a:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--rb-line); }
.rb-ate__guessbtns { display: flex; gap: 12px; justify-content: center; } .rb-ate__guessbtns .rb-btn { flex: 1; max-width: 200px; cursor: pointer; }
.rb-ate__back { margin-top: 16px; padding: 4px 10px; border: 0; background: none; font: inherit; font-size: .85rem; color: var(--rb-soft-ink); text-decoration: underline; cursor: pointer; }
.rb-ate__rhead { display: flex; align-items: center; gap: 12px; }
.rb-ate__rface { flex: 0 0 84px; width: 84px; height: 84px; object-fit: cover; object-position: center 4%; border: 3px solid var(--rb-line); border-radius: 50%; background: #fff; }
.rb-ate__rlabel { display: inline-block; padding: 2px 10px; border-radius: 999px; background: var(--rb-line); color: #fff; font-size: .72rem; font-weight: 700; }
.rb-ate__rname { margin: 6px 0 0 !important; font-size: 1.4rem; font-weight: 900; line-height: 1.35; color: var(--rb-pink); word-break: auto-phrase; }
.rb-ate__rdesc { margin: 14px 0 0 !important; line-height: 1.8; }
.rb-ate__why { margin: 16px 0 0; padding: 14px 16px; border-radius: 16px; background: #fff6e3; }
.rb-ate__whytitle { font-size: .8rem; font-weight: 900; }
.rb-ate__why ul { margin: 6px 0 0 !important; padding-left: 1.2em !important; font-size: .9rem; line-height: 1.8; }
.rb-ate__rsay { margin: 16px 0 0 !important; font-weight: 700; text-align: center; word-break: auto-phrase; }
.rb-ate__share { padding-top: 20px; }
/* display を指定した要素でも hidden を効かせる（「当たり！／ちがう」が答えの下に出ていた） */
#rb-ate [hidden] { display: none !important; }
.rb-ate__guessbtns { margin-top: 18px; }
.rb-ate__answers { gap: 16px; }

/* 当てたあとの続きの会話 */
.rb-ate__follow { margin-top: 18px; padding-top: 16px; border-top: 2px dashed #e6d6cf; }
.rb-ate__line { display: flex; align-items: flex-end; gap: 8px; margin: 0 0 10px; animation: rbPop .2s ease-out; }
.rb-ate__line img { flex: 0 0 40px; width: 40px; height: 40px; object-fit: cover; object-position: center 4%; border: 2px solid var(--rb-line); border-radius: 50%; background: #fff; }
.rb-ate__line p { margin: 0 !important; padding: 9px 13px; border: 2px solid var(--rb-line); border-radius: 16px; background: #fff6e3; font-size: .92rem; line-height: 1.6; word-break: auto-phrase; }
.rb-ate__line.is-me { justify-content: flex-end; } .rb-ate__line.is-me p { background: var(--rb-line); color: #fff; }
.rb-ate__chips { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin: 14px 0 4px; }
.rb-ate__chip { padding: 10px 18px; border: 3px solid var(--rb-line); border-radius: 999px; background: #fff; font: inherit; font-weight: 700; color: var(--rb-line); cursor: pointer; box-shadow: 0 3px 0 var(--rb-line); }
.rb-ate__chip:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--rb-line); }
.rb-ate__offers { padding-top: 6px; }

/* 記事ページのサイドバー */
.rb-side { display: flex; flex-direction: column; gap: 22px; }
.rb-side-ate { position: relative; display: block; padding: 18px 16px 18px 118px; min-height: 140px; border: 3px solid var(--rb-line); border-radius: 22px; background: #fdeef2; box-shadow: 0 5px 0 var(--rb-line); color: var(--rb-line); text-decoration: none; overflow: hidden; }
.rb-side-ate img { position: absolute; left: 8px; bottom: -6px; width: 104px; height: auto; }
.rb-side-ate__kicker { display: inline-block; padding: 2px 10px; border-radius: 999px; background: var(--rb-line); color: #fff; font-size: .72rem; font-weight: 700; }
.rb-side-ate__title { display: block; margin: 8px 0 10px; font-weight: 900; line-height: 1.45; }
.rb-side-ate__btn { display: inline-block; padding: 6px 16px; border-radius: 999px; background: var(--rb-pink); color: #fff; font-size: .85rem; font-weight: 900; }
.rb-side-box { padding: 16px 16px 18px; border: 3px solid var(--rb-line); border-radius: 22px; background: #fff; }
.rb-side-box + .rb-side-box { margin-top: 22px; }
.rb-side-box__title { margin: 0 0 12px !important; font-weight: 900; font-size: 1rem; text-align: center; }
.rb-side-box__text { margin: 10px 0 0 !important; font-size: .85rem; line-height: 1.7; }
.rb-side-crowd img { display: block; width: 100%; height: auto; border-radius: 14px; }
.rb-side-link { display: block; margin-top: 10px; font-size: .85rem; font-weight: 700; color: var(--rb-pink); text-align: right; }
.rb-side-link::after { content: " →"; }
.rb-side-cat + .rb-side-cat { margin-top: 14px; }
.rb-side-cat__head { display: block; padding: 8px 12px; border-radius: 12px; font-weight: 900; font-size: .9rem; color: var(--rb-line); text-decoration: none; }
.rb-side-cat--kango .rb-side-cat__head { background: #fde3d9; } .rb-side-cat--hoiku .rb-side-cat__head { background: #fff1cf; }
.rb-side-cat ul { list-style: none; margin: 6px 0 0 !important; padding: 0 !important; }
.rb-side-cat li { margin: 0; }
.rb-side-cat li a { display: block; padding: 7px 12px 7px 26px; position: relative; font-size: .88rem; color: var(--rb-line); text-decoration: none; border-radius: 10px; }
.rb-side-cat li a::before { content: ""; position: absolute; left: 12px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--rb-pink); }
.rb-side-cat li a:hover { background: #fdf6f2; }
.rb-side-play { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.rb-side-play a { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 4px 10px; border: 2px solid var(--rb-line); border-radius: 16px; background: #fff6e3; color: var(--rb-line); font-size: .78rem; font-weight: 700; text-decoration: none; }
.rb-side-play img { width: 100%; max-width: 64px; aspect-ratio: 1; object-fit: cover; object-position: center 6%; }
.rb-side-box .rb-snsrow { flex-direction: column; gap: 12px; }
.rb-side-box .rb-snsrow > * { width: 100%; }
#sidebar .c-widget + .c-widget, .l-sidebar .c-widget + .c-widget { margin-top: 22px; }
.rb-side-ate { padding-left: 108px; min-height: 150px; }
.rb-side-ate img { left: 6px; top: 10px; bottom: auto; width: 96px; height: calc(100% - 10px); object-fit: cover; object-position: center top; }
.rb-side-ate__title { font-size: .95rem; word-break: auto-phrase; }
.rb-side-crowd img { aspect-ratio: 4 / 3; object-fit: cover; object-position: center 35%; }
.rb-side-box .rb-snsrow > .rb-sns { flex: 0 0 auto; max-width: none; min-height: 46px; }

/* 看護・保育の配下では、ロゴの横に「看護」「保育」 */
.mk-zone-kango .c-headLogo, .mk-zone-hoiku .c-headLogo { display: inline-flex; align-items: center; gap: 8px; }
.mk-zone-kango .c-headLogo::after, .mk-zone-hoiku .c-headLogo::after { flex: 0 0 auto; padding: 3px 10px 2px; border: 2px solid var(--rb-line); border-radius: 999px; font-size: .78rem; font-weight: 900; line-height: 1.4; color: var(--rb-line); white-space: nowrap; }
.mk-zone-kango .c-headLogo::after { content: "看護"; background: #fde3d9; }
.mk-zone-hoiku .c-headLogo::after { content: "保育"; background: #fff1cf; }
@media (max-width: 959px) { .mk-zone-kango .c-headLogo::after, .mk-zone-hoiku .c-headLogo::after { font-size: .7rem; padding: 2px 8px 1px; } }
.rb-side-crowd img { aspect-ratio: 16 / 10; object-position: center 72%; border: 2px solid var(--rb-line); }
.rb-side-crowd img { object-position: center 62%; }
/* スタンプのカード：押せるとわかるボタン */
.rb-place__buy { display: inline-block; margin-top: 4px; padding: 7px 16px; font-size: .85rem; font-weight: 900; color: #fff; background: #06c755;
  border: 3px solid var(--rb-line); border-radius: 999px; box-shadow: 0 3px 0 var(--rb-line); }
a.rb-place:active .rb-place__buy { transform: translateY(2px); box-shadow: 0 1px 0 var(--rb-line); }
@media (min-width: 960px) { .post_content .mk-posts, .mk-posts { row-gap: 24px; } }
/* 職場図鑑（/zukan/）: 職場ごとのカード。キャラ・ちがい・ひとこと */
.rb-zukan { display: grid; gap: 16px; margin: 0 0 24px; }
.rb-zk { padding: 14px 16px 16px; background: var(--card-bg, #fff); border: 3px solid var(--rb-line); border-radius: var(--rb-radius); box-shadow: 0 4px 0 var(--rb-line); }
.rb-zk__head { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; column-gap: 12px; }
.rb-zk__head img { max-height: 90px; width: auto; justify-self: center; }
.rb-zk__kind { margin: 0; font-size: .78rem; font-weight: 700; color: var(--rb-soft-ink); }
.rb-zk__name { margin: 0; font-size: 1.12rem; font-weight: 900; line-height: 1.4; }
.post_content ul.rb-zk__list { margin: 10px 0 8px; padding-left: 1.2em; font-size: .92rem; line-height: 1.7; }
.rb-zk__fit { margin: 0; padding: 8px 12px; font-size: .88rem; font-weight: 700; background: rgba(255,255,255,.7); border-radius: 14px; }
.rb-steps { display: grid; gap: 12px; margin: 0 0 20px; counter-reset: rbstep; }
.rb-step { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; column-gap: 10px; padding: 12px 14px; background: #fff; border: 3px solid var(--rb-line); border-radius: 18px; }
.rb-step::before { counter-increment: rbstep; content: counter(rbstep); display: grid; place-items: center; width: 40px; height: 40px; font-weight: 900; color: #fff; background: var(--rb-pink); border-radius: 50%; }
.post_content a.rb-step, .post_content a.rb-step * { color: var(--rb-ink); text-decoration: none !important; }
a.rb-step { box-shadow: 0 3px 0 var(--rb-line); }
.rb-step__t b { display: block; font-size: 1rem; line-height: 1.5; }
.rb-step__t span { display: block; font-size: .85rem; color: var(--rb-soft-ink); }
@media (min-width: 960px) { .rb-zukan { grid-template-columns: 1fr 1fr; } }
/* 求人を見てみる（/kyujin/）: 条件のボタン。リンクが無い間は「じゅんび中」 */
.rb-go__box { margin: 0 0 16px; }
.rb-go__btns { display: grid; gap: 12px; }
.rb-go__btns > p { display: contents; }
.rb-go__btns .offer-btn { display: block; padding: 14px 18px; font-weight: 900; text-align: center; color: #fff; text-decoration: none; background: var(--rb-pink);
  border: 3px solid var(--rb-line); border-radius: 999px; box-shadow: 0 4px 0 var(--rb-line); }
.rb-go__soon { display: none; margin: 0; padding: 14px; font-weight: 700; text-align: center; background: #fff; border: 3px dashed var(--rb-soft-ink); border-radius: 18px; }
.rb-go__box:not(:has(.offer-btn)) .rb-go__soon { display: block; }
.post_content a.rb-zk__go { display: block; margin-top: 12px; padding: 10px 14px; font-weight: 900; text-align: center; color: var(--rb-ink); text-decoration: none;
  background: #fff; border: 3px solid var(--rb-line); border-radius: 999px; box-shadow: 0 3px 0 var(--rb-line); }