/* トップページだけで読み込む。既存の汎用クラスを上書きしない。 */
.cr-finder,.cr-finder *{box-sizing:border-box}
.cr-finder[hidden]{display:none!important}
.cr-finder{position:fixed;z-index:100;bottom:23px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:13px;width:max-content;max-width:calc(100% - 32px);padding:14px 17px 16px;border:3px solid #fff;border-radius:50px;background:#fffaf2;color:#375b54;box-shadow:0 5px 0 #efdac2,0 12px 28px #37594c35;font-family:"M PLUS 1 Code",system-ui,sans-serif;line-height:1.5;isolation:isolate}
.cr-finder__copy{margin:0 8px;padding:0;white-space:nowrap;font-weight:700}
.cr-finder__eyebrow{display:block;color:#84634c;font-size:11px;margin-bottom:3px}
.cr-finder__title{display:block;color:#375b54;font-size:14px}
.cr-finder__link{display:flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:10px 17px;border:2px solid #fff;border-radius:30px;background:linear-gradient(160deg,#8cddd3,#50b8ae);box-shadow:0 4px 0 #39998f,inset 0 2px 2px #ffffff8c;color:#fff!important;text-decoration:none!important;white-space:nowrap;font-size:15px;font-weight:700;line-height:1.5;transition:transform .15s;flex-shrink:0}
.cr-finder__link--purpose{background:linear-gradient(160deg,#f39cbd,#dc6597);box-shadow:0 4px 0 #b74475,inset 0 2px 2px #ffffff8c}
.cr-finder__icon{display:grid;place-items:center;flex-shrink:0;width:31px;height:31px;border-radius:50%;background:#fff;color:#65b7ae;box-shadow:0 2px 4px #33665826}
.cr-finder__link--purpose .cr-finder__icon{color:#ce6491}
.cr-finder__icon svg{display:block;width:19px;height:19px}
.cr-finder__chevron{font-size:23px;line-height:1;margin-left:3px}
.cr-finder__mobile-label{display:none}
.cr-finder__link:focus-visible{outline:3px solid #193f3b;outline-offset:5px}
@media(hover:hover){.cr-finder__link:hover{transform:translateY(-2px)}}
/* 横幅が不足する領域では、ラベル＋2列ボタンにする。 */
@media(max-width:820px){
 .cr-finder{left:0;right:0;bottom:0;transform:none;max-width:none;width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;padding:10px max(12px,env(safe-area-inset-right)) calc(18px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));border:0;border-top:3px solid #ffe59a;border-radius:18px 18px 0 0;box-shadow:0 -3px 14px #2f5d5518}
 .cr-finder__copy{grid-column:1/-1;text-align:center;margin:0}
 .cr-finder__eyebrow{display:none}
 .cr-finder__title{font-size:12px}
 .cr-finder__link{min-width:0;min-height:47px;gap:7px;padding:9px 8px;font-size:13px;flex-shrink:1;box-shadow:0 3px 0 #39998f}
 .cr-finder__link--purpose{box-shadow:0 3px 0 #b74475}
 .cr-finder__desktop-label{display:none}
 .cr-finder__mobile-label{display:inline}
 .cr-finder__icon{width:17px;height:17px;background:transparent;color:#fff!important;box-shadow:none}
 .cr-finder__icon svg{width:17px;height:17px}
 .cr-finder__chevron{font-size:20px;margin:0}
}
@media(prefers-reduced-motion:reduce){.cr-finder__link{transition:none}}
/* ページ末尾までスクロール可能にし、アンカー移動時にも帯の高さを確保。 */
.cr-finder-spacer{height:var(--cr-finder-space,0px);pointer-events:none}
html.cr-finder-ready{scroll-padding-bottom:var(--cr-finder-space,0px)}
@media print{.cr-finder,.cr-finder-spacer{display:none!important}}

/* 組み込み先での調整（テーマ側で追加。受領CSSは html/home-fixed-banner-2026-10-19/assets/banner.css）
   既存の「診断してみる！」（.sec-mv__float。右下に固定、bottom:30px）は、1599px以下で帯と重なるので（PC版を大きくしたため。もとは999px以下）、帯が出ている間だけ帯の高さ分を上に移す。帯が消えると --cr-finder-space が 0 になり元の位置に戻る */
@media(max-width:1599px){html.cr-finder-ready .sec-mv__float{bottom:calc(30px + var(--cr-finder-space,0px));transition:bottom .25s}}
@media(max-width:1599px) and (prefers-reduced-motion:reduce){html.cr-finder-ready .sec-mv__float{transition:none}}
/* PC版を大きくする（2026-10-19 担当者の依頼。現在の約1.5倍。配色・丸み・下中央の配置は変えない。スマホ版は変えない）
   受領CSSの寸法に倍率 --cr-s を掛ける。狭いPC幅でもはみ出さないよう、幅に応じて倍率を下げる */
@media(min-width:821px){
.cr-finder{--cr-s:1.5;gap:calc(13px*var(--cr-s));padding:calc(14px*var(--cr-s)) calc(17px*var(--cr-s)) calc(16px*var(--cr-s));border-width:calc(3px*var(--cr-s));border-radius:calc(50px*var(--cr-s));box-shadow:0 calc(5px*var(--cr-s)) 0 #efdac2,0 calc(12px*var(--cr-s)) calc(28px*var(--cr-s)) #37594c35}
.cr-finder__copy{margin:0 calc(8px*var(--cr-s))}
.cr-finder__eyebrow{font-size:calc(11px*var(--cr-s));margin-bottom:calc(3px*var(--cr-s))}
.cr-finder__title{font-size:calc(14px*var(--cr-s))}
.cr-finder__link{gap:calc(12px*var(--cr-s));min-height:calc(56px*var(--cr-s));padding:calc(10px*var(--cr-s)) calc(17px*var(--cr-s));border-width:calc(2px*var(--cr-s));border-radius:calc(30px*var(--cr-s));font-size:calc(15px*var(--cr-s));box-shadow:0 calc(4px*var(--cr-s)) 0 #39998f,inset 0 calc(2px*var(--cr-s)) calc(2px*var(--cr-s)) #ffffff8c}
.cr-finder__link--purpose{box-shadow:0 calc(4px*var(--cr-s)) 0 #b74475,inset 0 calc(2px*var(--cr-s)) calc(2px*var(--cr-s)) #ffffff8c}
.cr-finder__icon{width:calc(31px*var(--cr-s));height:calc(31px*var(--cr-s));box-shadow:0 calc(2px*var(--cr-s)) calc(4px*var(--cr-s)) #33665826}
.cr-finder__icon svg{width:calc(19px*var(--cr-s));height:calc(19px*var(--cr-s))}
.cr-finder__chevron{font-size:calc(23px*var(--cr-s));margin-left:calc(3px*var(--cr-s))}
}
@media(min-width:900px) and (max-width:1099px){.cr-finder{--cr-s:1.25}}
@media(min-width:821px) and (max-width:899px){.cr-finder{--cr-s:1}}