/* 共通スタイル
配置: assets/css/style.css
画僁E assets/images/back.png�E�ESS冁E��は ../images/back.png を参照�E�E*/

html,
body {
height: 100%;
margin: 0;
padding: 0;
font-size: 16px;
/* 基溁E 1rem = 16px */
}

body {
background-image: none;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
background-attachment: fixed;
background-color: #FFFBEF;
/* 変更: 新しい背景色 */
font-family: "Noto Sans JP", Arial, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
color: #40200B;
-webkit-font-smoothing: antialiased;
}



.site-footer {
  width: 100%;
  margin: 0;
  border-radius: 0 !important;
  padding: 0.75rem 1rem;
}

body {
  padding-bottom: 4.75rem !important;
}

body.result-page {
  padding-bottom: 12rem !important;
}

/* footer は画面幁E��っぱぁE��最下部に固宁E*/


.site-footer {
  width: 100%;
  margin: 0;
  border-radius: 0 !important;
  padding: 0.75rem 1rem;
}

body {
  padding-bottom: 4.75rem !important;
}

body.result-page {
  padding-bottom: 12rem !important;
}

:root {
  --lp-max-width: 24.375rem; /* 390px */
}

/* =============================
PC/共通：中央クリーム帯�E�実体要素�E�E

* 背景は body�E�タイル/背景画像！E
* コンチE��チE�E .page-shell�E�クリームの帯�E�に収めめE
  ============================= */
  .page-shell {
  /* スマ�Eでは帯�E�クリーム背景�E�を出さなぁE*/
  background: transparent;
  width: 100%;
  }

@media (min-width:48rem) {
.page-shell {
background: rgba(255, 250, 241, 0.98);
 width: min(100%, var(--lp-max-width));
/* 帯の固定幁E��従来の 16.5rem ÁE�E�E*/
margin: 0 auto;
min-height: 100vh;
padding-bottom: 4.75rem;
box-sizing: border-box;
/* 画面高まで帯を伸ばぁE*/
box-shadow:
-0.25rem 0 0 rgba(243, 107, 45, 0.08),
0.25rem 0 0 rgba(243, 107, 45, 0.08);
border-radius: 0;
/* 忁E��なら角丸を�Eれる */
}
}

/* page-shell 冁E�Eの余白は container が担彁E*/
@media (min-width:48rem) {
.container {
max-width: none;
/* page-shell 幁E��追征E*/
padding-left: 1.25rem;
padding-right: 1.25rem;
}
}

/* 横スクロール防止�E�スマ�E対応！E*/
*,
*::before,
*::after {
box-sizing: border-box;
}

html,
body {
overflow-x: hidden;
}

img,
video {
max-width: 100%;
height: auto;
display: block;
}

/* コンチE��幁E��柔軟にする�E�横ははみ出さなぁE��E*/
.container {
width: 100%;
max-width: 30rem;
margin: 0 auto;
padding: 1.25rem;
box-sizing: border-box;
}

/* モバイルでは背景の fixed を解除�E�パフォーマンスとレイアウト安定化のため�E�E*/
@media (max-width: 32.5rem) {
body {
background-attachment: scroll;
/* fixed は解除 */
background-size: 100% auto;
/* 横幁E��画面幁E��合わせる */
background-repeat: repeat-y;
/* 縦に繰り返して全高を要E�� */
background-position: top center;
}

.container {
padding: 1rem
}

/* NOTE: スマ�E版�E従来の見た目を優先するため、ここで .page-shell は触らなぁE*/
}

/* ペ�Eジ中央のコンチE�� */
.container {
max-width: 30rem;
margin: 0 auto;
padding: 1.25rem;
box-sizing: border-box;
}

h1,
h2,
h3 {
margin: 0 0 0.75rem 0;
}

label {
display: block;
margin-top: 0.75rem;
font-weight: 600
}

input[type=text],
input[type=tel],
input[type=email],
input[type=number],
select,
textarea {
  width: 100%;
  padding: 0.75rem 0.5rem;
  box-sizing: border-box;
margin-top: 0.375rem;
  border: 1px solid #C4C4C4;
  border-radius: 0.5rem;
  background: #fff;
  font-size: 1rem;
  line-height: 1.5;
}

.checkbox-group label {
display: inline-block;
margin-right: 0.625rem;
font-weight: normal
}

/* 汎用ボタン */
.btn,
.cta {
display: inline-block;
padding: 0.625rem 1rem;
border-radius: 0.375rem;
text-decoration: none;
cursor: pointer;
border: none;
}

.btn {
background: #0078d4;
color: #fff
}

.secondary {
background: #ccc;
color: #222
}

.cta {
background: #0078d4;
color: #fff;
padding: 0.75rem 1.125rem;
border-radius: 0.25rem
}

.success {
background: #e6ffef;
border: 0.0625rem solid #b7f0d2;
padding: 0.625rem;
color: #0b6b3a
}

.error {
background: #ffecec;
border: 0.0625rem solid #f5c2c2;
padding: 0.625rem;
color: #8a1d1d
}

.card {
max-width: 40rem;
margin: 2.5rem auto;
padding: 1.5rem;
border: 0.0625rem solid #eee;
border-radius: 0.5rem;
background: rgba(255, 255, 255, 0.9)
}

/* スチE��プフォームの調整 */
.step-buttons {
margin-top: 1.125rem;
display: flex;
gap: 0.5rem
}

/* --- 共通�EチE��ー --- */
/* ヘッダー全体�EラチE��ー�E�フル幁E��E*/
.site-header-wrapper {
width: 100%;
padding: 0;
/* 上部余白は container 側で調整可能 */
display: block;
}

/* 実際のヘッダーカード！Econtainer 冁E��置く想定！E*/
.site-header {
display: flex;
align-items: center;
justify-content: flex-start;
gap: 0.75rem;
padding: 1rem 1rem;
/* 余白を大きくしてヘッダーを見やすく */
background: transparent;
/* 色なぁE*/
border-radius: 0;
/* 角丸なぁE*/
box-shadow: none;
/* 影なぁE*/
border: none;
/* 墁E��線なぁE*/
}

.site-header .brand {
display: flex;
flex-direction: column;
align-items: center;
width: 164.04px;
}

/* ロゴ画僁E*/
.site-header .site-logo {
width: 7.5rem;
/* ロゴをやめE��きく表示 */
height: auto;
display: block;
flex-shrink: 0;
}

.site-header .site-logo.site-logo--mobile {
width: 164.04px !important;
height: 31px !important;
object-fit: contain;
}

/* チE��ストタイトル */
.site-header .site-title {
font-size: 1.25rem;
/* タイトルをやめE��きく */
color: #f36b2d;
font-weight: 800;
line-height: 1.05;
text-shadow: none;
/* チE��スト影も無しでシンプルに */
}

/* 小さな補助チE��スト（忁E��であれば header.php に .site-subtitle を追加*/
.site-header .site-subtitle {
display: block;
font-size: 0.75rem;
color: #666;
margin-top: 0.25rem;
font-weight: 600;
}

.site-header .site-tagline {
display: block;
width: 100%;
font-size: 0.75rem;
font-weight: 700;
line-height: 1.4;
letter-spacing: 0.15em;
color: #AE8F52;
text-align: center;
}

.feature-promo .frame-desc .promo-advice {
display: flex;
align-items: center;
justify-content: center;
width: 7rem;
height: 1.875rem;
background: #AE8F52;
border-radius: 0;
color: #FFFFFF;
font-size: 1.25rem;
font-weight: 700;
line-height: 1;
margin: 0 auto 0.25rem;
}

@media (max-width:32.5rem) {

/* ヘッダーをスマ�Eで左上寁E��にする�E�中央寁E��を解除�E�E*/
/* ラチE��ーをフルブリードにして画面端まで庁E��めE*/
.site-header-wrapper {
width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
padding: 0;
/* パディングは冁E��で調整 */
box-sizing: border-box;
}

/* ヘッダー本体�E左寁E��、上寁E��、パチE��ングを小さぁE*/
.site-header {
padding: 0.5rem 0.6rem;
/* 縦を小さくして上に寁E��めE*/
justify-content: flex-start;
align-items: flex-start;
/* ロゴを上寁E�� */
gap: 0.5rem;
}

/* ロゴは高さで制御しつつ左端に寁E��めE*/
.site-header .site-logo {
height: 2.25rem;
width: auto;
margin-top: 0
}

.site-header .site-title {
font-size: 1.05rem;
line-height: 1
}
}

/* ヘッダーを�Eージ上端に寁E��るため�Eオーバ�EライチE*/
.site-header-wrapper {
padding-top: 0;
padding-bottom: 0
}

.site-header {
padding-top: 0.25rem;
padding-bottom: 0.25rem
}

/* header 冁E�E container は他�Eペ�Eジの .container と競合しなぁE��ぁE��余白を小さくすめE*/
.site-header .container {
padding-top: 0.25rem;
padding-bottom: 0.25rem
}

@media (max-width:32.5rem) {

/* モバイルではさらに詰める */
.site-header {
padding-top: 0.15rem;
padding-bottom: 0.15rem
}

.site-header .container {
padding-top: 0.15rem;
padding-bottom: 0.15rem
}
}

/* --- Hero / メインビジュアル --- */
.hero {
text-align: center;
padding: 1.75rem 0.75rem 1.125rem;
}

.hero .logo {
display: block;
margin: 0 auto 0.5rem;
max-width: 310.7px;
width: min(100%, 310.7px);
}

.hero h1 {
font-size: 2rem;
line-height: 1.05;
margin: 0.375rem 0 0.25rem;
color: #f36b2d;
/* オレンジ */
font-weight: 800;
}

.hero p.subtitle {
margin: 0.375rem 0 0.75rem;
font-size: 1.25rem;
font-weight: 700;
letter-spacing: 0;
line-height: 1.4;
white-space: nowrap;
}

.hero p.subtitle .subtitle-accent {
  font-size: 1.5rem;
  color: #FF6200;
}

/* hero E*/
.hero .badge {
display: inline-block;
background: #fff;
padding: 0.35rem 0.9rem;
border-radius: 2rem;
box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.06);
border: 0.0625rem solid rgba(0, 0, 0, 0.06);
font-weight: 700;
color: #5a3b22;
margin-bottom: 0.5rem;
}

.hero .badge em {
background: #fff;
padding: 0 0.25rem;
color: #3aa5d1;
font-weight: 800
}

/* hero 見�Eし�E一部をオレンジで強調 */
.hero h1 strong {
color: #f36b2d;
display: block;
}

.hero h1 .accent {
background: rgba(255, 243, 235, 0.9);
padding: 0.1rem 0.25rem;
border-radius: 0.25rem
}

/* インラインの簡易スチE��プ表示�E�E1 Q2 Q3�E�E*/
.hero .steps-inline {
display: flex;
gap: 0.5rem;
align-items: center;
justify-content: center;
margin-top: 0.6rem
}

.hero .steps-inline .step-dot {
width: 1.25rem;
height: 1.25rem;
border-radius: 50%;
background: #6fc7e5;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
font-weight: 800;
font-size: 0.85rem
}

.hero .steps-inline .sep {
color: #c0c0c0;
font-weight: 700
}

/* 優先度を上げて既存�E .hero .steps-inline .step-dot を上書きする（特異性で確実に適用�E�E*/
.hero .steps-inline.hero-steps .step-dot {
width: 3.6rem;
height: 3.6rem;
font-size: 1rem;
border-radius: 50%;
background: #fff;
border: 0.125rem solid rgba(0, 0, 0, 0.08);
display: flex;
align-items: center;
justify-content: center;
font-weight: 900;
color: #2b9fbf;
}

.hero .steps-inline.hero-steps .step-dot.active {
background: #5bc0e0;
color: #fff;
border-color: transparent;
box-shadow: 0 0.4rem 0.8rem rgba(0, 160, 220, 0.12)
}

.hero .steps-inline.hero-steps .sep {
color: #cfcfcf;
font-weight: 800;
font-size: 1.25rem;
margin: 0 0.25rem
}

@media (max-width:32.5rem) {
.hero .steps-inline.hero-steps .step-dot {
width: 2.25rem;
height: 2.25rem;
font-size: 0.8rem
}

.hero .steps-inline.hero-steps .sep {
font-size: 1rem
}
}

@media (min-width:48rem) {
.hero .steps-inline.hero-steps .step-dot {
width: 4.5rem;
height: 4.5rem;
font-size: 1.2rem
}

.hero .steps-inline.hero-steps .sep {
font-size: 1.6rem;
margin: 0 0.6rem
}
}

/* --- FV / hero images --- */
.fv-wrap {
position: relative;
padding-top: 0.5rem;
margin-bottom: 0.75rem
}

.fv {
position: relative;
width: 100%;
max-width: 30rem;
margin: 0 auto;
}

.fv-title {
display: block;
margin: 0 auto 0.5rem;
max-width: 310.7px;
width: min(100%, 310.7px);
height: auto
}

/* 画像ごとの高さめErem 持E��で統一�E�侁E スクリーンショチE��に近い 86.65ÁE44.1px の高さに合わせる�E�E*/
.fv-figure {
position: absolute;
bottom: -7.8rem;
height: 9rem;
width: auto;
object-fit: contain
}

.fv-left {
left: 0;
transform: translate(calc(-6% - 1rem), -0.1rem);
}

.fv-right {
right: 0;
transform: translateX(20%);
}

@media (max-width:32.5rem) {
.fv-figure {
bottom: -6.7rem;
}
}

.hero-text {
text-align: center;
padding: 0 1rem;
position: relative
}

.badge-wrap {
position: relative;
display: inline-block;
width: min(45%, 8.875rem);
margin: 0.9rem auto -0.15rem;
}

/* チE��ストバチE��: 背景・影を消し、画像�E上に重�Eて表示 */
.hero .badge {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -62%);
background: transparent !important;
box-shadow: none !important;
border: none !important;
padding: 0;
z-index: 2;
color: #5a3b22;
white-space: nowrap;
}

.badge-image {
display: block;
width: 100%;
height: auto;
margin: 0;
position: relative;
z-index: 1;
}

@media (max-width:32.5rem) {
.hero .badge {
top: 50%;
transform: translate(-50%, -62%);
}

.badge-wrap {
width: min(50%, 8.875rem);
margin-top: 2rem
}
}

/* --- feature promo --- */
.feature-promo {
/* 固定サイズ: 329ÁE61px�E�Eem換箁E 329/16=20.5625rem, 361/16=22.5625rem�E�E*/
width: 20.5625rem;
/* 329px */
height: 22.5625rem;
/* 361px */
max-width: none;
/* 上限を解除 */
margin: 1.6rem auto 0.6rem;
background: linear-gradient(180deg, #fff, #fffbf7);
border-radius: 0.9rem;
/* リボンスペ�Eス確保�Eため上部 padding を調整�E�相対値�E�E*/
padding: 2.4rem 0.8rem 0.8rem;
box-shadow: 0 0.6rem 1.2rem rgba(0, 0, 0, 0.06);
border: 0.08rem solid #AE8F52;
position: relative;
overflow: visible;
display: flex;
/* 冁E��を縦方向に揁E��めE*/
flex-direction: column;
align-items: center;
/* 中央揁E�� */
justify-content: flex-start;
}

/* リボンはコンチE��上端に少し被るよぁE��配置�E�絶対値の大きな負値を撤廁E��E*/
.frame-ribbon {
position: absolute;
left: 50%;
transform: translateX(-50%);
display: block;
/* 横長にするためブロチE��表示 */
width: calc(100% - 2rem);
/* カード幁E��対して左右に余裕をもたせる */
max-width: none;
/* 上限解除 */
white-space: nowrap;
/* 改行させず一行で表示 */
text-align: center;
padding: 0.6rem 0.8rem;
/* 高さを保ちつつ左右パディング控えめ */
color: #fff;
border-radius: 0.6rem;
font-weight: 800;
font-size: 0.95rem;
line-height: 1.1;
z-index: 6;
transform-origin: center;
overflow: hidden;
/* はみ出しを防ぐ（文字�E省略可�E�E*/
text-overflow: ellipsis;
/* 長すぎる場合�E末尾省略 */
}

.frame-ribbon strong {
font-weight: 900;
display: inline
}

@media (max-width:32.5rem) {
.frame-ribbon {
width: calc(70% - 1.2rem);
/* モバイルで左右の余白を縮める */
padding: 0.5rem 0.6rem;
font-size: 0.86rem;
white-space: normal;
/* モバイルでは折返しを許可して視認性確俁E*/
top: -1.6rem;
}
}


.feature-promo .promo-image {
display: block;
width: 14.6rem;
max-width: 90%;
height: auto;
margin: 0.6rem auto 0.25rem;
filter: drop-shadow(0.0625rem 0.0625rem 0.25rem #D4D4D4);
}

.feature-promo .promo-panel {
background: #FFFBEF;
padding: 0.6rem 1rem;
border-radius: 0.75rem;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.35rem;
width: 100%;
box-sizing: border-box;
margin-top: 0.35rem;
}

.feature-promo .promo-text {
font-size: 0.95rem;
line-height: 1.4;
text-align: center;
margin-top: 0.25rem
}

/* --- Result / 結果ペ�Eジ --- */
.result-hero {
text-align: center;
padding: 1.25rem 0 0.75rem;
}

.result-hero .hero-title {
font-size: 1.375rem;
color: #f36b2d;
margin: 0 0 0.4rem;
font-weight: 900;
line-height: 1.05
}

.result-hero .hero-title img {
display: block;
margin: 0 auto;
max-width: 100%;
height: auto;
}

.result-hero .hero-sub {
font-size: 0.95rem;
color: #6b4f3a;
margin: 0 0 0.8rem
}

.result-type {
text-align: center;
margin: 0.6rem 0;
}

.result-title-frame {
display: inline-flex;
/* inline 表示を保ちつつ flex で中央寁E�� */
align-items: center;
/* 縦中央 */
justify-content: center;
/* 横中央 */
width: 17.3125rem;
/* 277px 相彁E*/
height: 4.1875rem;
/* 67px 相彁E*/
padding: 0 0.75rem;
/* 横余白 */
box-sizing: border-box;

border-radius: 0.8rem;
background: #fff;
border: 0.12rem dotted rgba(90, 60, 40, 0.18);
box-shadow: 0 0.6rem 0.9rem rgba(0, 0, 0, 0.06);

font-size: 1.25rem;
font-weight: 900;
color: #5a3b22;
line-height: normal;
/* flex と併用して縦中央を安定させる */
letter-spacing: -0.01em;
margin: 0 auto 0.35rem;
/* 横中央の保険 */
vertical-align: middle;
}

.result-type-sub {
font-size: 0.95rem;
color: #5a3b22;
margin-top: 0.25rem;
margin-bottom: 2.5rem;
font-weight: 700;
}

.result-type-sub .result-type-sub-main {
font-size: 1.125rem;
font-weight: 700;
letter-spacing: 0;
}

.result-type-sub .result-type-sub-tail {
font-size: 0.875rem;
font-weight: 700;
letter-spacing: 0;
}

@media(max-width:32.5rem) {
.result-title-frame {
font-size: 1.5rem;
font-weight: 700;
line-height: 1.4;
letter-spacing: 0.1em;
padding: 0.5rem 0.9rem;
border: 0.12rem dotted rgba(90, 60, 40, 0.18);
}

.result-type-sub {
font-size: 0.9rem
}
}

.result-card {
width: 18.4375rem;
/* 295px */
height: 6.875rem;
/* 110px */
max-width: none;
box-sizing: border-box;
background: #fff;
border-radius: 0.75rem;
border: 0.0625rem solid rgba(64, 32, 11, 0.10);
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.06);
margin: 0.6rem auto;
padding: 0.65rem 0.8rem;
overflow: visible;
text-align: left;
position: relative;
/* チE��ストを左寁E�� */
}

.result-card__figure {
position: absolute;
top: -2.9rem;
right: 0.55rem;
width: 3.2rem;
height: auto;
z-index: 2;
pointer-events: none;
}

.result-card__inner {
position: relative;
z-index: 1;
transform: translate(0.5rem, 0.5rem);
}

/* チェチE��リスト：画像�Eような「青ぁE��ェチE��付き四角」アイコンにする */
.result-checklist {
margin: 0;
padding: 0 0 0 0.7rem;
list-style: none
}

.result-checklist__item {
display: flex;
align-items: center;
gap: 0.6rem;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
/* 14px */
line-height: 1.25;
margin: 0.2rem 0;
padding: 0.1rem 0;
font-weight: bold;
color: #40200B;
}

.result-checklist__text {
display: block;
}

.result-card--education .result-checklist {
 padding-left: 0;
 transform: translateX(-0.45rem);
}

.result-card--education .result-checklist__item {
gap: 0.45rem;
}

.result-card--education .result-checklist__text {
white-space: nowrap;
}

.result-checklist-nowrap {
white-space: nowrap;
}

.result-checklist__item::before {
content: "";
width: 0.9375rem;
height: 1.0625rem;
border-radius: 0.15rem;
box-sizing: border-box;
display: inline-grid;
place-items: center;
flex: 0 0 0.9375rem;
background: transparent;
/* 画像チェチE��マ�Eクを使用 */
background-image: url('../images/checkmark__1x.webp');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
border: none;
/* 画像表示のため枠を消す */
}

/* 強調オレンジ�E�画像�E「活用方法」など�E�E*/
.accent-orange {
color: #F36B2D;
font-weight: 900
}

.accent-brown {
color: #40200B;
font-weight: 900
}

/* モバイルは可夁E*/
@media(max-width:32.5rem) {}

/* --- contact step specific visuals (refinement for step1) --- */
.contact-container {
max-width: 30rem;
margin: 0 auto;
padding: 0.8rem;
}

.promo {
background: rgba(255, 250, 240, 0.98);
border: 0.12rem solid rgba(200, 150, 120, 0.35);
border-radius: 1rem;
padding: 1rem;
box-shadow: 0 0.6rem 1rem rgba(0, 0, 0, 0.04);
margin-bottom: 1rem
}

.ribbon {
position: absolute;
left: 50%;
transform: translateX(-50%);
top: -0.9rem;
background: #f06b6b;
color: #fff;
padding: 0.45rem 1rem;
border-radius: 0.6rem;
font-weight: 800
}

.promo-title {
font-weight: 800;
font-size: 1rem;
color: #5a3b22;
text-align: center;
margin-bottom: 0.6rem
}

.promo-media {
display: flex;
align-items: center;
gap: 0.8rem;
justify-content: center
}

.promo-desc {
font-size: 0.9rem;
color: #5b4f39
}

.step-indicator {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
margin: 1rem 0
}

.step-indicator .step {
width: 2.4rem;
height: 2.4rem;
border-radius: 50%;
background: #cfeafc;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
font-weight: 800
}

.step-indicator .step--current {
background: linear-gradient(90deg, #4facfe, #00f2fe);
box-shadow: 0 0.4rem 0.8rem rgba(0, 160, 220, 0.12)
}

.step-indicator .dots {
color: #bfbfbf;
font-size: 1.2rem
}

.form-card {
background: #fff;
border-radius: 0.9rem;
padding: 1.1rem;
box-shadow: 0 0.6rem 1.2rem rgba(0, 0, 0, 0.06);
border: 0.06rem solid rgba(200, 150, 120, 0.12)
}

.form-row {
margin-bottom: 1rem
}

.label {
display: block;
font-weight: 800;
color: #5a3b22;
margin-bottom: 0.45rem
}

.required-badge {
display: inline-block;
background: #ff7b2f;
color: #fff;
padding: 0.18rem 0.45rem;
border-radius: 0.5rem;
font-weight: 800;
font-size: 0.75rem;
margin-left: 0.5rem
}

.input-box {
width: 100%;
padding: 0.75rem;
border-radius: 0.7rem;
border: 0.12rem solid #eee;
font-size: 1rem;
box-sizing: border-box;
background: #fff
}

.input-box::placeholder {
color: #E0E0E0;
}

.input::placeholder,
.textarea::placeholder {
  font-size: 1rem;
  color: #E0E0E0;
}

.input-inline {
display: flex;
gap: 0.5rem
}

.input-inline input {
padding: 0.6rem;
border-radius: 0.6rem;
border: 0.12rem solid #eee;
font-size: 1rem
}

.input-inline input[type=number] {
text-align: center
}

.radio-group {
display: flex;
gap: 1rem;
align-items: center
}

.radio-label {
position: relative;
padding-left: 1.8rem;
font-weight: 700;
color: #5a3b22
}

.radio-label input {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
opacity: 0;
width: 1.2rem;
height: 1.2rem;
margin: 0
}

.radio-label .radio-custom {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 1.2rem;
height: 1.2rem;
border-radius: 50%;
border: 0.12rem solid #c9eafb;
background: #fff
}

.radio-label input:checked+.radio-custom {
background: linear-gradient(90deg, #4facfe, #00f2fe);
border-color: transparent;
box-shadow: 0 0.25rem 0.5rem rgba(0, 160, 220, 0.12)
}

.btn-row {
display: flex;
gap: 0.75rem;
align-items: center;
justify-content: space-between;
margin-top: 0.6rem
}

.btn--gradient {
flex: 1;
display: inline-flex;
align-items: center;
justify-content: center;
position: relative;
background: linear-gradient(90deg, #4C79CB 0%, #6EDCE4 100%);
color: #fff;
padding: 0.9rem 3.25rem 0.9rem 1.25rem;
border-radius: 2rem;
font-weight: 800;
font-size: 1rem;
border: none;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25)
}

.btn--gradient::after {
content: "";
position: absolute;
right: 0.85rem;
top: 50%;
transform: translateY(-50%);
width: 1.125rem;
height: 1.125rem;
border-radius: 50%;
background: #FFFFFF;
}

.btn--gradient .btn-arrow {
position: absolute;
right: 0.98rem;
top: 50%;
transform: translateY(-50%);
width: 0.95rem;
height: auto;
display: block;
z-index: 1;
}

.btn--secondary {
background: #9b9b9b;
color: #fff;
font-weight: 500;
padding: 0.75rem 1rem;
border-radius: 2rem;
text-decoration: none;
white-space: nowrap;
}

.footer-note {
text-align: center;
color: #6b4f3a;
margin-top: 1rem
}

@media(min-width:48rem) {
.contact-container {
padding: 2rem
}
}

/* --- hero features�E�ピル型タグ群�E�E--- */
.hero-features {
text-align: center;
margin: 0.5rem 0 0.75rem
}

.hero-subtext {
font-family: "VDL-Logona", sans-serif;
color: #5a3b22;
font-weight: 700;
position: relative;
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto 0.5rem
}

.hero-subtext .hero-subtext-text {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}

.hero-subtext .hero-subtext-image {
display: block;
width: 75%;
max-width: 100%;
height: auto;
}

.feature-list {
list-style: none;
padding: 0;
margin: 0;
display: grid;
grid-template-columns: repeat(6, minmax(0, 1fr));
gap: 0.55rem 0.45rem;
align-items: center;
justify-items: center;
}

.feature-list li {
margin: 0;
grid-column: span 2;
}

.feature-list li:nth-child(4) {
grid-column: 2 / span 2;
}

.feature-list li:nth-child(5) {
grid-column: 4 / span 2;
}

.feature-pill {
display: inline-block;
padding: 0.45rem 0.95rem;
border-radius: 2rem;
font-weight: 800;
font-size: 0.85rem;
box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.06);
color: #084b3b;
background: #eefaf6
}

.pill--green {
background: #e7fbf4;
color: #087a5f;
border: 0.06rem solid rgba(8, 122, 95, 0.08)
}

.pill--pink {
background: #fff0f6;
color: #c83f6a;
border: 0.06rem solid rgba(200, 80, 120, 0.06)
}

.pill--purple {
background: #f3f7ff;
color: #6b4f9a;
border: 0.06rem solid rgba(107, 79, 154, 0.06)
}

.pill--yellow {
background: #fffaf0;
color: #b86a2f;
border: 0.06rem solid rgba(184, 106, 47, 0.06)
}

.pill--blue {
background: #f0fbff;
color: #2b7fa3;
border: 0.06rem solid rgba(43, 127, 163, 0.06)
}

@media(max-width:32.5rem) {
.feature-list {
gap: 0.45rem 0.35rem;
}

.feature-pill {
padding: 0.4rem 0.8rem;
font-size: 0.8rem
}
}

/* --- hero 用 大きなスチE��プ表示�E�Endex の見�Eし下に表示�E�E--- */
.hero-steps {
display: flex;
gap: 0.6rem;
align-items: center;
justify-content: center;
margin-top: 0.85rem
}

.hero-steps-image {
display: block;
width: min(100%, 12rem);
height: auto;
margin: 0.85rem auto 0;
}

.hero-steps .step-dot {
width: 3.6rem;
height: 3.6rem;
border-radius: 50%;
background: #fff;
border: 0.125rem solid rgba(0, 0, 0, 0.08);
display: flex;
align-items: center;
justify-content: center;
font-weight: 900;
font-size: 1rem;
color: #2b9fbf
}

.hero-steps .sep {
color: #cfcfcf;
font-weight: 800;
font-size: 1.25rem;
margin: 0 0.25rem
}

.hero-steps .step-dot.active {
background: #5bc0e0;
color: #fff;
border-color: transparent;
box-shadow: 0 0.4rem 0.8rem rgba(0, 160, 220, 0.12)
}

@media (max-width:32.5rem) {
.hero-steps .step-dot {
width: 2.25rem;
height: 2.25rem;
font-size: 0.8rem
}

.hero-steps .sep {
font-size: 1rem
}
}

@media (min-width:48rem) {

/* 大きな画面ではタイトル画像とスチE��プを大きく見せめE*/
.fv-title {
max-width: 310.7px;
width: min(100%, 310.7px);
}

.fv-figure {
height: 9rem;
}

.hero-text .subtitle {
font-size: 1.5rem;
font-weight: 700;
letter-spacing: 0;
line-height: 1.4;
}

.hero-steps {
margin-top: 1.2rem
}

.hero-steps .step-dot {
width: 4.5rem;
height: 4.5rem;
font-size: 1.2rem
}

.hero-steps .sep {
font-size: 1.6rem;
margin: 0 0.6rem
}
}

/* アクセシビリチE��用ユーチE��リチE���E�画面上�E非表示、スクリーンリーダーは読める�E�E*/
.sr-only,
.visually-hidden {
position: absolute !important;
left: -9999px !important;
top: auto !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: 0 !important;
overflow: hidden !important;
clip: rect(0 0 0 0) !important;
white-space: nowrap !important;
border: 0 !important;
}

/* Result intro framed box (白ぁE��丸ボックス) */
.result-intro-frame {
background: #fff;
padding: 1rem 1.1rem;
border-radius: 0.9rem;
border: 0.06rem solid rgba(160, 200, 180, 0.12);
/* 薁E��グリーン系の枠 */
box-shadow: 0 0.9rem 1.4rem rgba(0, 0, 0, 0.06);
max-width: 22.5rem;
margin: 2.5rem auto 0.8rem;
text-align: center;
}

.result-intro-frame .result-intro {
margin: 0;
font-size: 1rem;
font-weight: 700;
color: #40200B;
line-height: 1.5;
letter-spacing: 0;
}

.result-intro-frame .result-intro .result-intro-accent {
color: #FF6200;
}

.result-intro-frame .result-intro .result-intro-note {
display: block;
margin-top: -2.1rem;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 400;
color: #40200B;
line-height: 1.65;
letter-spacing: 0;
text-align: center;
}

.result-intro-frame .result-intro .result-intro-detail {
display: block;
margin-top: -0.95rem;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 400;
color: #40200B;
line-height: 1.65;
letter-spacing: 0;
text-align: center;
}

.result-intro-frame .result-intro .result-intro-detail--spaced {
margin-top: -1.2rem;
}

.result-intro-frame .result-intro .result-intro-detail--mixed {
margin-top: -0.6rem;
}

.result-intro-frame .result-intro .result-intro-detail-strong {
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 700;
line-height: 1.8;
letter-spacing: 0;
color: #40200B;
}

.result-intro-frame .result-intro .result-intro-detail-strong:first-of-type {
display: inline-block;
margin-bottom: 0.45rem;
}

.result-intro-frame .result-intro .result-intro-detail-group {
display: block;
}

.result-intro-frame .result-intro .result-intro-detail-group--compact {
margin-top: 0.15rem;
}

.result-intro-frame .result-intro .result-intro-detail-nowrap {
display: inline-block;
white-space: nowrap;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 400;
color: #40200B;
}

.result-intro-frame .result-intro .result-intro-break {
display: block;
line-height: inherit;
}

@media(max-width:32.5rem) {
.result-intro-frame {
padding: 0.85rem 0.9rem;
max-width: 20.5rem
}

.result-intro-frame .result-intro {
font-size: 1rem
}
}

/* CVA 画像�Eタン�E�Eesult ペ�Eジ下！E*/
.cva-wrap {
text-align: center;
margin: 0.9rem 0 1.4rem
}

.cva-button {
display: inline-block;
border-radius: 1.25rem;
overflow: hidden;
transition: transform .12s ease, box-shadow .12s ease
}

.cva-button img {
display: block;
width: 18.5rem;
max-width: 90%;
height: auto;
display: block
}

.cva-button:active {
transform: translateY(1px);
box-shadow: 0 0.4rem 0.8rem rgba(0, 0, 0, 0.06)
}

@media(max-width:32.5rem) {
.cva-button img {
width: 16.5rem
}

.cva-wrap {
margin: 0.8rem 0
}
}

/* 「を具体的に整琁E��きます。」と矢印 */
.result-arrow-section {
text-align: center;
margin: 0.6rem 0
}

.result-arrow-text {
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.8;
color: #40200B;
margin: 0 0 1.8rem;
white-space: pre-line;
}

.result-arrow-text .result-arrow-title {
display: block;
font-family: "Noto Sans JP", sans-serif;
font-size: 1.25rem;
font-weight: 700;
line-height: 1.8;
margin-top: 0.45rem;
}

.result-arrow-text .result-arrow-lead {
display: block;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.8;
margin-bottom: 0.35rem;
}

.result-arrow-text .result-arrow-copy {
display: block;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.8;
}

.result-arrow-text .result-arrow-title-main {
font-size: 1.25rem;
}

.result-arrow-text .result-arrow-title-tail {
font-size: 0.875rem;
}

.result-arrow-stack {
display: flex;
flex-direction: column;
gap: 0.25rem;
align-items: center;
justify-content: center
}

.result-arrow-stack img {
width: 1rem;
height: auto
}

.result-followup-text {
margin: 1rem auto 0.9rem;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.8;
letter-spacing: 0;
color: #40200B;
text-align: center;
}

.result-followup-text .result-followup-accent {
font-size: 1rem;
line-height: 1.8;
color: #4DACD5;
}

/* result-title-frame の左右に人物画像を横並び表示�E�既存スタイルは維持E��E*/
.result-type__row {
position: relative;
display: flex;
justify-content: center;
align-items: center;
/* 画像をabsoluteで重�Eる�Eでgapは不要E*/
gap: 0;
/* 画像�E刁E�E高さ確保（少し上に被せる�E�E*/
padding-top: 0.4rem;
}

/* フレームは固定サイズを維持E��画像で押し庁E��られなぁE��E*/
.result-title-frame {
position: relative;
z-index: 2;
font-size: 1.5rem;
font-weight: 700;
line-height: 1.4;
letter-spacing: 0.1em;
}

/* 人物画像をフレームに被せて配置 */
.result-type__figure {
position: absolute;
z-index: 3;
height: 4.5rem;
width: auto;
object-fit: contain;
}

.result-type__figure--left {
left: 50%;
transform: translateX(calc(-50% - 10rem));
bottom: 0.35rem;
}

.result-type__figure--right {
left: 50%;
transform: translateX(calc(-50% + 10rem));
bottom: 0.35rem;
}

@media (max-width:32.5rem) {
.result-type__row {
padding-top: 0.35rem
}

.result-type__figure {
height: 8.1rem
}

.result-type__figure--left {
transform: translateX(calc(-50% - 9.2rem));
bottom: -1.95rem
}

.result-type__figure--right {
transform: translateX(calc(-50% + 9.2rem));
bottom: -1.95rem
}
}

/* FP相諁E��は�E�文字�Eみのラベル�E�E*/
.result-fp-brief {
text-align: center;
margin: 0.6rem 0 0.6rem
}

.result-fp-brief__title {
display: inline-block;
padding: 0.45rem 0.9rem;
border-radius: 0.7rem;
font-family: "Noto Sans JP", sans-serif;
font-weight: 800;
font-size: 1.25rem;
/* 紁E0px */
color: #40200B;
/* 持E���E濁E��ブラウン */
line-height: 1;
letter-spacing: -0.01em;
}

@media(max-width:32.5rem) {
.result-fp-brief__title {
font-size: 1.05rem;
padding: 0.4rem 0.8rem
}
}

/* =============================
PC版：中央に縦長の1本の帯�E�外�Eにオレンジ影�E�E

* 旧: body背景合�Eで帯を描画
* 新: .page-shell を帯として実裁E��るため、このブロチE��は無効匁E
  ============================= */
  /* @media (min-width:48rem){
  body{
  background-image:
  linear-gradient(
  90deg,
  transparent 0%,
  transparent calc(50% - 16.5rem - 0.25rem),
  rgba(243,107,45,0.06) calc(50% - 16.5rem - 0.125rem),
  rgba(243,107,45,0.06) calc(50% - 16.5rem + 0.125rem),
  transparent calc(50% - 16.5rem + 0.25rem),
  transparent calc(50% + 16.5rem - 0.25rem),
  rgba(243,107,45,0.06) calc(50% + 16.5rem - 0.125rem),
  rgba(243,107,45,0.06) calc(50% + 16.5rem + 0.125rem),
  transparent calc(50% + 16.5rem + 0.25rem),
  transparent 100%
  ),
  linear-gradient(
  90deg,
  transparent 0,
  transparent calc(50% - 16.5rem),
  rgba(255,250,241,0.98) calc(50% - 16.5rem),
  rgba(255,250,241,0.98) calc(50% + 16.5rem),
  transparent calc(50% + 16.5rem),
  transparent 100%
  ),
  url('../images/PCbackground_1x.webp');

```
background-repeat: no-repeat, no-repeat, repeat !important;
```

```
background-size: 100% 100%, 100% 100%, auto !important;
background-position: center, center, top left !important;
background-attachment: scroll, scroll, scroll !important;
```

}

body::after{ content:none !important; }
body::before{ content:none !important; }
} */

/* feature-promo 用タイトル/バッジ�E�画像�E斁E��に近づける�E�E*/
.feature-promo .promo-title-wrap {
display: flex;
align-items: center;
justify-content: center;
gap: 0.4rem;
flex-wrap: wrap;
/* 改行を許可して2行表示にする */
text-align: center;
margin-top: 0.2rem;
}

.feature-promo .promo-title-main {
display: block;
/* 忁E��ブロチE��にして上下で改行できるように */
font-size: 1.25rem;
/* 紁E0px、調整可 */
line-height: 1.05;
font-weight: 900;
color: #5a3b22;
/* 濁E��ブラウン */
letter-spacing: -0.02em;
}

.feature-promo .promo-badge {
display: inline-block;
background: #AE8F52;
/* ゴールド系ボックス */
color: #fff;
padding: 0.18rem 0.45rem;
border-radius: 0.35rem;
font-weight: 900;
font-size: 0.82rem;
box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.06);
margin-top: 0.05rem;
/* 行�E高さ調整 */
}

/* 強調小見�Eし（画像下�E補助チE��スト！E*/
.feature-promo .promo-subtext {
font-size: 0.9rem;
color: #40200B;
line-height: 1.4;
text-align: center;
margin-top: 0.35rem;
}

.feature-promo .promo-subtext .promo-subtext-accent {
color: #FF6200;
}

.feature-promo .promo-panel .promo-subtext {
margin-top: 0;
margin-bottom: 0.25rem;
text-align: center;
font-weight: 700;
color: #40200B;
line-height: 1.45;
}

.feature-promo .frame-desc {
background: #FFFBEF;
padding: 0.5rem 1rem 0.55rem;
border-radius: 0.75rem;
width: 18.4375rem;
max-width: 18.4375rem;
height: 8.0625rem;
min-height: 8.0625rem;
box-sizing: border-box;
text-align: center;
margin-left: auto;
margin-right: auto;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
}

.feature-promo .frame-desc .frame-desc-heading {
display: flex;
align-items: flex-end;
justify-content: center;
gap: 0.15rem;
width: 100%;
margin-bottom: 0.5rem;
}

.feature-promo .frame-desc .frame-desc-heading-text {
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end;
transform: translateY(0.08rem);
}

.feature-promo .frame-desc .frame-desc-figure {
width: 2rem;
height: auto;
flex: 0 0 auto;
margin-left: 0.3rem;
transform: translateY(0.12rem);
}

.feature-promo .frame-desc .frame-desc-icon {
width: 1.65rem;
height: auto;
flex: 0 0 auto;
margin-left: 0;
transform: translate(-0.55rem, 0.12rem);
}

.feature-promo .frame-desc .frame-desc-heading .promo-advice {
margin: 0 auto;
font-family: "Noto Sans JP", sans-serif;
font-size: 1.25rem;
font-weight: 700;
line-height: 1;
color: #FFFFFF;
}

/* feature-promo 冁E�E説明文�E�フォントサイズを小さくして読みめE��く！E*/
.feature-promo .frame-desc h4 {
font-size: 0.9375rem;
/* 16px */
line-height: 1.1;
margin: 0 0 0.12rem 0;
color: #5a3b22;
font-weight: 800;
}

.feature-promo .frame-desc .frame-desc-accent {
  font-weight: 700;
color: #FF6200;
}

.feature-promo .frame-desc .desc-small {
font-size: 0.75rem;
line-height: 1.2;
font-weight: 700;
margin-left: 0.15rem;
vertical-align: baseline;
display: inline-block;
color: #5a3b22;
}

.feature-promo .frame-desc .desc-highlight {
display: inline-block;
font-family: "Noto Sans JP", sans-serif;
font-size: 1.25rem;
font-weight: 700;
line-height: 1;
color: #FFFFFF;
}

.feature-promo .frame-desc p {
font-size: 0.85rem;
/* 紁E3.6px */
line-height: 1.45;
color: #5b4f39;
margin: 0;
text-align: center;
}

@media (max-width:32.5rem) {
.feature-promo .frame-desc h4 {
font-size: 0.95rem
}

.feature-promo .frame-desc p {
font-size: 0.82rem
}
}

@media (max-width:32.5rem) {
.feature-promo {
width: 20.5625rem;
height: 22.5625rem;
padding: 2.2rem 0.8rem 0.8rem
}

.frame-ribbon {
top: -10.6rem;
padding: 0.55rem 1.2rem;
font-size: 0.9rem
}

.feature-promo .promo-image {
width: 13.4rem
}
}

/* --- プロモカーチE--- */
.promo-card {
position: relative;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 250, 240, 0.98));
border: 0.0625rem solid rgba(200, 150, 120, 0.35);
border-radius: 0.75rem;
padding: 1.75rem 1rem 1rem;
/* 上部余白を庁E��してリボン用のスペ�Eスを確俁E*/
box-shadow: 0 0.5rem 1.125rem rgba(0, 0, 0, 0.06);
margin: 0.75rem 0 1rem;
overflow: visible;
}

.promo-ribbon {
position: absolute;
top: -0.9rem;
left: 1rem;
display: inline-block;
padding: 0.55rem 1.25rem;
background: linear-gradient(180deg, #ff7b76, #e94f4a);
color: #fff;
font-weight: 800;
font-size: 0.9rem;
border-radius: 0.6rem;
box-shadow: 0 0.35rem 0.7rem rgba(0, 0, 0, 0.12);
z-index: 3;
transform: translateZ(0);
/* レンダリング安定化 */
}

/* リボンの左右の尻尾は四角を回転させた形で表現�E�デモに近い見た目�E�E*/
.promo-ribbon::before,
.promo-ribbon::after {
content: '';
position: absolute;
bottom: -0.38rem;
width: 0.9rem;
height: 0.9rem;
background: #e94f4a;
transform: rotate(45deg);
z-index: -1;
}

.promo-ribbon::before {
left: -0.45rem
}

.promo-ribbon::after {
right: -0.45rem
}

/* 冁E��のコンチE��チE�EチE��ス�E�淡ぁE��景でカード�Eに収める！E*/
.promo-card .promo-inner {
background: #fff;
border-radius: 0.5rem;
padding: 0.875rem;
border: 0.0625rem solid rgba(200, 150, 120, 0.18);
box-shadow: inset 0 0.125rem 0.25rem rgba(0, 0, 0, 0.02);
}

.promo-card .promo-feature {
padding: 0.5rem 0
}

.promo-card .promo-feature img {
display: block;
max-width: 100%;
height: auto;
border-radius: 0.25rem
}

.promo-card .promo-caption {
margin-top: 0.5rem;
font-weight: 700;
color: #333
}

/* 区刁E��の、E、E*/
.promo-plus {
text-align: center;
font-size: 1.25rem;
color: #c08a5d;
margin: 0.5rem 0;
font-weight: 800
}

@media (max-width:32.5rem) {
.promo-card {
padding-top: 2rem;
margin: 0.5rem 0
}

.promo-ribbon {
left: 0.75rem;
top: -1.05rem;
font-size: 0.85rem;
padding: 0.45rem 0.9rem
}

.promo-ribbon::before,
.promo-ribbon::after {
width: 0.74rem;
height: 0.74rem;
left: -0.5rem;
right: -0.5rem
}

.frame-ribbon {
top: -1.6rem;
/* リボン高さ刁E��け上に出ぁE*/
left: 50%;
transform: translateX(-50%);
display: inline-block;
padding: 0.6rem 1rem;
font-size: 0.9rem;
}

.frame-ribbon::before,
.frame-ribbon::after {
width: 0.78rem;
height: 0.78rem;
left: -0.55rem;
right: -0.55rem
}
}

/* --- スチE��プインジケータ --- */
.steps {
display: flex;
gap: 0.5rem;
justify-content: center;
align-items: center;
margin: 0.75rem 0
}

.steps .dot {
width: 2.25rem;
height: 2.25rem;
border-radius: 50%;
background: #fff;
border: 0.125rem solid rgba(0, 0, 0, 0.08);
display: flex;
align-items: center;
justify-content: center;
font-weight: 700
}

.steps .dot.active {
background: #5bc0e0;
color: #fff;
border-color: transparent
}

/* --- 質問カーチE--- */
.question-card {
background: #fff;
border-radius: 0;
padding: 1.25rem 1.1rem;
box-shadow: none;
border: none;
width: min(100%, 21.875rem);
max-width: 21.875rem;
min-height: 28.875rem;
margin-left: auto;
margin-right: auto;
box-sizing: border-box;
}

.question-card h3 {
font-size: 1rem;
line-height: 1.2;
margin-bottom: 0.75rem;
text-align: center;
color: #40200B
}

/* --- 選択肢ボタン�E�選べるカード型�E�E--- */
.option-list {
display: flex;
flex-direction: column;
gap: 0.75rem;
}

.option-btn {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
font-family: "Noto Sans JP";
width: 17.9375rem;
max-width: 17.9375rem;
height: 2.875rem;
min-height: 2.875rem;
padding: 0;
border-radius: 0.75rem;
border: 2px solid #40200B;
background: #fff;
color: #40200B;
font-weight: 500;
font-size: 0.875rem;
text-decoration: none;
margin-top: 0;
margin-left: auto;
margin-right: auto;
box-shadow: 0 2px 0 0 #40200B;
box-sizing: border-box;
}

.option-btn.selected {
background: #bfeff8;
color: #04586b;
border-color: #04586b;
box-shadow: 0 2px 0 0 #04586b;
}

.option-btn:hover:not(.selected) {
background: #E8F8FF;
}

/* 選択肢ラベル冁E�E実裁E��助 */
.option-btn input {
display: none;
}

.option-btn span.option-label {
display: block;
font-family: "Noto Sans JP";
font-size: 0.875rem;
font-weight: 500;
}

.option-btn:focus,
.option-btn:focus-within {
outline: 0.25rem solid rgba(91, 192, 224, 0.25);
}

/* --- フッターバ�E --- */
.footer-bar {
text-align: center;
margin-top: 1.125rem;
padding: 0.875rem 0;
color: #fff;
background: #e77a4f;
border-radius: 0.5rem
}

/* 共通フチE��ー�E�デスクトップ�EコンチE��冁E��示�E�E*/
.site-footer-wrapper {
width: 100%;
padding: 0;
margin-top: 1rem
}

.site-footer {
background: #e77a4f;
color: #fff;
text-align: center;
padding: 0.75rem 0;
border-radius: 0.25rem
}

.site-footer p {
margin: 0;
font-size: 0.875rem
}

/* モバイルのみフルブリードに刁E��替ぁE*/
@media (max-width:32.5rem) {
.site-footer-wrapper {
width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
padding: 0.75rem 0;
/* 上下�E余白 */
box-sizing: border-box;
background: #e77a4f;
/* フル幁E�E背景をラチE��ーに付丁E*/
}

.site-footer {
background: transparent;
/* ラチE��ーが背景を持つ */
color: #fff;
text-align: center;
padding: 0;
/* パディングはラチE��ーで制御 */
border-radius: 0;
/* 角丸は無効 */
max-width: none;
}
}

/* --- 固定フチE��ー�E�モバイルでブラウザ下端に常に表示�E�デスクトップ�E通常フロー�E�E--- */
@media (max-width:48rem) {
.site-footer-wrapper {
position: fixed;
left: 0;
bottom: 0;
width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
z-index: 60;
background: #e77a4f;
/* フル幁E�E背景を維持E*/
padding-top: 0.4rem;
padding-bottom: 0.4rem;
}

.site-footer {
background: transparent;

padding: 0;

border-radius: 0;
max-width: none;
}


body {
padding-bottom: 4.8rem;
}
}

@media (min-width:48rem) {


.site-footer-wrapper {
position: static;
width: 100%;
margin-left: 0;
margin-right: 0;
background: transparent;
padding: 0;
}

.site-footer {
padding: 0.75rem 0;
border-radius: 0.25rem
}

body {
padding-bottom: 0
}
}

/* --- thankyou_material page styles (mobile-first, rem units) --- */
.page-thank {
font-family: Arial, 'Noto Sans JP' sans-serif;
color: #2e2e2e;
}

.thank-hero {
text-align: center;
padding: 1.5rem 0 0.75rem;
}

.thank-hero h1 {
font-size: 1.25rem;
color: #5a3b22;
margin: 0 0 0.5rem;
font-weight: 800;
}

.thank-hero p.lead {
font-size: 0.9rem;
color: #6b4f3a;
margin: 0 0 1rem;
}

.thank-card {
background: #ffffff;
border: 0.1875rem solid #AE8F52;
border-radius: 0.9rem;
padding: 0.9rem;
max-width: 24rem;
margin: 0.75rem auto;
position: relative;
}

.thank-ribbon {
position: absolute;
top: -0.1rem;
left: 50%;
transform: translateX(-50%);
color: #fff;
padding: 0.45rem 0.9rem;
border-radius: 0.6rem;
font-weight: 800;
font-size: 0.95rem;
}

.thank-inner {
padding: 3.6rem;
background: transparent;
border-radius: 0.6rem;
}

.thank-image {
display: block;
margin: 0.6rem auto;
max-width: 12rem;
border-radius: 0.4rem;
}

.thank-cta {
text-align: center;
margin-top: 0.9rem;
}

.thank-cta .btn-apply {
display: inline-block;
background: linear-gradient(90deg, #4facfe, #00f2fe);
color: #fff;
padding: 0.9rem 1.4rem;
border-radius: 2rem;
font-weight: 800;
font-size: 1rem;
text-decoration: none;
box-shadow: 0 0.6rem 1rem rgba(0, 162, 220, 0.12);
}

.thank-plus {
text-align: center;
color: #c08a5d;
font-weight: 700;
font-size: 2.5rem;
/* 20px (モバイル基溁E */
line-height: 1.2;
letter-spacing: -0.01em;
margin: 0 1rem;
}

.thank-desc {
font-size: 0.9rem;
color: #5b4f39;
line-height: 1.6;
text-align: left;
}

.thank-note {
text-align: center;
color: #6b4f3a;
margin-top: 0.8rem;
font-size: 0.85rem;
}

@media (min-width: 48rem) {
.thank-card {
max-width: 32rem;
padding: 1.2rem;
min-height: 33.6875rem;
/* 539px c0211 相彁E*/
}

.thank-hero h1 {
font-size: 1.5rem;
}
}

/* --- result page styles (mobile-first, rem units) --- */
.result-hero {
text-align: center;
padding: 1.25rem 0 0rem;
}

.result-hero .hero-title {
font-size: 1.375rem;
color: #f36b2d;
margin: 0 0 0.4rem;
font-weight: 900;
line-height: 1.05
}

.result-hero .hero-sub {
font-size: 0.95rem;
color: #6b4f3a;
margin: 0 0 0.8rem
}

.result-type {
text-align: center;
margin: 0.6rem 0;
}

.result-title-frame {
display: inline-flex;
/* inline 表示を保ちつつ flex で中央寁E�� */
align-items: center;
/* 縦中央 */
justify-content: center;
/* 横中央 */
width: 17.3125rem;
/* 277px 相彁E*/
height: 4.1875rem;
/* 67px 相彁E*/
padding: 0 0.75rem;
/* 横余白 */
box-sizing: border-box;

border-radius: 0.8rem;
background: #fff;
border: 0.12rem dotted rgba(90, 60, 40, 0.18);
box-shadow: 0 0.6rem 0.9rem rgba(0, 0, 0, 0.06);

font-size: 1.25rem;
font-weight: 900;
color: #5a3b22;
line-height: normal;
/* flex と併用して縦中央を安定させる */
letter-spacing: -0.01em;
margin: 0 auto 0.35rem;
/* 横中央の保険 */
vertical-align: middle;
}

.result-type-sub {
font-size: 0.95rem;
color: #5a3b22;
margin-top: 0.25rem;
margin-bottom: 2.5rem;
font-weight: 700;
}

@media(max-width:32.5rem) {
.result-title-frame {
font-size: 1.5rem;
font-weight: 700;
line-height: 1.4;
letter-spacing: 0.1em;
padding: 0.5rem 0.9rem;
border: 0.12rem dotted rgba(90, 60, 40, 0.18);
}

.result-type-sub {
font-size: 0.9rem;
margin-bottom: 2.5rem
}
}

.result-card {
width: 18.4375rem;
/* 295px */
height: 6.875rem;
/* 110px */
max-width: none;
box-sizing: border-box;
background: #fff;
border-radius: 0.75rem;
border: 0.0625rem solid rgba(64, 32, 11, 0.10);
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.06);
margin: 0.6rem auto;
padding: 0.65rem 0.8rem;
overflow: visible;
text-align: left;
position: relative;
}

.result-card__figure {
position: absolute;
top: -3.5rem;
right: 2.55rem;
width: 3.2rem;
height: auto;
z-index: 2;
pointer-events: none;
}

.result-card__inner {
position: relative;
z-index: 1;
transform: translate(0.5rem, -0.5rem);
}


.result-checklist {
margin: 0;
padding: 0 0 0 0.7rem;
list-style: none
}

.result-checklist__item {
display: flex;
align-items: center;
gap: 0.6rem;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
/* 14px */
line-height: 1.25;
margin: 0.75rem 0;
padding: 0.1rem 0;
font-weight: bold;
color: #40200B;
}

.result-checklist__text {
display: block;
}

.result-card--mortgage {
width: 18.4375rem;
height: 8.125rem;
min-height: 8.125rem;
}

.result-card--education .result-checklist {
padding-left: 0.2rem;
}

.result-card--education .result-checklist__item {
gap: 0.45rem;
}

.result-card--education .result-checklist__text {
white-space: nowrap;
}

.result-checklist-nowrap {
white-space: nowrap;
}

.result-checklist__item::before {
content: "";
width: 0.9375rem;
height: 1.0625rem;
border-radius: 0.15rem;
box-sizing: border-box;
display: inline-grid;
place-items: center;
flex: 0 0 0.9375rem;
background: transparent;

background-image: url('../images/checkmark__1x.webp');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
border: none;
/* 画像表示のため枠を消す */
}

/* 協調オレンジ*/
.accent-orange {
color: #F36B2D;
font-weight: bold;
}

.accent-brown {
color: #40200B;
font-weight: 900
}

/* モバイルは可夁E*/
@media(max-width:32.5rem) {}

/* --- contact step specific visuals (refinement for step1) --- */
.contact-container {
max-width: 30rem;
margin: 0 auto;
padding: 0.8rem;
}

.promo {
background: rgba(255, 250, 240, 0.98);
border: 0.12rem solid rgba(200, 150, 120, 0.35);
border-radius: 1rem;
padding: 1rem;
box-shadow: 0 0.6rem 1rem rgba(0, 0, 0, 0.04);
margin-bottom: 1rem
}

.ribbon {
position: absolute;
left: 50%;
transform: translateX(-50%);
top: -0.9rem;
background: #f06b6b;
color: #fff;
padding: 0.45rem 1rem;
border-radius: 0.6rem;
font-weight: 800
}

.promo-title {
font-weight: 800;
font-size: 1rem;
color: #5a3b22;
text-align: center;
margin-bottom: 0.6rem
}

.promo-media {
display: flex;
align-items: center;
gap: 0.8rem;
justify-content: center
}

.promo-desc {
font-size: 0.9rem;
color: #5b4f39
}

.step-indicator {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
margin: 1rem 0
}

.step-indicator .step {
width: 2.4rem;
height: 2.4rem;
border-radius: 50%;
background: #cfeafc;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
font-weight: 800
}

.step-indicator .step--current {
background: linear-gradient(90deg, #4facfe, #00f2fe);
box-shadow: 0 0.4rem 0.8rem rgba(0, 160, 220, 0.12)
}

.step-indicator .dots {
color: #bfbfbf;
font-size: 1.2rem
}

.form-card {
background: #fff;
border-radius: 0.9rem;
padding: 1.75rem;
box-shadow: 0 0.6rem 1.2rem rgba(0, 0, 0, 0.06);
border: 0.06rem solid rgba(200, 150, 120, 0.12)
}

.form-row {
  margin-bottom: 2rem
}

.label {
display: block;
font-weight: 700;
color: #5a3b22;
margin-bottom: 0.45rem
}

.required-badge {
display: inline-block;
background: #ff7b2f;
color: #fff;
padding: 0.18rem 0.45rem;
border-radius: 0.5rem;
font-weight: 800;
font-size: 0.75rem;
margin-left: 0.5rem
}

.input-box {
width: 100%;
padding: 0.75rem;
border-radius: 0.7rem;
border: 0.12rem solid #eee;
font-size: 1rem;
box-sizing: border-box;
background: #fff
}

.input-box::placeholder {
color: #E0E0E0;
}

.input-inline {
display: flex;
align-items: center;
gap: 0.5rem
}

.input-inline input {
padding: 0.6rem;
border-radius: 0.6rem;
border: 0.12rem solid #eee;
font-size: 1rem
}

.input-inline input[type=number] {
text-align: center
}

.radio-group {
display: flex;
gap: 1rem;
align-items: center
}

.radio-label {
position: relative;
padding-left: 1.8rem;
font-weight: 700;
color: #5a3b22
}

.radio-label input {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
opacity: 0;
width: 1.2rem;
height: 1.2rem;
margin: 0
}

.radio-label .radio-custom {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 1.2rem;
height: 1.2rem;
border-radius: 50%;
border: 0.12rem solid #c9eafb;
background: #fff
}

.radio-label input:checked+.radio-custom {
background: linear-gradient(90deg, #4facfe, #00f2fe);
border-color: transparent;
box-shadow: 0 0.25rem 0.5rem rgba(0, 160, 220, 0.12)
}

.btn-row {
display: flex;
gap: 0.75rem;
align-items: center;
justify-content: space-between;
margin-top: 0.6rem
}

.btn--gradient {
flex: 1;
display: inline-flex;
align-items: center;
justify-content: center;
background: linear-gradient(90deg, #4C79CB 0%, #6EDCE4 100%);
color: #fff;
padding: 0.9rem 1.25rem;
border-radius: 2rem;
font-weight: 500;
font-size: 1rem;
border: none;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
white-space: nowrap;
}

.btn--secondary {
  background: #9b9b9b;
  color: #fff;
  padding: 0.75rem 1rem;
  border-radius: 2rem;
  text-decoration: none;
  height: 55px;
  width: 100px;
  font-size: 1rem;
  font-weight: 700;
}

.footer-note {
text-align: center;
color: #6b4f3a;
margin-top: 1rem
}

@media(min-width:48rem) {
.contact-container {
padding: 2rem
}
}

/* --- hero features�E�ピル型タグ群�E�E--- */
.hero-features {
text-align: center;
margin: 0.5rem 0 0.75rem
}

.hero-subtext {
font-family: "VDL-Logona", sans-serif;
color: #5a3b22;
font-weight: 700;
position: relative;
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto 0.5rem
}

.feature-list {
list-style: none;
padding: 0;
margin: 0;
display: flex;
gap: 0.6rem;
justify-content: center;
flex-wrap: wrap
}

.feature-list li {
margin: 0
}

.feature-pill {
display: inline-block;
padding: 0.45rem 0.95rem;
border-radius: 2rem;
font-weight: 800;
font-size: 0.85rem;
box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.06);
color: #084b3b;
background: #eefaf6
}

.pill--green {
background: #e7fbf4;
color: #087a5f;
border: 0.06rem solid rgba(8, 122, 95, 0.08)
}

.pill--pink {
background: #fff0f6;
color: #c83f6a;
border: 0.06rem solid rgba(200, 80, 120, 0.06)
}

.pill--purple {
background: #f3f7ff;
color: #6b4f9a;
border: 0.06rem solid rgba(107, 79, 154, 0.06)
}

.pill--yellow {
background: #fffaf0;
color: #b86a2f;
border: 0.06rem solid rgba(184, 106, 47, 0.06)
}

.pill--blue {
background: #f0fbff;
color: #2b7fa3;
border: 0.06rem solid rgba(43, 127, 163, 0.06)
}

@media(max-width:32.5rem) {
.feature-pill {
padding: 0.4rem 0.8rem;
font-size: 0.8rem
}
}

/* --- hero 用 大きなスチE��プ表示�E�Endex の見�Eし下に表示�E�E--- */
.hero-steps {
display: flex;
gap: 0.6rem;
align-items: center;
justify-content: center;
margin-top: 0.85rem
}

.hero-steps .step-dot {
width: 3.6rem;
height: 3.6rem;
border-radius: 50%;
background: #fff;
border: 0.125rem solid rgba(0, 0, 0, 0.08);
display: flex;
align-items: center;
justify-content: center;
font-weight: 900;
font-size: 1rem;
color: #2b9fbf
}

.hero-steps .sep {
color: #cfcfcf;
font-weight: 800;
font-size: 1.25rem;
margin: 0 0.25rem
}

.hero-steps .step-dot.active {
background: #5bc0e0;
color: #fff;
border-color: transparent;
box-shadow: 0 0.4rem 0.8rem rgba(0, 160, 220, 0.12)
}

@media (max-width:32.5rem) {
.hero-steps .step-dot {
width: 2.25rem;
height: 2.25rem;
font-size: 0.8rem
}

.hero-steps .sep {
font-size: 1rem
}
}

@media (min-width:48rem) {

/* 大きな画面ではタイトル画像とスチE��プを大きく見せめE*/
.fv-title {
max-width: 310.7px;
width: min(100%, 310.7px);
}

.fv-figure {
height: 9rem;
}


.hero-steps {
margin-top: 1.2rem
}

.hero-steps .step-dot {
width: 4.5rem;
height: 4.5rem;
font-size: 1.2rem
}

.hero-steps .sep {
font-size: 1.6rem;
margin: 0 0.6rem
}
}

/* アクセシビリチE��用ユーチE��リチE���E�画面上�E非表示、スクリーンリーダーは読める�E�E*/
.sr-only,
.visually-hidden {
position: absolute !important;
left: -9999px !important;
top: auto !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: 0 !important;
overflow: hidden !important;
clip: rect(0 0 0 0) !important;
white-space: nowrap !important;
border: 0 !important;
}

/* Result intro framed box (白ぁE��丸ボックス) */
.result-intro-frame {
background: #fff;
padding: 1rem 1.1rem;
border-radius: 0.9rem;
border: 0.06rem solid rgba(160, 200, 180, 0.12);
/* 薁E��グリーン系の枠 */
box-shadow: 0 0.9rem 1.4rem rgba(0, 0, 0, 0.06);
max-width: 22.5rem;
margin: 2.5rem auto 0.8rem;
text-align: center;
}

.result-intro-frame .result-intro {
margin: 0;
font-size: 0.95rem;
color: #40200B;
line-height: 1.6;
}

@media(max-width:32.5rem) {
.result-intro-frame {
padding: 0.85rem 0.9rem;
max-width: 20.5rem
}

.result-intro-frame .result-intro {
font-size: 0.92rem
}
}

/* CVA 画像�Eタン�E�Eesult ペ�Eジ下！E*/
.cva-wrap {
text-align: center;
margin: 0.9rem 0 1.4rem
}

.cva-button {
display: inline-block;
border-radius: 1.25rem;
overflow: hidden;
transition: transform .12s ease, box-shadow .12s ease
}

.cva-button img {
display: block;
width: 18.5rem;
max-width: 90%;
height: auto;
display: block
}

.cva-button:active {
transform: translateY(1px);
box-shadow: 0 0.4rem 0.8rem rgba(0, 0, 0, 0.06)
}

@media(max-width:32.5rem) {
.cva-button img {
width: 16.5rem
}

.cva-wrap {
margin: 0.8rem 0
}
}

/* 「を具体的に整琁E��きます。」と矢印 */
.result-arrow-section {
text-align: center;
margin: 0.6rem 0
}

.result-arrow-text {
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.8;
color: #40200B;
margin: 0 0 1.8rem;
white-space: pre-line;
}

.result-arrow-text .result-arrow-title {
display: block;
font-family: "Noto Sans JP", sans-serif;
font-size: 1.25rem;
font-weight: 700;
line-height: 1.8;
margin-top: 0.45rem;
}

.result-arrow-text .result-arrow-lead {
display: block;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.8;
margin-bottom: 0.35rem;
}

.result-arrow-text .result-arrow-copy {
display: block;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.8;
}

.result-arrow-text .result-arrow-title-main {
font-size: 1.25rem;
}

.result-arrow-text .result-arrow-title-tail {
font-size: 0.875rem;
}

.result-arrow-stack {
display: flex;
flex-direction: column;
gap: 0.25rem;
align-items: center;
justify-content: center
}

.result-arrow-stack img {
width: 1rem;
height: auto
}

.result-followup-text {
margin: 1rem auto 0.9rem;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.8;
letter-spacing: 0;
color: #40200B;
text-align: center;
}

.result-followup-text .result-followup-accent {
font-size: 1rem;
line-height: 1.8;
color: #4DACD5;
}

/* result-title-frame の左右に人物画像を横並び表示�E�既存スタイルは維持E��E*/
.result-type__row {
position: relative;
display: flex;
justify-content: center;
align-items: center;
/* 画像をabsoluteで重�Eる�Eでgapは不要E*/
gap: 0;
/* 画像�E刁E�E高さ確保（少し上に被せる�E�E*/
padding-top: 0.4rem;
}

/* フレームは固定サイズを維持E��画像で押し庁E��られなぁE��E*/
.result-title-frame {
position: relative;
z-index: 2;
}

/* 人物画像をフレームに被せて配置 */
.result-type__figure {
position: absolute;
z-index: 3;
height: 4.5rem;
width: auto;
object-fit: contain;
}

.result-type__figure--left {
left: 50%;
transform: translateX(calc(-50% - 10rem));
bottom: 0.35rem;
}

.result-type__figure--right {
left: 50%;
transform: translateX(calc(-50% + 10rem));
bottom: 0.35rem;
}

@media (max-width:32.5rem) {
.result-type__row {
padding-top: 0.35rem
}

.result-type__figure {
height: 8.1rem
}

.result-type__figure--left {
transform: translateX(calc(-50% - 9.2rem));
bottom: -1.95rem
}

.result-type__figure--right {
transform: translateX(calc(-50% + 9.2rem));
bottom: -1.95rem
}
}

/* FP相諁E��は�E�文字�Eみのラベル�E�E*/
.result-fp-brief {
text-align: center;
margin: 0.6rem 0 0.6rem
}

.result-fp-brief__title {
display: inline-block;
padding: 0.45rem 0.9rem;
border-radius: 0.7rem;
font-weight: 800;
font-size: 1.25rem;
/* 紁E0px */
color: #40200B;
/* 持E���E濁E��ブラウン */
line-height: 1;
letter-spacing: -0.01em;
}

@media(max-width:32.5rem) {
.result-fp-brief__title {
font-size: 1.05rem;
padding: 0.4rem 0.8rem
}
}

/* =============================
PC版：中央に縦長の1本の帯�E�外�Eにオレンジ影�E�E

* 旧: body背景合�Eで帯を描画
* 新: .page-shell を帯として実裁E��るため、このブロチE��は無効匁E
  ============================= */
  /* @media (min-width:48rem){
  body{
  background-image:
  linear-gradient(
  90deg,
  transparent 0%,
  transparent calc(50% - 16.5rem - 0.25rem),
  rgba(243,107,45,0.06) calc(50% - 16.5rem - 0.125rem),
  rgba(243,107,45,0.06) calc(50% - 16.5rem + 0.125rem),
  transparent calc(50% - 16.5rem + 0.25rem),
  transparent calc(50% + 16.5rem - 0.25rem),
  rgba(243,107,45,0.06) calc(50% + 16.5rem - 0.125rem),
  rgba(243,107,45,0.06) calc(50% + 16.5rem + 0.125rem),
  transparent calc(50% + 16.5rem + 0.25rem),
  transparent 100%
  ),
  linear-gradient(
  90deg,
  transparent 0,
  transparent calc(50% - 16.5rem),
  rgba(255,250,241,0.98) calc(50% - 16.5rem),
  rgba(255,250,241,0.98) calc(50% + 16.5rem),
  transparent calc(50% + 16.5rem),
  transparent 100%
  ),
  url('../images/PCbackground_1x.webp');

```
background-repeat: no-repeat, no-repeat, repeat !important;
```

```
background-size: 100% 100%, 100% 100%, auto !important;
background-position: center, center, top left !important;
background-attachment: scroll, scroll, scroll !important;
```

}

body::after{ content:none !important; }
body::before{ content:none !important; }
} */

/* feature-promo 用タイトル/バッジ�E�画像�E斁E��に近づける�E�E*/
.feature-promo .promo-title-wrap {
display: flex;
align-items: center;
justify-content: center;
gap: 0.4rem;
flex-wrap: wrap;
/* 改行を許可して2行表示にする */
text-align: center;
margin-top: 0.2rem;
}

.feature-promo .promo-title-main {
display: block;
/* 忁E��ブロチE��にして上下で改行できるように */
font-size: 1.25rem;
/* 紁E0px、調整可 */
line-height: 1.05;
font-weight: 900;
color: #5a3b22;
/* 濁E��ブラウン */
letter-spacing: -0.02em;
}

.feature-promo .promo-badge {
display: inline-block;
background: #AE8F52;
/* ゴールド系ボックス */
color: #fff;
padding: 0.18rem 0.45rem;
border-radius: 0.35rem;
font-weight: 900;
font-size: 0.82rem;
box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.06);
margin-top: 0.05rem;
/* 行�E高さ調整 */
}

/* 強調小見�Eし（画像下�E補助チE��スト！E*/
.feature-promo .promo-subtext {
font-size: 0.9rem;
color: #6b4f39;
line-height: 1.4;
text-align: center;
margin-top: 0.35rem;
}

/* feature-promo 冁E�E説明文�E�フォントサイズを小さくして読みめE��く！E*/
.feature-promo .frame-desc h4 {
font-size: 1rem;
/* 16px */
margin: 0 0 0.25rem 0;
color: #5a3b22;
font-weight: 800;
}

.feature-promo .frame-desc p {
font-size: 0.85rem;
/* 紁E3.6px */
line-height: 1.45;
color: #5b4f39;
margin: 0;
}

@media (max-width:32.5rem) {
.feature-promo .frame-desc h4 {
font-size: 0.95rem
}

.feature-promo .frame-desc p {
font-size: 0.82rem
}
}

@media (max-width:32.5rem) {
.feature-promo {
width: 20.5625rem;
height: 22.5625rem;
padding: 1.2rem 0.8rem 0.8rem
}

.frame-ribbon {
top: -10.6rem;
padding: 0.55rem 1.2rem;
font-size: 0.9rem
}

.feature-promo .promo-image {
width: 13.4rem
}
}

/* --- プロモカーチE--- */
.promo-card {
position: relative;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 250, 240, 0.98));
border: 0.0625rem solid rgba(200, 150, 120, 0.35);
border-radius: 0.75rem;
padding: 1.75rem 1rem 1rem;
/* 上部余白を庁E��してリボン用のスペ�Eスを確俁E*/
box-shadow: 0 0.5rem 1.125rem rgba(0, 0, 0, 0.06);
margin: 0.75rem 0 1rem;
overflow: visible;
}

.promo-ribbon {
position: absolute;
top: -0.9rem;
left: 1rem;
display: inline-block;
padding: 0.55rem 1.25rem;
background: linear-gradient(180deg, #ff7b76, #e94f4a);
color: #fff;
font-weight: 800;
font-size: 0.9rem;
border-radius: 0.6rem;
box-shadow: 0 0.35rem 0.7rem rgba(0, 0, 0, 0.12);
z-index: 3;
transform: translateZ(0);
/* レンダリング安定化 */
}

/* リボンの左右の尻尾は四角を回転させた形で表現�E�デモに近い見た目�E�E*/
.promo-ribbon::before,
.promo-ribbon::after {
content: '';
position: absolute;
bottom: -0.38rem;
width: 0.9rem;
height: 0.9rem;
background: #e94f4a;
transform: rotate(45deg);
z-index: -1;
}

.promo-ribbon::before {
left: -0.45rem
}

.promo-ribbon::after {
right: -0.45rem
}

/* 冁E��のコンチE��チE�EチE��ス�E�淡ぁE��景でカード�Eに収める！E*/
.promo-card .promo-inner {
background: #fff;
border-radius: 0.5rem;
padding: 0.875rem;
border: 0.0625rem solid rgba(200, 150, 120, 0.18);
box-shadow: inset 0 0.125rem 0.25rem rgba(0, 0, 0, 0.02);
}

.promo-card .promo-feature {
padding: 0.5rem 0
}

.promo-card .promo-feature img {
display: block;
max-width: 100%;
height: auto;
border-radius: 0.25rem
}

.promo-card .promo-caption {
margin-top: 0.5rem;
font-weight: 700;
color: #333
}

/* 区刁E��の、E、E*/
.promo-plus {
text-align: center;
font-size: 1.25rem;
color: #c08a5d;
margin: 0.5rem 0;
font-weight: 800
}

@media (max-width:32.5rem) {
.promo-card {
padding-top: 2rem;
margin: 0.5rem 0
}

.promo-ribbon {
left: 0.75rem;
top: -1.05rem;
font-size: 0.85rem;
padding: 0.45rem 0.9rem
}

.promo-ribbon::before,
.promo-ribbon::after {
width: 0.74rem;
height: 0.74rem;
left: -0.5rem;
right: -0.5rem
}

.frame-ribbon {
top: -1.6rem;
/* リボン高さ刁E��け上に出ぁE*/
left: 50%;
transform: translateX(-50%);
display: inline-block;
padding: 0.6rem 1rem;
font-size: 0.9rem;
}

.frame-ribbon::before,
.frame-ribbon::after {
width: 0.78rem;
height: 0.78rem;
left: -0.55rem;
right: -0.55rem
}
}

/* --- スチE��プインジケータ --- */
.steps {
display: flex;
gap: 0.5rem;
justify-content: center;
align-items: center;
margin: 0.75rem 0
}

.steps .dot {
width: 2.25rem;
height: 2.25rem;
border-radius: 50%;
background: #fff;
border: 0.125rem solid rgba(0, 0, 0, 0.08);
display: flex;
align-items: center;
justify-content: center;
font-weight: 700
}

.steps .dot.active {
background: #5bc0e0;
color: #fff;
border-color: transparent
}

/* --- 質問カーチE--- */
.question-card {
background: #fff;
border-radius: 0;
padding: 1.5rem 1.1rem;
box-shadow: none;
border: none;
width: min(100%, 21.875rem);
max-width: 21.875rem;
min-height: 28.875rem;
margin-left: auto;
margin-right: auto;
box-sizing: border-box;
}


/* --- 選択肢ボタン�E�選べるカード型�E�E--- */
.option-list {
display: flex;
flex-direction: column;
gap: 1rem;
}

.option-btn {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
font-family: "Noto Sans JP";
width: 17.9375rem;
max-width: 17.9375rem;
height: 2.875rem;
min-height: 2.875rem;
padding: 0;
border-radius: 0.75rem;
border: 2px solid #40200B;
background: #fff;
color: #40200B;
font-weight: 500;
font-size: 0.875rem;
text-decoration: none;
margin-top: 0;
margin-left: auto;
margin-right: auto;
box-shadow: 0 2px 0 0 #40200B;
box-sizing: border-box;
}

.option-btn.selected {
background: #bfeff8;
color: #04586b;
border-color: #04586b;
box-shadow: 0 2px 0 0 #04586b;
}

/* 選択肢ラベル冁E�E実裁E��助 */
.option-btn input {
display: none;
}

.option-btn span.option-label {
display: block;
font-family: "Noto Sans JP";
font-size: 0.875rem;
font-weight: 500;
}

.option-btn:focus,
.option-btn:focus-within {
outline: 0.25rem solid rgba(91, 192, 224, 0.25);
}

/* --- フッターバ�E --- */
.footer-bar {
text-align: center;
margin-top: 1.125rem;
padding: 0.875rem 0;
color: #fff;
background: #e77a4f;
border-radius: 0.5rem
}

/* 共通フチE��ー�E�デスクトップ�EコンチE��冁E��示�E�E*/
.site-footer-wrapper {
width: 100%;
padding: 0;
margin-top: 1rem
}

.site-footer {
background: #F18A61;
color: #fff;
text-align: center;
padding: 0.75rem 0;
border-radius: 0.25rem
}

.site-footer p {
margin: 0;
font-size: 0.875rem
}

@media(min-width:48rem) {
.contact-container {
padding: 2rem
}
}

/* --- hero features�E�ピル型タグ群�E�E--- */
.hero-features {
text-align: center;
margin: 1rem 0 0.75rem
}

.hero-subtext {
font-family: "VDL-Logona", sans-serif;
color: #5a3b22;
font-weight: 700;
position: relative;
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto 0.5rem
}

.feature-list {
list-style: none;
padding: 0;
margin: 0;
display: flex;
gap: 0.6rem;
justify-content: center;
flex-wrap: wrap
}

.feature-list li {
margin: 0
}

.feature-pill {
display: inline-block;
padding: 0.45rem 0.95rem;
border-radius: 2rem;
font-weight: 800;
font-size: 0.85rem;
box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.06);
color: #084b3b;
background: #eefaf6
}

.pill--green {
background: #e7fbf4;
color: #087a5f;
border: 0.06rem solid rgba(8, 122, 95, 0.08)
}

.pill--pink {
background: #fff0f6;
color: #c83f6a;
border: 0.06rem solid rgba(200, 80, 120, 0.06)
}

.pill--purple {
background: #f3f7ff;
color: #6b4f9a;
border: 0.06rem solid rgba(107, 79, 154, 0.06)
}

.pill--yellow {
background: #fffaf0;
color: #b86a2f;
border: 0.06rem solid rgba(184, 106, 47, 0.06)
}

.pill--blue {
background: #f0fbff;
color: #2b7fa3;
border: 0.06rem solid rgba(43, 127, 163, 0.06)
}

@media(max-width:32.5rem) {
.feature-pill {
padding: 0.4rem 0.8rem;
font-size: 0.8rem
}
}

/* --- hero 用 大きなスチE��プ表示�E�Endex の見�Eし下に表示�E�E--- */
.hero-steps {
display: flex;
gap: 0.6rem;
align-items: center;
justify-content: center;
margin-top: 0.85rem
}

.hero-steps .step-dot {
width: 3.6rem;
height: 3.6rem;
border-radius: 50%;
background: #fff;
border: 0.125rem solid rgba(0, 0, 0, 0.08);
display: flex;
align-items: center;
justify-content: center;
font-weight: 900;
font-size: 1rem;
color: #2b9fbf
}

.hero-steps .sep {
color: #cfcfcf;
font-weight: 800;
font-size: 1.25rem;
margin: 0 0.25rem
}

.hero-steps .step-dot.active {
background: #5bc0e0;
color: #fff;
border-color: transparent;
box-shadow: 0 0.4rem 0.8rem rgba(0, 160, 220, 0.12)
}

@media (max-width:32.5rem) {
.hero-steps .step-dot {
width: 2.25rem;
height: 2.25rem;
font-size: 0.8rem
}

.hero-steps .sep {
font-size: 1rem
}
}

@media (min-width:48rem) {

/* 大きな画面ではタイトル画像とスチE��プを大きく見せめE*/
.fv-title {
max-width: 310.7px;
width: min(100%, 310.7px);
}

.fv-figure {
height: 9rem;
}


.hero-steps {
margin-top: 1.2rem
}

.hero-steps .step-dot {
width: 4.5rem;
height: 4.5rem;
font-size: 1.2rem
}

.hero-steps .sep {
font-size: 1.6rem;
margin: 0 0.6rem
}
}

/* アクセシビリチE��用ユーチE��リチE���E�画面上�E非表示、スクリーンリーダーは読める�E�E*/
.sr-only,
.visually-hidden {
position: absolute !important;
left: -9999px !important;
top: auto !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: 0 !important;
overflow: hidden !important;
clip: rect(0 0 0 0) !important;
white-space: nowrap !important;
border: 0 !important;
}

/* Result intro framed box (白ぁE��丸ボックス) */
.result-intro-frame {
background: #fff;
padding: 1rem 1.1rem;
border-radius: 0.9rem;
border: 0.06rem solid rgba(160, 200, 180, 0.12);
/* 薁E��グリーン系の枠 */
box-shadow: 0 0.9rem 1.4rem rgba(0, 0, 0, 0.06);
max-width: 22.5rem;
margin: 0.6rem auto 0.8rem;
text-align: center;
}

.result-intro-frame .result-intro {
margin: 0;
font-size: 1rem;
line-height: 1.6;
}

@media(max-width:32.5rem) {
.result-intro-frame {
padding: 0.85rem 0.9rem;
max-width: 20.5rem
}

.result-intro-frame .result-intro {
font-size: 1rem
}
}


.cva-wrap {
text-align: center;
margin: 0.9rem 0 1.4rem
}

.cva-button {
display: inline-block;
border-radius: 1.25rem;
overflow: hidden;
transition: transform .12s ease, box-shadow .12s ease
}

.cva-button img {
display: block;
width: 18.5rem;
max-width: 90%;
height: auto;
display: block
}

.cva-button:active {
transform: translateY(1px);
box-shadow: 0 0.4rem 0.8rem rgba(0, 0, 0, 0.06)
}

@media(max-width:32.5rem) {
.cva-button img {
width: 16.5rem
}

.cva-wrap {
margin: 0.8rem 0
}
}

/* 「を具体的に整琁E��きます。」と矢印 */
.result-arrow-section {
text-align: center;
margin: 0.6rem 0
}

.result-arrow-text {
font-family: "Noto Sans JP", sans-serif;
font-weight: bold;
font-size: 0.875rem;
line-height: 1.8;
color: #40200B;
margin: 0 0 1.8rem;
white-space: pre-line;
}

.result-arrow-text .result-arrow-title {
display: block;
font-family: "Noto Sans JP", sans-serif;
font-size: 1.25rem;
font-weight: 700;
line-height: 1.8;
margin-top: 0.45rem;
}

.result-arrow-text .result-arrow-lead {
display: block;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.8;
margin-bottom: 0.35rem;
}

.result-arrow-text .result-arrow-copy {
display: block;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.8;
}

.result-arrow-text .result-arrow-title-main {
font-size: 1.25rem;
}

.result-arrow-text .result-arrow-title-tail {
font-size: 0.875rem;
}

.result-arrow-stack {
display: flex;
flex-direction: column;
gap: 0.25rem;
align-items: center;
justify-content: center
}

.result-arrow-stack img {
width: 1rem;
height: auto
}

/* result-title-frame の左右に人物画像を横並び表示�E�既存スタイルは維持E��E*/
.result-type__row {
position: relative;
display: flex;
justify-content: center;
align-items: center;
/* 画像をabsoluteで重�Eる�Eでgapは不要E*/
gap: 0;
/* 画像�E刁E�E高さ確保（少し上に被せる�E�E*/
padding-top: 0.4rem;
}

/* フレームは固定サイズを維持E��画像で押し庁E��られなぁE��E*/
.result-title-frame {
position: relative;
z-index: 2;
}

/* 人物画像をフレームに被せて配置 */
.result-type__figure {
position: absolute;
z-index: 3;
height: 4.5rem;
width: auto;
object-fit: contain;
}

.result-type__figure--left {
left: 50%;
transform: translateX(calc(-50% - 10rem));
bottom: 0.35rem;
}

.result-type__figure--right {
left: 50%;
transform: translateX(calc(-50% + 10rem));
bottom: 0.35rem;
}

@media (max-width:32.5rem) {
.result-type__row {
padding-top: 0.35rem
}

.result-type__figure {
height: 8.1rem
}

.result-type__figure--left {
transform: translateX(calc(-50% - 9.2rem));
bottom: -1.95rem
}

.result-type__figure--right {
transform: translateX(calc(-50% + 9.2rem));
bottom: -1.95rem
}
}

/* FP相諁E��は�E�文字�Eみのラベル�E�E*/
.result-fp-brief {
text-align: center;
margin: 0.6rem 0 0.6rem
}

.result-fp-brief__title {
display: inline-block;
padding: 0.45rem 0.9rem;
border-radius: 0.7rem;
font-weight: 800;
font-size: 1.25rem;
/* 紁E0px */
color: #40200B;
/* 持E���E濁E��ブラウン */
line-height: 1;
letter-spacing: -0.01em;
}

@media(max-width:32.5rem) {
.result-fp-brief__title {
font-size: 1.25rem;
padding: 0.4rem 0.8rem;
    font-weight: bold;
}
}

/* =============================
PC版：中央に縦長の1本の帯�E�外�Eにオレンジ影�E�E

* 旧: body背景合�Eで帯を描画
* 新: .page-shell を帯として実裁E��るため、このブロチE��は無効匁E
  ============================= */
  /* @media (min-width:48rem){
  body{
  background-image:
  linear-gradient(
  90deg,
  transparent 0%,
  transparent calc(50% - 16.5rem - 0.25rem),
  rgba(243,107,45,0.06) calc(50% - 16.5rem - 0.125rem),
  rgba(243,107,45,0.06) calc(50% - 16.5rem + 0.125rem),
  transparent calc(50% - 16.5rem + 0.25rem),
  transparent calc(50% + 16.5rem - 0.25rem),
  rgba(243,107,45,0.06) calc(50% + 16.5rem - 0.125rem),
  rgba(243,107,45,0.06) calc(50% + 16.5rem + 0.125rem),
  transparent calc(50% + 16.5rem + 0.25rem),
  transparent 100%
  ),
  linear-gradient(
  90deg,
  transparent 0,
  transparent calc(50% - 16.5rem),
  rgba(255,250,241,0.98) calc(50% - 16.5rem),
  rgba(255,250,241,0.98) calc(50% + 16.5rem),
  transparent calc(50% + 16.5rem),
  transparent 100%
  ),
  url('../images/PCbackground_1x.webp');

```
background-repeat: no-repeat, no-repeat, repeat !important;
```

```
background-size: 100% 100%, 100% 100%, auto !important;
background-position: center, center, top left !important;
background-attachment: scroll, scroll, scroll !important;
```

}

body::after{ content:none !important; }
body::before{ content:none !important; }
} */

@media (min-width:48rem) {
}

@media (max-width:32.5rem) {
}

/* thank-hero と thank-card の間を相対値で庁E��めE*/
.thank-hero {
margin-bottom: 1.25rem;
}

/* 基本�E�E.25rem = 20px�E�E*/
@media (min-width:48rem) {
.thank-hero {
margin-bottom: 3rem;
}

/* PCは庁E��に */
}

@media (max-width:32.5rem) {

.thank-hero {
margin-bottom: 2.9rem;
}

/* モバイルは控えめ */
}

.thankyou-material .thank-card {
width: min(100%, 20.5625rem);
height: 32.1875rem;
margin: 0 auto;
box-sizing: border-box;
min-height: 20.5rem;
/* 白枠が少し長く見えすぎなぁE��ぁE��整 */
}

/* thankyou_material�E�CTAボタン幁E��相対値で可変に�E�他�Eージへ影響させなぁE��E*/
.thankyou-material .thank-cta .btn-apply {
display: inline-flex;
/* 斁E��＋アイコンを中央揁E��しやすく */
align-items: center;
justify-content: center;

width: min(100%, 20rem);
/* 親の幁E��収めつつ最大幁E��制陁E*/
max-width: 100%;
box-sizing: border-box;

padding: 0.95rem 1.25rem;
/* 高さは維持しつつ横の余白も確俁E*/
}

/* ボタンをカード�Eで中央寁E���E�念のため�E�E*/
.thankyou-material .thank-cta {
text-align: center;
}

.thankyou-material .thank-card {
position: relative;
}

/* 念のため */

.thankyou-material .thank-ribbon {

width: min(100%, 17.75rem);

top: -1.25rem;
height: 3.8125rem;
max-width: 100%;
pointer-events: none;
display: block;

}

/* リボンの“見た目の高さ”を45px*/
.thankyou-material .thank-card {
padding-top: 3rem;
/* リボンが被らいように*/
}

.thankyou-material .promo-title-wrap {
display: flex;
align-items: baseline;
justify-content: center;
gap: 0.5rem;
margin: 0.4rem 0 0.7rem;
line-height: 1.1;
}

.thankyou-material .promo-title-main {
font-size: 1.35rem;
/* タイトル斁E��E*/
font-weight: 900;
color: #3b2b1f;
letter-spacing: 0.02em;
}

.thankyou-material .promo-badge {
display: inline-block;
padding: 0.25rem 0.55rem;
border-radius: 0.35rem;
background: #AE8F52;
/* 金系 */
color: #fff;
font-weight: 900;
font-size: 0.9rem;
white-space: nowrap;
}

/* thankyou_material�E�タイトル行を改行させなぁE*/
.thankyou-material .thank-inner {
flex-wrap: nowrap;
white-space: nowrap;
padding: 3.2rem 1.6rem 1.2rem;
}

/* thankyou_material*/
.thankyou-material .thank-desc .desc-box {
/* 左パディングを無くし、*/
padding: 0.6rem 0.8rem 0.6rem 0;
margin-left: -0.9rem;
/* カード�E側のパディング(0.9rem)に合わせて調整 */
width: calc(100% + 0.9rem);
/* 引き出した刁 */
box-sizing: border-box;
}

.thankyou-material .thank-desc .desc-lines {
margin: 0;
text-align: center !important;
color: #5b4f39;
line-height: 1.6;
}

/* 引き出し量を控えめに */
@media (max-width:32.5rem) {
.thankyou-material .thank-desc .desc-box {
margin-left: -2.5rem;
width: calc(100% + 0.5rem);
padding: 0.5rem 0.6rem 0.5rem 0;
}
}

/* thankyou_material*/
.thankyou-material .desc-title {
/* 中央まま見た目を右へずらす！Eemで相対持E*/
transform: translateX(3rem);
/* 6px右へ */
display: block;
}

/* 小画面ではずらし量を控えめに */
@media (max-width:32.5rem) {
.thankyou-material .desc-title {
transform: translateX(1rem);
/* 紁E.2px右へ */
}
}

/* thankyou_material�E�特典領域�E�背景 #FFFBEF�E� E他�Eージに影響させなぁE*/
.thankyou-material .promo-panel {
background: #FFFBEF;
padding: 0.9rem 1rem;
border-radius: 0.75rem;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.6rem;
margin: 0.6rem 0;
box-sizing: border-box;
width: 100%;
}

.thankyou-material .promo-panel .promo-title-wrap {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
white-space: nowrap;
}

.thankyou-material .promo-panel .promo-title-main {
font-size: 1.25rem;
font-weight: 900;
color: #3b2b1f;
line-height: 1;
}

.thankyou-material .promo-panel .promo-badge {
background: #AE8F52;
color: #fff;
border-radius: 0.35rem;
font-weight: 900;
font-size: 0.85rem;
white-space: nowrap;
}

.thankyou-material .promo-panel .thank-image {
max-width: 12rem;
width: clamp(8rem, 40%, 12rem);
height: auto;
display: block;
border-radius: 0.4rem;
}

.thankyou-material .promo-panel .thank-cta .btn-apply {
width: min(92%, 20rem);
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.85rem 1.25rem;
border-radius: 2rem;
font-weight: 800;
text-decoration: none;
}

/* モバイル微調整 */
@media (max-width:32.5rem) {
.thankyou-material .promo-panel {
padding: 0.7rem 0.8rem;
gap: 0.5rem;
}

.thankyou-material .promo-panel .promo-title-main {
font-size: 1.05rem;
}

.thankyou-material .promo-panel .thank-image {
width: 10.5rem;
}

.thankyou-material .thank-inner {
padding: 3rem 1rem 0.9rem;
}
}

/* Mobile: promo-panel を改行させずに肌色枠を横に庁E��る（影響めEthankyou_material に限定！E*/
@media (max-width:32.5rem) {
.thankyou-material .promo-panel {
/* コンチE��の左右パディング刁E��引き出して枠を庁E��めE*/
width: calc(100% + 4rem);
/* 左右それぞれ 1rem 刁E��E��めE*/
margin-left: -2rem;
margin-right: -2rem;


/* 改行させなぁE��1行に表示�E�忁E��に応じて overflow を変更�E�E*/
white-space: nowrap;
overflow: hidden;
/* はみ出し�E隠す。スクロール可にしたければ auto に */
box-sizing: border-box;
padding: 0.8rem 1rem;
/* 高さの余裕�E維持E*/


}

/* タイトルとバッジは折返しさせなぁE*/
.thankyou-material .promo-panel .promo-title-wrap {
display: inline-flex;
justify-content: center;
gap: 0.5rem;
white-space: nowrap;
width: 100%;
}

/* 画像�ECTA は縮めずに横並びで維持E*/
.thankyou-material .promo-panel .thank-image,
.thankyou-material .promo-panel .thank-cta {
flex: 0 0 auto;
display: inline-block;
}
}

/* thankyou_material�E�Ethank-desc を肌色の枠でカード�EぁE��ぱぁE��匁E�E c02221 */
.thankyou-material .thank-desc {
background: #FFFBEF;
border: 0.06rem solid rgba(160, 200, 180, 0.12);
border-radius: 0.75rem;
box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.04);
padding: 0.9rem 1rem;
box-sizing: border-box;

/* カード�E冁E�Eから左右ぁE��ぱぁE��庁E��めE*/
width: calc(100% + 3.8rem);
margin: 0.6rem -0.9rem;
overflow: hidden;
}

/* 冁E��の desc-box は透過にして二重ボックス化を避ける */
.thankyou-material .thank-desc .desc-box {
background: transparent;
padding: 0;
margin: 0;
width: 100%;
box-sizing: border-box;
}

/* 見�Eし�E枠冁E��中央に表示 */
.thankyou-material .thank-desc .desc-title {
text-align: center;
margin: 0 0 0.5rem;
display: block;
}

/* モバイル調整�E�忁E��なら枠をさらに庁E��めE*/
@media (max-width:32.5rem) {
.thankyou-material .thank-desc {
width: calc(100% + 7rem);
margin-left: -3.5rem;
margin-right: -3.5rem;
padding: 0.8rem 0.9rem;
}
}


.thankyou-material .thank-desc .desc-title {
font-size: 1.125rem !important;
/* 18px に統一 */
line-height: 1.2 !important;
}


@media (min-width:48rem) {
.thankyou-material .thank-desc .desc-title {
font-size: 1.125rem !important;
}
}

@media (max-width:32.5rem) {
.thankyou-material .thank-desc .desc-title {
font-size: 1.125rem !important;
}
}

/* 「による」を小さく、E「無料相諁をオレンジに */
.thankyou-material .thank-desc .desc-title .desc-small {
font-size: 0.875rem;
/* 14px 相彁E*/
line-height: 1.2;
font-weight: 700;
margin-left: 0.15rem;
vertical-align: baseline;
display: inline-block;
}

.thankyou-material .thank-desc .desc-title .desc-highlight {
color: #FF6200 !important;
/* オレンジ */
font-weight: 800;
display: inline-block;
}

/* thankyou_material�E�Ethank-desc を肌色の枠でカード�EぁE��ぱぁE��匁E�E c02221 */


@media (min-width:48rem) {
.thankyou-material .thank-desc .desc-title {
transform: translateX(-0.6rem);

}
}


.thankyou-material .ribbon-label {
position: absolute;
left: 50%;
top: 50%;

transform: translate(-50%, -50%);
z-index: 8;
pointer-events: none;

font-family: "Noto Sans JP";
font-weight: 700;
font-size: 1rem;
/* 16px */
line-height: 1.5;
letter-spacing: 0;
/* 24px */
color: #ffffff;
text-align: center;
white-space: nowrap;
}


@media (max-width:32.5rem) {
.thankyou-material .ribbon-label {
font-size: 1rem;
top: 50%;
}
}


.thankyou-material .thank-desc .desc-title {

transform: none !important;

display: inline-flex;
/* 左右アイコンを横並びに */
align-items: center;
justify-content: center;
gap: 0.55rem;
/* アイコンとの間隔 */
width: 100%;
}

/* 左のメガホン */
.thankyou-material .thank-desc .desc-title::before {
content: "";
display: inline-block;
width: 2.4rem;
/* サイズは調整可 */
height: 2.4rem;
background: url("../images/megaphone_1x.webp") no-repeat center / contain;
flex: 0 0 auto;
}

/* 右�E�人物 */
.thankyou-material .thank-desc .desc-title::after {
content: "";
display: inline-block;
width: 2.9rem;
/* サイズは調整可 */
height: 2.9rem;
background: url("../images/proFP_2x.webp") no-repeat center / contain;
flex: 0 0 auto;
position: relative;
top: -2rem;
/* ↁE上げたい量、E0.15、E0.4rem で調整 */

}

/* モバイルは少し小さぁE*/
@media (max-width:32.5rem) {
.thankyou-material .thank-desc .desc-title {
gap: 0.45rem;
}

.thankyou-material .thank-desc .desc-title::before {
width: 2rem;
height: 2rem;
}

.thankyou-material .thank-desc .desc-title::after {
width: 2.3rem;
height: 2.3rem;
}
}

/* はみ出しを刁E��てぁE��犯人�E�thank-desc の overflow: hidden を解除 */
.thankyou-material .thank-desc {
overflow: visible !important;
white-space: normal;
}

/* 右の女性だけ確実に「枠からはみ出す」�E置にする */
.thankyou-material .thank-desc .desc-title {
position: relative;
/* ::after absolute の基溁E*/
padding-right: 3.2rem;
/* 斁E��と女性が被らなぁE��ぁE��右余白�E�調整可�E�E*/
}

.thankyou-material .thank-desc .desc-title::after {
position: absolute !important;
right: -0.2rem;
/* 右に少しはみ出す（調整可�E�E*/
top: -2rem;
/* 上に少しはみ出す（調整可�E�E*/
}

.thankyou-material .thank-desc .desc-title::before {
/* ...existing code... */
position: relative;
top: -0.5rem;
/* 上へ�E��Eイナス / 下へ�E��Eラス */
left: -0.1rem;
/* 左へ�E��Eイナス / 右へ�E��Eラス */
}

.thankyou-material .promo-panel {
width: min(100%, 18.4375rem);
margin: 0.6rem auto;
padding: 0.9rem 1rem;
background: #FFFBEF;
border-radius: 0.75rem;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.35rem;
box-sizing: border-box;
white-space: normal;
}

.thankyou-material .promo-panel .promo-subtext {
margin: 0;
margin-bottom: 0.5rem;
text-align: center;
font-weight: 700;
color: #40200B;
line-height: 1.45;
}

.thankyou-material .promo-panel .promo-subtext .promo-subtext-accent {
color: #FF6200;
}

.thankyou-material .promo-panel .promo-title-wrap {
display: flex;
align-items: center;
justify-content: center;
gap: 0.4rem;
flex-wrap: wrap;
text-align: center;
margin-top: 0.2rem;
}

.thankyou-material .promo-panel .promo-title-main {
display: block;
font-size: 1.25rem;
line-height: 1.05;
font-weight: 500;
color: #5a3b22;
letter-spacing: -0.02em;
}

.thankyou-material .promo-panel .promo-image {
width: 11.375rem;
max-width: 11.375rem;
height: 5.8125rem;
margin: -0.65rem auto 0.25rem;
object-fit: contain;
display: block;
filter: drop-shadow(0.0625rem 0.0625rem 0.25rem #D4D4D4);
}

.thankyou-material .thank-desc {
background: #FFFBEF;
padding: 0.5rem 1rem 0.55rem;
border-radius: 0.75rem;
width: min(100%, 18.4375rem);
max-width: 18.4375rem;
height: 8.0625rem;
min-height: 8.0625rem;
box-sizing: border-box;
text-align: center;
margin: 0.6rem auto 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
overflow: visible !important;
white-space: normal;
}

.thankyou-material .thank-desc .frame-desc-heading {
display: flex;
align-items: flex-end;
justify-content: center;
gap: 0.15rem;
width: 100%;
margin-bottom: 0.2rem;
}

.thankyou-material .thank-desc .frame-desc-heading-text {
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end;
transform: translateY(0.08rem);
}

.thankyou-material .thank-desc .frame-desc-figure {
width: 2.5rem;
height: auto;
flex: 0 0 auto;
margin-left: 0.3rem;
transform: translateY(0.12rem);
}

.thankyou-material .thank-desc .frame-desc-icon {
width: 1.65rem;
height: auto;
flex: 0 0 auto;
margin-left: 0;
transform: translate(-0.55rem, 0.12rem);
}

.thankyou-material .thank-desc .promo-advice {
margin: 0 auto;
}

.thankyou-material .thank-desc h4 {
font-size: 0.9375rem;
line-height: 1.1;
margin: 0 0 0.12rem 0;
color: #5a3b22;
font-weight: 700;
}

.thankyou-material .thank-desc .frame-desc-accent {
color: #FF6200;
}

.thankyou-material .thank-desc .desc-small {
font-size: 0.875rem;
line-height: 1.2;
font-weight: 700;
margin-left: 0.15rem;
vertical-align: baseline;
display: inline-block;
}

.thankyou-material .thank-desc .desc-highlight {
color: #FF6200 !important;
font-weight: 500;
display: inline-block;
}

.thankyou-material .thank-desc .promo-services {
font-weight: 700;
font-size: 0.78125rem;
color: #7D6F52;
line-height: 1.35;
margin: 0;
text-align: left;
letter-spacing: -0.02em;
width: 100%;
padding-left: 0;
margin-left: -0.85rem;
box-sizing: border-box;
}

.thankyou-material .thank-desc .promo-services-line {
display: block;
}

.thankyou-material .thank-desc .promo-services-line + .promo-services-line {
margin-top: 0.3rem;
}

.thankyou-material .thank-desc .promo-services-line--nowrap {
white-space: nowrap;
}

.thankyou-material .thank-desc .promo-services-line--offset {
  margin-left: 0;
}

.thankyou-material .thank-desc {
  height: auto !important;
  min-height: 0 !important;
  padding-bottom: 0.9rem !important;
}

.thankyou-material .thank-desc .promo-services {
  text-align: center;
  margin-left: 0;
}

.thankyou-material .thank-desc-coupon {
  display: block;
  width: 266px;
  height: 95.72px;
  max-width: 100%;
  margin: 0.7rem auto 0;
  object-fit: contain;
  flex: 0 0 auto;
}

/* frame-ribbon を横に大きく*/
.feature-promo .frame-ribbon {

width: min(calc(100% + 2rem), 34rem);
margin-left: 0;
/* translateX で中央に*/
left: 50%;
transform: translateX(-50%);
padding: 0.95rem 1.6rem;
/* 高さと左右 */
font-size: 1.15rem;
/* 斁E��を大きく */
top: -1.2rem;
/* カードから�Eみ出す量を調整 */
}

/* チE��クトップではさらに庁E��めE*/
@media (min-width:48rem) {
.feature-promo .frame-ribbon {
width: min(calc(100% + 4rem), 36rem);
padding: 1rem 1.8rem;
font-size: 1.25rem;
top: -1.4rem;
}
}

/* モバイルでは控えめに */
@media (max-width:32.5rem) {
.feature-promo .frame-ribbon {
width: calc(88% - 0.9rem);
padding: 0.6rem 1rem;
font-size: 0.95rem;
top: -1.6rem;
}
}

/* リボン画像上に斁E��を重�Eる（画像＋テキスト！E*/
.feature-promo .frame-ribbon {
position: absolute;
left: 50%;
transform: translateX(-50%);
width: min(calc(100% + 2rem), 36rem);
top: -1.2rem;
z-index: 6;
pointer-events: none;
display: block;
}

.feature-promo .frame-ribbon img {
display: block;
width: 100%;
height: auto;
}

.feature-promo .frame-ribbon .frame-ribbon-text {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
color: #ffffff;
font-weight: 800;
font-size: 1.05rem;
line-height: 1;
text-align: center;
white-space: nowrap;
padding: 0 .8rem;
z-index: 7;
pointer-events: none;
}

/* 調整�E�大画面・小画面 */
@media (min-width:48rem) {
.feature-promo .frame-ribbon {
top: -1.4rem;
}

.feature-promo .frame-ribbon .frame-ribbon-text {
font-size: 1.18rem;
}
}

@media (max-width:32.5rem) {
.feature-promo .frame-ribbon {
top: -2.6rem;
width: calc(88% - 1rem);
}

.feature-promo .frame-ribbon .frame-ribbon-text {
font-size: 0.8rem;
padding: 0 .6rem;
white-space: normal;
}
}

/* --- frame-ribbon: チE��ストを中央で安定させる上書ぁE--- */
.feature-promo .frame-ribbon{
position: absolute;
left: 50%;
top: -1.2rem;                    /* リボンの縦位置�E�調整可�E�E*/
transform: translateX(-50%);
width: min(96%, 36rem);          /* 横幁E�E上限を設宁E*/
padding: 0.95rem 1.2rem;
box-sizing: border-box;
z-index: 6;
pointer-events: none;
display: block;
min-height: 3.2rem;              /* チE��スト行を収める高さを確俁E*/
border-radius: 0;
}


.feature-promo .frame-ribbon img{
display: block;
width: 100%;
height: auto;
object-fit: cover;
border-radius: 0;
}

.feature-promo .frame-ribbon .frame-ribbon-text{
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
padding: 0 .8rem;
box-sizing: border-box;
max-width: 88%;
white-space: normal;             /* 自動折返しを許可 */
overflow-wrap: break-word;
word-break: keep-all;            /* 日本語�E不�E然な刁E��を抑制 */
line-height: 1.08;
pointer-events: none;
}

/* 行ごとの調整 */
.feature-promo .frame-ribbon .ribbon-line{
display: block;
margin: 0;
color: #ffffff;
font-weight: 800;
font-size: 0.98rem;
letter-spacing: 0.01em;
}

.feature-promo .frame-ribbon .ribbon-line--em{
font-size: 1.06rem;
margin-top: 0.06rem;
}

.feature-promo .frame-ribbon .ribbon-highlight{
color: #ffd24a;
font-weight: 900;
display: inline-block;
margin-right: 0.18rem;
}

/* モバイルでの収まり調整 */
@media (max-width:32.5rem){
.feature-promo .frame-ribbon{
top: -1.6rem;
padding: 0.6rem 0.9rem;
min-height: 2.8rem;
width: 92%;
}
.feature-promo .frame-ribbon .ribbon-line{ font-size: 0.88rem; }
.feature-promo .frame-ribbon .ribbon-line--em{ font-size: 0.98rem; }
.feature-promo .frame-ribbon .ribbon-highlight{ font-size: 1.25rem; font-weight: 700;}
}


.feature-promo .frame-ribbon .ribbon-line{
display: block;
white-space: nowrap;       /* 1行目は折り返さなぁE*/
overflow: visible;
text-overflow: ellipsis;
font-size: 0.875rem;
font-weight: bold;
line-height: 1;
margin: 0;
margin-bottom: 0.15rem;
}

/* 2行目は別行で中央に表示 */
.feature-promo .frame-ribbon .ribbon-line--em{
display: block;
white-space: normal;
font-size: 1rem;
font-weight: bold;
margin-top: 0.06rem;
}

/* 強調語�E見た目は維持E*/
.feature-promo .frame-ribbon .ribbon-highlight{
color: #FFEC1D;
font-weight: 700;
display: inline-block;
margin-left: 0.18rem; /* 左余白で読みめE��ぁE*/
}

.feature-promo .frame-ribbon .ribbon-highlight--dotted{
display: inline-flex;
gap: 0.02rem;
align-items: baseline;
}

.feature-promo .frame-ribbon .ribbon-highlight--dotted .ribbon-highlight-char{
position: relative;
display: inline-block;
}

.feature-promo .frame-ribbon .ribbon-highlight--dotted .ribbon-highlight-char--ni{
font-size: 0.875rem;
font-weight: 700;
line-height: 1;
margin-top: 0.08rem;
}

.feature-promo .frame-ribbon .ribbon-highlight--dotted .ribbon-highlight-char::before{
content: "";
position: absolute;
left: 50%;
top: -0.22rem;
transform: translateX(-50%);
width: 0.1875rem;
height: 0.1875rem;
border-radius: 50%;
background: #FFED25;
}

.feature-promo .frame-ribbon .ribbon-highlight--dotted .ribbon-highlight-char:last-child::before{
content: none;
}
@media (min-width:48rem) {
  .feature-promo .frame-ribbon .ribbon-line,
  .feature-promo .frame-ribbon .ribbon-line--em{
    font-size: 14px;
  }

  .feature-promo .frame-ribbon .ribbon-highlight{
    font-size: 20px;
    font-weight: 700;
  }

  .feature-promo .frame-ribbon .ribbon-highlight--dotted .ribbon-highlight-char--ni{
    font-size: 0.875rem;
    font-weight: 700;
    margin-top: 0.08rem;
  }

  .site-footer-wrapper {
    position: static;
    width: 100%;
    max-width: var(--lp-max-width);          /* page-shell の最大幁E��合わせる */
    margin-left: auto;
    margin-right: auto;
    background: transparent;
    padding: 0;
  }

  .site-footer {
    padding: 0.75rem 0;
    border-radius: 0.25rem;
  }

  body {
    padding-bottom: 0;
  }
}
.site-footer-wrapper {
  box-sizing: border-box;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}



@media (min-width: 48rem) {
  .site-footer-wrapper {
    width: var(--lp-max-width);       /* page-shell と同じ */
    max-width: 100%;
    margin: 0 auto;     /* 中央寁E�� */
    padding: 0;
    position: static;
    background: transparent;
  }

  .site-footer {
    width: 100%;        /* wrapperの幁E��っぱぁE*/
    border-radius: 0.25rem;
    padding: 0.75rem 0;
  }
}


 /*    コメントアウト */

/*きょぁE/


/* 
/* @media (min-width:48rem) {
    .site-footer-wrapper {
        position: fixed;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: var(--lp-max-width);  /* page-shellと同じ幁E*/
        /* 
        max-width: var(--lp-max-width);
        margin: 0 auto;
        padding: 0;
        background: #e77a4f;  /* 背景色を�E示 */
        /* 
        z-index: 60;
         margin-left: -0.5rem !important;  /* 左に1rem移動（調整可能�E�E*/
         /* 
    }

    .site-footer {
        background: transparent;  /* wrapperが背景を持つ */
        /* 
        padding: 0.75rem 0;
        border-radius: 0;  /* 角丸なぁE*/
        /* 
    }

    /* コンチE��チE��フッターに隠れなぁE��ぁE��余白を追加 */
    /* 
    body {
        padding-bottom: 4rem;  /* フッター高さ刁E��調整可能�E�E*/
        /* 
    }
} */
 /*    コメントアウト */
.site-footer-wrapper {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 60;
}
body {
  padding-bottom: 4.5rem;
}

/* footer が固宁E*/
.site-footer-wrapper {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: var(--lp-max-width);
  max-width: var(--lp-max-width);
  z-index: 60;
}



@media (min-width:48rem) {
  .site-footer-wrapper {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: var(--lp-max-width);
    max-width: 100%;
    z-index: 80;
    background: #e77a4f;
    border-top: 1px solid #faa270; /* 横線を「フチE��ー上端」で固宁E*/
  }

  .site-footer {
    margin: 0;
    border-radius: 0;
    padding: 0.75rem 0;
  }

  body {
    padding-bottom: 5rem; /* フッター刁E�Eスペ�Eス保つ */
  }
}

@media (min-width:32.5625rem) {
  .feature-promo {
    height: 24.5rem;
    margin: 1.6rem auto 1.1rem;
  }
}

.contact-step1 .feature-promo .frame-desc {
  text-align: center;
  padding: 0.7rem 1.1rem 1rem;
}

.contact-step1 .feature-promo {
  height: auto;
  min-height: 25.6rem;
  padding-bottom: 1.1rem;
}

.contact-step1 .feature-promo .promo-panel,
.contact-step1 .feature-promo .frame-desc {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.contact-step1 .feature-promo .frame-desc h4 {
  margin: 0 0 0.35rem;
  font-size: 1rem;
  font-weight: 900;
  color: #4c3a27;
  text-align: center;
}

.contact-step1 .feature-promo .frame-desc p {
  margin: 0;
  text-align: center;
  line-height: 1.45;
}

.contact-step1 .feature-promo .frame-desc .promo-services-line + .promo-services-line {
  margin-top: 0.18rem;
}

@media (min-width:48rem) {
  body:not(.contact-step1):not(.thankyou-material) .feature-promo .promo-panel,
  body:not(.contact-step1):not(.thankyou-material) .feature-promo .frame-plus,
  body:not(.contact-step1):not(.thankyou-material) .feature-promo .frame-desc {
    transform: translateY(-0.5rem);
  }

  .contact-step1 .feature-promo .promo-panel,
  .contact-step1 .feature-promo .frame-plus,
  .contact-step1 .feature-promo .frame-desc {
    transform: translateY(-1rem);
  }

  .contact-step1 .feature-promo .frame-desc .promo-services-line:last-child {
    white-space: nowrap;
  }
}

.contact-step1 .form-card {
  padding-top: 0.85rem;
  width: min(100%, 21.875rem);
  max-width: 21.875rem;
  min-height: 43.25rem;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  border-radius: 0;
}

.contact-step1 .form-card .label {
  display: flex;
  align-items: center;
  gap: 0;
  margin-bottom: 0.5rem;
  margin-left: 0.5rem;
  font-size: 1rem;
  font-weight: 700;
  color: #40200B;
}

.contact-step1 .form-card .required-badge,
.contact-step2 .form-card .required-badge,
.contact-step3 .form-card .badge--required {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.625rem;
  min-width: 2.625rem;
  height: 1.25rem;
  padding: 0;
  margin-left: 0.5rem;
  border-radius: 0.375rem;
  background: #FF6B0A;
  color: #FFFFFF;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
}

.contact-step1 .form-card .radio-group {
  gap: 2rem;
  align-items: center;
  flex-wrap: wrap;
  line-height: 0.75;
}

.contact-step1 .form-card .radio-label {
  padding-left: 1.7rem;
  font-size: 1rem;
  font-weight: 700;
  color: #40200B;
}

.contact-step1 .form-card .radio-label input,
.contact-step1 .form-card .radio-label .radio-custom {
  width: 1.125rem;
  height: 1.125rem;
}

.contact-step1 .form-card .radio-label .radio-custom {
  border: 0.0625rem solid #C8C8C8;
  background: #FFFFFF;
  box-sizing: border-box;
}

.contact-step1 .form-card .radio-label input:checked + .radio-custom {
  background: #FFFFFF;
  border-color: #C8C8C8;
  box-shadow: none;
}

.contact-step1 .form-card .radio-label input:checked + .radio-custom::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: #59B9E9;
  transform: translate(-50%, -50%);
}

.contact-step1 .form-card .input-box {
  font-size: 1rem;
  font-weight: 700;
  color: #40200B;
  letter-spacing: 0;
}

.contact-step1 .form-card select.input-box {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding-right: 2.5rem;
  background-color: #FFFFFF;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23000000' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 0.75rem auto;
}

.contact-step1 .form-card select.input-box::-ms-expand {
  display: none;
}

.contact-step1 .form-card .field-error {
  margin: 0.3rem 0 0;
  color: #F24848;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.4;
}

.contact-step1 .form-card .field-error[hidden] {
  display: none;
}

.contact-step1 .form-card .btn--gradient {
  width: 16.5rem;
  max-width: 16.5rem;
  min-height: 3.4375rem;
  height: 3.4375rem;
  flex: 0 0 16.5rem;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  transform: translateY(-0.25rem);
}

.contact-step1 .footer-note {
  text-align: center;
  width: min(100%, 15rem);
  margin: 3.2rem 0 1rem;
  font-size: 1rem;
  font-weight: 700;
  color: #40200B;
  line-height: 1.8;
  letter-spacing: 0;
  margin-left: auto;
  margin-right: auto;
}

.contact-step1 .form-card .footer-note {
  text-align: center;
  margin: 0 0 0.8rem;
  line-height: 1.6;
}

.contact-step2 .footer-note,
.contact-step3 .footer-note {
  text-align: center;
  margin: 0 auto 1rem;
  font-size: 1rem;
  font-weight: 700;
  color: #40200B;
  line-height: 1.8;
  letter-spacing: 0;
}

.contact-step2 .footer-note .footer-note-accent,
.contact-step3 .footer-note .footer-note-accent {
  color: #F24848;
}

.contact-step2 .form-card .field-error {
  margin: 0.3rem 0 0;
  color: #F24848;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.4;
}

.contact-step2 .form-card .field-error[hidden] {
  display: none;
}

.contact-step2 .form-card .btn--gradient {
  min-height: 55px;
}

.contact-step3 .form-card .field-error {
  margin: 0.3rem 0 0;
  color: #F24848;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.4;
}

.contact-step3 .form-card select.select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding-right: 2.5rem;
  background-color: #FFFFFF;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23000000' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 0.75rem auto;
}

.contact-step3 .form-card select.select::-ms-expand {
  display: none;
}

.contact-step3 .form-card .field-error[hidden] {
  display: none;
}

.contact-step3 .form-card .btn--gradient {
  padding-right: 3.5rem;
  min-height: 55px;
}

.contact-step3 .form-card .btn--gradient::after {
  right: 0.9rem;
  width: 1.125rem;
  height: 1.125rem;
}

.contact-step3 .form-card .btn--gradient .btn-arrow {
  right: 1.03rem;
  width: 0.8rem;
}

.contact-step3 .form-card .btn--gradient:disabled {
  opacity: 0.8;
  cursor: not-allowed;
}

.contact-step3 .form-card .btn--secondary {
  min-height: 55px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.index-page .index-mobile-header {
  display: none;
}

body.index-page .index-desktop-header {
  display: block;
}

@media (max-width:47.99rem) {
  body.index-page.mobile-inside .page-shell {
    position: relative;
  }

  body.index-page.mobile-inside .hero.fv-wrap {
    padding-top: 3.1rem !important;
  }

  body.index-page .index-mobile-header {
    display: block;
    position: absolute;
    top: 0.5rem;
    left: 0;
    right: 0;
    z-index: 20;
  }

  body.index-page .index-mobile-header .site-header-wrapper {
    margin-top: 0;
  }

  body.index-page .index-mobile-header .site-header {
    padding-top: 0 !important;
  }

  body.index-page .index-mobile-header .site-header .container {
    padding-top: 0 !important;
  }

  body.index-page .index-mobile-header .site-header .site-logo.site-logo--mobile {
    width: 159.04px !important;
    height: 28px !important;
    object-fit: contain;
  }

  body.index-page .index-mobile-header .site-header .site-tagline {
    font-size: 0.65rem !important;
  }

  body.index-page .index-desktop-header {
    display: none;
  }
}

.contact-step1 .form-card .hero-steps-image {
  width: 11.5625rem;
  max-width: 11.5625rem;
  height: 2.1875rem;
  margin: 2rem auto;
}

.contact-step2 .form-card .hero-steps-image,
.contact-step3 .form-card .hero-steps-image {
  margin: 0 auto 2rem;
}

.contact-step1 .form-card .step-indicator {
  margin: 0 0 1rem;
  padding: 0.8rem 0.9rem 1rem;
}

.contact-step1 .form-card .step {
  width: 1.9rem;
  height: 1.9rem;
  font-size: 0.9rem;
  background: #eef7fd;
  color: #67b5ea;
  border: 0.08rem solid #d7ebfb;
}

.contact-step1 .form-card .step--current {
  background: linear-gradient(180deg, #5dc3f6, #4f8ee8);
  color: #fff;
  border-color: transparent;
}

.contact-step1 .form-card .dots {
  color: #d0d0d0;
  font-size: 1.1rem;
  letter-spacing: 0.12em;
  line-height: 1;
  white-space: nowrap;
}

@media (max-width:32.5rem) {
  .contact-step1 .feature-promo {
    min-height: 24.8rem;
    padding-bottom: 1rem;
  }
}

@media (max-width:32.5rem) {
  .thankyou-material .promo-panel {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding: 0.7rem 0.8rem;
    white-space: normal;
    overflow: visible;
  }

  .thankyou-material .thank-desc {
    width: calc(100% + 2.2rem);
    margin: 0.6rem -1.1rem 0;
    padding: 0.85rem 1.05rem;
    overflow: visible;
  }

  .thankyou-material .thank-desc .desc-box {
    width: 100%;
    margin-left: 0;
    padding: 0;
  }

  .thankyou-material .thank-desc .desc-lines {
    text-align: center !important;
    padding-left: 0;
    line-height: 1.6;
    white-space: normal;
    word-break: break-word;
  }

  .thankyou-material .thank-desc .desc-title {
    padding-right: 2.6rem;
    justify-content: center;
    text-align: center;
    white-space: normal;
  }
}

@media (min-width:48rem) {
  .thankyou-material .thank-desc {
    width: 100%;
    margin: 0.6rem 0 0;
    padding: 0.9rem 1rem;
  }
}

@media (min-width:48rem) {
  .site-header-wrapper {
    position: relative;
    left: -0.9rem;
    margin-top: -1.25rem;
    z-index: 10;
  }

  .site-header .site-logo {
    width: 11.25rem;
  }

  .site-header .site-logo.site-logo--mobile {
    width: 164.04px !important;
    height: 31px !important;
  }

  .site-header {
    padding: 0.1rem 0.45rem 0.2rem 0.1rem;
    align-items: flex-start;
  }

  .site-header .container {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0.1rem;
    padding-right: 0.75rem;
  }
}

@media (max-width:23.5rem) {
  .thankyou-material .thank-desc {
    width: calc(100% + 1.2rem);
    margin: 0.6rem -0.6rem 0;
    padding: 0.8rem 0.9rem;
  }

  .thankyou-material .thank-desc .desc-title {
    font-size: 1rem !important;
    gap: 0.3rem;
    padding-right: 1.7rem;
    line-height: 1.15 !important;
  }

  .thankyou-material .thank-desc .desc-title .desc-small {
    font-size: 0.7em;
  }

  .thankyou-material .thank-desc .desc-title::before {
    width: 1.65rem;
    height: 1.65rem;
    top: -0.2rem;
    left: 0;
  }

  .thankyou-material .thank-desc .desc-title::after {
    width: 1.8rem;
    height: 1.8rem;
    right: -0.1rem;
    top: -1.15rem;
  }

  .thankyou-material .thank-desc .desc-lines {
    font-size: 0.92rem;
    line-height: 1.5;
  }
}

.result-fp-brief {
  margin: 3rem 0 0.6rem;
}

.result-fp-brief__title {
  padding-top: 0.7rem;
  padding-bottom: 0.3rem;
}

.result-fp-brief__small {
  font-size: 0.72em;
  font-weight: 700;
  margin-left: 0.08em;
}

.radio-label {
  padding-left: 1.6rem;
}

.radio-label input,
.radio-label .radio-custom {
  width: 1rem;
  height: 1rem;
}

.input-inline--date {
  align-items: center;
  gap: 0.35rem;
}

.input-inline--date .input-box {
  flex: 1 1 0;
  min-width: 0;
}

.input-inline--date .date-unit {
  color: #40200B;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

.phone-separator {
  width: 0.4rem;
  text-align: center;
  color: #40200B;
}

.policy-link {
  color: #40200B;
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

.thankyou-material .thank-hero h1 {
  margin-top: 1rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.8;
  letter-spacing: 0;
  color: #40200B;
}

@media (max-width:32.5rem) {
  .thankyou-material .thank-hero h1 {
    margin-top: 1.1rem;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.8;
    letter-spacing: 0;
    color: #40200B;
  }

  .hero-features .feature-list {
    gap: 0.7rem 0.6rem;
  }
}

.hero-features .feature-list {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.55rem 0.45rem;
  justify-items: center;
  align-items: center;
}

.hero-features .feature-list li {
  grid-column: span 2;
  margin: 0;
  text-align: center;
}

.hero-features .feature-list li:nth-child(4) {
  grid-column: 2 / span 2;
}

.hero-features .feature-list li:nth-child(5) {
  grid-column: 4 / span 2;
}

@media (min-width:48rem) {
  .hero-features .feature-list {
    gap: 0.7rem 0.55rem;
  }
}

.hero-features .feature-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 5.4rem;
  padding: 0.45rem 1.35rem;
  border-radius: 0.45rem;
  background: #fff;
  white-space: nowrap;
}

.hero-features .pill--green {
  border-color: currentColor;
}

.hero-features .pill--pink {
  border-color: currentColor;
}

.hero-features .pill--purple {
  border-color: currentColor;
}

.hero-features .pill--yellow {
  border-color: currentColor;
}

.hero-features .pill--blue {
  border-color: currentColor;
}

@media (min-width:48rem) {
  .hero-features .feature-pill {
    min-width: 6.4rem;
    padding: 0.5rem 1.5rem;
  }
}

@media (max-width:32.5rem) {
  .hero-features .feature-pill {
    min-width: 0;
    padding: 0.4rem 0.9rem;
    font-size: 0.76rem;
  }
}

.feature-promo {
  margin-top: 2.6rem;
}

.feature-promo .frame-ribbon {
  top: -2.6rem;
}

.result-type__figure {
  height: 6.6rem;
}

@media (min-width:48rem) {
  .result-type__figure {
    height: 10.4rem;
  }

  .result-type__figure--left,
  .result-type__figure--right {
    bottom: -1.65rem;
  }
}

@media (max-width:32.5rem) {
  .result-type__figure {
    height: 8.8rem;
  }
}



/* 全ペ�Eジ共通�Eレスポンシブ背景�E�モバイル�E�back.png / PC�E�PCbackground_1x.webp�E�E*/
html, body {
  min-height: 100%;
}

body {
  /* モバイル既宁E*/
  background-image: url("../images/back.png");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  background-color: #FFFBEF; /* フォールバック色 */
  background-attachment: scroll;
}

/* 幁E��庁E��場合�E PC 背景へ刁E�� */
@media (min-width: 768px) {
  body {
    background-image: url("../images/PCbackground_1x.webp");
    background-position: center;
    background-size: cover;
    background-attachment: fixed; /* 忁E��なめEfixed に */
  }
}



/* step-indicator の色めE#4DACD5 に統一 */
.step-indicator .step--current{
  background: #4DACD5;
  color: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,0.06);
  transform: translateY(-0.06rem);
}
.step-indicator .dots{
  color: #4DACD5;
  font-weight: 700;
  letter-spacing: 0.06em;
}



/* CVA ボタンの周囲の枠を消す・中央寁E�� */
.cva-wrap{
  display:flex;
  justify-content:center;
  align-items:center;
  margin-top:1rem;
  background: transparent;
  box-shadow: none;
  border: none;
}

body.result-page.mobile-inside .cva-wrap {
  position: static;
  left: auto;
  bottom: auto;
  transform: none;
  width: 284px;
  z-index: auto;
  margin: 1.5rem auto 0 !important;
  padding: 0;
  pointer-events: auto;
}

body.result-page.mobile-inside .cva-wrap--inline {
  margin-top: 2.9rem !important;
  margin-bottom: 5rem !important;
  transform: none;
}

body.result-page.mobile-inside .cva-wrap--sticky {
  position: fixed;
  left: calc(50% - 142px);
  bottom: 2.9rem;
  z-index: 120;
  margin: 0 !important;
  pointer-events: none;
}

body.result-page.mobile-inside .cva-wrap--sticky form {
  pointer-events: auto;
}

body.result-page.mobile-inside .cva-wrap form {
  display: block;
  width: 100%;
  pointer-events: auto;
}

body.result-page.mobile-inside .cva-button {
  display: block;
  width: 100%;
}

body.result-page.mobile-inside .cva-button img {
  width: 284px;
  max-width: 284px;
  aspect-ratio: 284 / 107;
  height: auto;
}

/* footer は追従させずペ�Eジ末尾に配置 */
.site-footer-wrapper {
  position: static !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 1rem 0 0 !important;
  z-index: auto !important;
  background: transparent !important;
  border-top: none !important;
}

body {
  padding-bottom: 0 !important;
}

/* result の CTA は初期表示から画面下に追征E*/
body.result-page {
  padding-bottom: 0 !important;
}

body.result-page .cva-wrap {
  position: static;
  left: auto;
  bottom: auto;
  transform: none;
  width: 284px;
  z-index: auto;
  margin: 1.5rem auto 0 !important;
  padding: 0;
  pointer-events: auto;
}

body.result-page .cva-wrap--inline {
  margin-top: 2.9rem !important;
  margin-bottom: 5rem !important;
  transform: none;
}

body.result-page .cva-wrap--sticky {
  position: fixed;
  left: calc(50% - 142px);
  bottom: 2.9rem;
  z-index: 120;
  margin: 0 !important;
  pointer-events: none;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}

body.result-page .cva-wrap--sticky form {
  pointer-events: auto;
}

body.result-page .cva-wrap--sticky.is-hidden,
body.result-page.mobile-inside .cva-wrap--sticky.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

body.result-page .cva-wrap form {
  display: block;
  width: 100%;
  pointer-events: auto;
}

body.result-page .cva-button {
  display: block;
  width: 100%;
}

body.result-page .cva-button img {
  width: 284px;
  max-width: 284px;
  aspect-ratio: 284 / 107;
  height: auto;
}

body.result-page .cva-button--text,
body.result-page.mobile-inside .cva-button--text {
  position: relative;
  display: block;
  width: 284px;
  min-height: 82px;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  color: #ffffff;
  overflow: visible;
  text-align: center;
  isolation: isolate;
}

body.result-page .cva-button--text::before,
body.result-page.mobile-inside .cva-button--text::before {
  content: none;
}

body.result-page .cva-button--text::after,
body.result-page.mobile-inside .cva-button--text::after {
  content: none;
}

body.result-page .cva-button__pill,
body.result-page.mobile-inside .cva-button__pill {
  position: absolute;
  left: 50%;
  top: -1.3rem;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 13.8rem;
  height: 2.05rem;
  padding: 0 1.1rem;
  border-radius: 999px;
  background: #ffffff;
  box-shadow: 0 0.25rem 0.5rem rgba(64, 32, 11, 0.12);
  color: #f24848;
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  white-space: nowrap;
  z-index: 3;
  text-align: center;
}

body.result-page .cva-button__pill::after,
body.result-page.mobile-inside .cva-button__pill::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.42rem;
  width: 0.9rem;
  height: 0.7rem;
  background: #ffffff;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  transform: translateX(-50%);
}

body.result-page .cva-button__main,
body.result-page.mobile-inside .cva-button__main {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 82px;
  padding: 1.1rem 1.4rem 0.95rem;
  border-radius: 2.95rem;
  background: linear-gradient(90deg, #26F03E 0%, #41D9E4 100%);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
  overflow: hidden;
  gap: 0.1rem;
  text-align: center;
}

body.result-page .cva-wrap--inline .cva-button--text,
body.result-page.mobile-inside .cva-wrap--inline .cva-button--text {
  margin-left: auto;
  margin-right: auto;
}

body.result-page .cva-wrap--inline form,
body.result-page.mobile-inside .cva-wrap--inline form {
  display: flex;
  justify-content: center;
}

body.result-page .cva-button__main::before,
body.result-page.mobile-inside .cva-button__main::before {
  content: "";
  position: absolute;
  top: -18%;
  left: -28%;
  width: 3.8rem;
  height: 140%;
  background: linear-gradient(115deg, rgba(255, 255, 255, 0) 12%, rgba(255, 255, 255, 0.08) 28%, rgba(255, 255, 255, 0.3) 40%, rgba(255, 255, 255, 0.9) 50%, rgba(255, 255, 255, 0.34) 60%, rgba(255, 255, 255, 0.1) 72%, rgba(255, 255, 255, 0) 88%);
  transform: skewX(-22deg);
  filter: blur(0.6px);
  opacity: 0.88;
  z-index: 1;
  pointer-events: none;
  animation: cva-button-shine 3.8s linear infinite;
}

@keyframes cva-button-shine {
  0% {
    left: -30%;
    opacity: 0;
  }

  4% {
    left: -18%;
    opacity: 0.92;
  }

  20% {
    left: 118%;
    opacity: 0.92;
  }

  21% {
    left: 118%;
    opacity: 0;
  }

  100% {
    left: 118%;
    opacity: 0;
  }
}

body.result-page .cva-button__sub,
body.result-page.mobile-inside .cva-button__sub {
  display: block;
  position: relative;
  z-index: 2;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0;
}

body.result-page .cva-button__label,
body.result-page.mobile-inside .cva-button__label {
  display: block;
  position: relative;
  z-index: 2;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: 0;
}

body.result-page .cva-wrap--sticky,
body.result-page.mobile-inside .cva-wrap--sticky {
  left: 50%;
  bottom: 0;
  width: min(100%, var(--lp-max-width));
  transform: translateX(-50%);
  padding: 0;
  box-sizing: border-box;
}

body.result-page .cva-wrap--sticky .cva-sticky-shell,
body.result-page.mobile-inside .cva-wrap--sticky .cva-sticky-shell {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 0;
  width: 100%;
  min-height: 5.9375rem;
  padding: 0 0.625rem 0.25rem;
  background: #FFFBEF;
  box-sizing: border-box;
  pointer-events: none;
}

body.result-page .cva-wrap--sticky form,
body.result-page.mobile-inside .cva-wrap--sticky form {
  width: 15.625rem;
  pointer-events: auto;
}

body.result-page .cva-wrap--sticky .cva-sticky-image,
body.result-page.mobile-inside .cva-wrap--sticky .cva-sticky-image {
  display: block;
  height: auto;
  pointer-events: none;
  flex: 0 0 auto;
}

body.result-page .cva-wrap--sticky .cva-sticky-image--left,
body.result-page.mobile-inside .cva-wrap--sticky .cva-sticky-image--left {
  width: 2.9375rem;
  height: 3.5606rem;
  margin: 0 0.375rem 0.1875rem 0;
}

body.result-page .cva-wrap--sticky .cva-sticky-image--right,
body.result-page.mobile-inside .cva-wrap--sticky .cva-sticky-image--right {
  width: 3.3325rem;
  height: 3.69rem;
  margin: 0 0 0.0625rem 0.375rem;
}

body.result-page .cva-wrap--sticky .cva-button--text,
body.result-page.mobile-inside .cva-wrap--sticky .cva-button--text {
  width: 15.625rem;
  min-height: 3.9375rem;
}

body.result-page .cva-wrap--sticky .cva-button__pill,
body.result-page.mobile-inside .cva-wrap--sticky .cva-button__pill {
  min-width: 13.6875rem;
  width: 13.6875rem;
  height: 1.875rem;
  top: -0.35rem;
  padding: 0 0.7rem;
  font-size: 0.8125rem;
}

body.result-page .cva-wrap--sticky .cva-button__main,
body.result-page.mobile-inside .cva-wrap--sticky .cva-button__main {
  width: 15.625rem;
  min-height: 4.0625rem;
  margin-top: 0.95rem;
  padding: 0.95rem 1rem 0.7rem;
  border-radius: 2.4rem;
}

body.result-page .cva-wrap--sticky .cva-button__sub,
body.result-page.mobile-inside .cva-wrap--sticky .cva-button__sub {
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0;
}

body.result-page .cva-wrap--sticky .cva-button__label,
body.result-page.mobile-inside .cva-wrap--sticky .cva-button__label {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0;
}

@media (max-width:47.999rem) {
  body.result-page.mobile-inside .cva-wrap--inline {
    width: 100%;
  }

  body.result-page.mobile-inside .cva-wrap--inline .cva-button--text {
    width: 17.75rem;
  }

  body.result-page.mobile-inside .cva-wrap--sticky {
    width: 100%;
    max-width: none;
  }

  body.result-page.mobile-inside .cva-wrap--sticky form {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }

  body.result-page.mobile-inside .cva-wrap--sticky .cva-button--text,
  body.result-page.mobile-inside .cva-wrap--sticky .cva-button__main {
    width: 100%;
  }

  body.result-page.mobile-inside .cva-wrap--sticky .cva-sticky-shell {
    min-height: 6.4375rem;
  }
}

@media (min-width:48rem) {
  body.mobile-inside .container {
    padding: 1rem;
  }

  body.mobile-inside .site-header-wrapper {
    position: static;
    left: auto;
    width: 100%;
    margin-top: -1rem;
    margin-left: 0;
    margin-right: 0;
    z-index: 10;
  }

  body.mobile-inside .site-header {
    padding: 0.15rem 0.6rem;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.5rem;
  }

  body.mobile-inside .site-header .site-logo {
    height: 2.25rem;
    width: auto;
    margin-top: 0;
  }

  body.mobile-inside .site-header .site-logo.site-logo--mobile {
    width: 164.04px !important;
    height: 31px !important;
    object-fit: contain;
  }

  body.mobile-inside .site-header .site-title {
    font-size: 1.05rem;
    line-height: 1;
  }

  body.mobile-inside .site-header .container {
    padding-top: 0.15rem;
    padding-bottom: 0.15rem;
    padding-left: 0;
    padding-right: 0;
  }

  body.mobile-inside .hero .steps-inline.hero-steps .step-dot,
  body.mobile-inside .hero-steps .step-dot {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 0.8rem;
  }

  body.mobile-inside .hero .steps-inline.hero-steps .sep,
  body.mobile-inside .hero-steps .sep {
    font-size: 1rem;
    margin: 0 0.25rem;
  }

  body.mobile-inside .fv-figure {
    bottom: -6.7rem;
  }

  body.mobile-inside .feature-promo {
    width: 20.5625rem;
    height: 22.5625rem;
    margin: 2.6rem auto 0.6rem;
  }

  body.mobile-inside .feature-promo .promo-image {
    width: 13.4rem;
  }

  body.mobile-inside .feature-promo .frame-desc h4 {
    font-size: 0.95rem;
  }

  body.mobile-inside .feature-promo .frame-desc p {
    font-size: 0.82rem;
  }

  body.mobile-inside .feature-promo .frame-ribbon {
    top: -1.6rem;
    width: 92%;
    padding: 0.6rem 0.9rem;
    min-height: 2.8rem;
  }

  body.mobile-inside .feature-promo .frame-ribbon .ribbon-line {
    font-size: 0.88rem;
  }



  body.mobile-inside .hero-features .feature-list {
    gap: 0.7rem 0.6rem;
  }

  body.mobile-inside .hero-features .feature-pill {
    min-width: 0;
    padding: 0.4rem 0.9rem;
    font-size: 0.76rem;
  }

  body.mobile-inside .contact-container {
    padding: 1rem;
  }

  body.mobile-inside.contact-step1 .feature-promo {
    min-height: 24.8rem;
    padding-bottom: 1rem;
  }

  body.mobile-inside .thank-hero {
    margin-bottom: 2.9rem;
  }

  body.mobile-inside .thank-hero h1 {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.8;
    letter-spacing: 0;
    color: #40200B;
  }

  body.mobile-inside.thankyou-material .thank-desc {
    width: calc(100% + 2.2rem);
    margin: 0.6rem -1.1rem 0;
    padding: 0.85rem 1.05rem;
  }

  body.mobile-inside.thankyou-material .thank-desc .desc-box {
    width: 100%;
    margin-left: 0;
    padding: 0;
  }

  body.mobile-inside.thankyou-material .thank-desc .desc-lines {
    text-align: center !important;
    padding-left: 0;
    line-height: 1.6;
    white-space: normal;
    word-break: break-word;
  }

  body.mobile-inside.thankyou-material .thank-desc .desc-title {
    padding-right: 2.6rem;
    justify-content: center;
    text-align: center;
    white-space: normal;
    transform: none !important;
  }

  body.mobile-inside .result-title-frame {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.1em !important;
    padding: 0.5rem 0.9rem !important;
    border: 0.12rem dotted rgba(90, 60, 40, 0.18) !important;
  }

  body.mobile-inside .result-type-sub {
    font-size: 0.9rem;
    margin-bottom: 2.5rem;
  }

  body.mobile-inside .result-type-sub .result-type-sub-main {
    font-size: 1.125rem;
  }

  body.mobile-inside .result-type-sub .result-type-sub-tail {
    font-size: 0.875rem;
  }

  body.mobile-inside .result-type__row {
    padding-top: 0.35rem;
  }

  body.mobile-inside .result-type__figure {
    height: 8.8rem;
  }

  body.mobile-inside .result-type__figure--left {
    transform: translateX(calc(-50% - 9.2rem));
    bottom: -1.95rem;
  }

  body.mobile-inside .result-type__figure--right {
    transform: translateX(calc(-50% + 9.2rem));
    bottom: -1.95rem;
  }

  body.mobile-inside .result-intro-frame {
    padding: 0.85rem 0.9rem;
    max-width: 20.5rem;
  }

  body.mobile-inside .result-intro-frame .result-intro {
    font-size: 1rem;
  }

  body.mobile-inside .result-fp-brief__title {
    font-size: 1.05rem;
    padding: 0.4rem 0.8rem;
  }

  body.mobile-inside .cva-wrap {
    margin: 0.8rem 0;
  }

  body.mobile-inside .cva-button img {
    width: 16.5rem;
    max-width: 16.5rem;
  }
}

/* form の余計な背景めE��を消す */
.cva-wrap form{
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  box-shadow: none;
  display: inline-block;
}

/* ボタン本体�E枠・フォーカス影を無効匁E*/
.cva-button{
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  box-shadow: none;
  outline: none;
}

/* フォーカス時も枠を�EさなぁE*/
.cva-button:focus,
.cva-button:active{
  outline: none;
  box-shadow: none;
}

/* 画像表示して親の余白に合わせる */
.cva-button img{
  display: block;
  width: 100%;
  max-width: 28rem; /* 忁E��に応じ調整 */
  height: auto;
  border-radius: 0.8rem; /* 角丸が忁E��なめE*/
  background: transparent;
  box-shadow: none;
  border: none;
}

/* フッター */
.site-footer-wrapper {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: calc(100% + 2rem) !important; /* もしくは 100% */
  max-width: none !important;
  margin: 1rem -1rem 0 !important;
}

.site-footer {
  width: 100%;
  margin: 0;
  border-radius: 0 !important;
  padding: 0.75rem 1rem;
}

body {
  padding-bottom: 4.75rem !important;
}

body.result-page {
  padding-bottom: 12rem !important;
}

body.result-page {
  padding-bottom: 4.75rem !important;
}

body.result-page .page-shell {
  padding-bottom: 12rem !important;
}


body.result-page {
  padding-bottom: 0 !important;
}

body.result-page .page-shell {
  padding-bottom: 11.75rem !important;
}


body.mobile-inside {
  padding-bottom: 0 !important;
}

body.mobile-inside .page-shell {
  padding-bottom: 4.75rem !important;
}

body.result-page.mobile-inside .page-shell {
  padding-bottom: 11.75rem !important;
}


body.mobile-inside .page-shell {
  width: min(100%, var(--lp-max-width)) !important;
  margin: 0 auto !important;
  min-height: 100vh;
  box-sizing: border-box;
}

body.mobile-inside .container {
  width: 100% !important;
  max-width: none !important;
  padding: 1rem !important;
}


/* FINAL FOOTER: fixed + page-shell width */
.site-footer-wrapper {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  bottom: 0 !important;
  transform: translateX(-50%) !important;
  width: min(100%, var(--lp-max-width)) !important;
  max-width: var(--lp-max-width) !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 110 !important;
  background: #e77a4f !important;
  border-top: 1px solid #faa270 !important;
}

.site-footer {
  width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
  padding: 0.75rem 1rem !important;
}

body {
  padding-bottom: 4.75rem !important;
}

body.result-page {
  padding-bottom: 12rem !important;
}


/* FINAL FOOTER OVERRIDE: */
.site-footer-wrapper {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  width: calc(100% + 2rem) !important;
  max-width: none !important;
  margin: 1rem -1rem 0 !important;
  padding: 0 !important;
  z-index: auto !important;
  background: #e77a4f !important;
  border-top: 1px solid #faa270 !important;
}

.site-footer {
  width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
  padding: 0.75rem 1rem !important;
}

body {
  padding-bottom: 0 !important;
}

body.result-page {
  padding-bottom: 0 !important;
}


/* FINAL LAYOUT: footer �� page-shell */
body.mobile-inside .page-shell > .container {
  min-height: inherit;
  display: flex;
  flex-direction: column;
}

body.mobile-inside .page-shell > .container > .site-footer-wrapper {
  margin-top: auto !important;
}


/* FINAL POSITION FIX: footer �� page-shell  */
body.mobile-inside .page-shell > .container {
  min-height: 1vh !important;
  display: flex !important;
  flex-direction: column !important;
}

body.mobile-inside .page-shell > .container > main,
body.mobile-inside .page-shell > .container > section,
body.mobile-inside .page-shell > .container > .question-card {
  flex: 0 0 auto;
}

body.mobile-inside .page-shell > .container > .site-footer-wrapper {
  margin-top: auto !important;
}


/* FINAL ORDER FIX: footer �� container  */
body.mobile-inside .page-shell > .container > .site-footer-wrapper {
  order: 99 !important;
  margin-top: auto !important;
}


/* FINAL SCOPE: footer �� mobile-inside  */
body.mobile-inside .site-footer-wrapper {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  width: calc(100% + 2rem) !important;
  max-width: none !important;
  margin: 1rem -1rem 0 !important;
  padding: 0 !important;
  z-index: auto !important;
  background: #e77a4f !important;
  border-top: 1px solid #faa270 !important;
}

body.thankyou-material.mobile-inside .page-shell > .container {
  min-height: auto !important;
}

body.thankyou-material.mobile-inside .page-shell > .container > .site-footer-wrapper {
  margin-top: 0 !important;
}

body.thankyou-material.mobile-inside .site-footer-wrapper {
  margin: 0 -1rem 0 !important;
}

body.mobile-inside .site-footer {
  width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
  padding: 0.75rem 1rem !important;
}


/* FINAL PILL SIZE: NISA */
.hero-features .pill--green {
  width: 5.2819rem !important;
  min-width: 5.2819rem !important;
  height: 1.7425rem !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0.0544rem solid #7ACEA4 !important;
  border-radius: 0.25rem !important;
  background: #ffffff !important;
  color: #7ACEA4 !important;
  box-shadow: none !important;
  line-height: 1 !important;
}


/* FINAL PILL TUNE: NISA */
.hero-features .pill--green {
  width: 5.2819rem !important;
  min-width: 5.2819rem !important;
  max-width: 5.2819rem !important;
  height: 1.7425rem !important;
  min-height: 1.7425rem !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  border: 0.0544rem solid #7ACEA4 !important;
  border-radius: 0.285rem !important;
  background: #FFFFFF !important;
  color: #7ACEA4 !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
}
/* FINAL PILL SET: */
.hero-features .feature-pill {
  height: 1.7425rem !important;
  min-height: 1.7425rem !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  border-style: solid !important;
  border-width: 0.0544rem !important;
  border-radius: 0.285rem !important;
  background: #FFFFFF !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}

.hero-features .pill--green {
  width: 5.2819rem !important;
  min-width: 5.2819rem !important;
  max-width: 5.2819rem !important;
  border-color: #7ACEA4 !important;
  color: #7ACEA4 !important;
}

.hero-features .pill--pink {
  width: 7.2419rem !important;
  min-width: 7.2419rem !important;
  max-width: 7.2419rem !important;
  border-color: #F398BC !important;
  color: #F398BC !important;
}

.hero-features .pill--purple {
  width: 6.1531rem !important;
  min-width: 6.1531rem !important;
  max-width: 6.1531rem !important;
  border-color: #A998F3 !important;
  color: #A998F3 !important;
}

.hero-features .pill--yellow {
  width: 7.2419rem !important;
  min-width: 7.2419rem !important;
  max-width: 7.2419rem !important;
  border-color: #F2C163 !important;
  color: #F2C163 !important;
}

.hero-features .pill--blue {
  width: 6.1531rem !important;
  min-width: 6.1531rem !important;
  max-width: 6.1531rem !important;
  border-color: #98B8F3 !important;
  color: #98B8F3 !important;
}
/* FINAL RIBBON SIZE: */
.feature-promo .frame-ribbon {
  width: min(68.7179vw, 16.75rem) !important;
  min-width: min(68.7179vw, 16.75rem) !important;
  max-width: 16.75rem !important;
  height: 3.8125rem !important;
  min-height: 3.8125rem !important;
  padding: 0 !important;
  top: -2rem !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  box-sizing: border-box !important;
  border-radius: 0 !important;
}

.feature-promo .frame-ribbon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
  display: block !important;
  border-radius: 0 !important;
}

.feature-promo .frame-ribbon .frame-ribbon-text {
  width: 100% !important;
  padding: 0 1rem !important;
  box-sizing: border-box !important;
}
.feature-promo .promo-panel {
  width: 18.4375rem !important;
  max-width: 18.4375rem !important;
  min-height: 12.0125rem !important;
  height: 12.0125rem !important;
  padding: 0.6rem 1rem 0.2rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}
/* FINAL FEATURE PROMO SIZE:  */
.feature-promo {
  width: min(100%, 20.5625rem) !important;
  max-width: 20.5625rem !important;
  height: auto !important;
  min-height: 393px !important;
   border: 0.1875rem solid #AE8F52 !important;
  box-sizing: border-box !important;
}.frame-plus {
  width: 1rem !important;
  height: 1rem !important;
  margin: 0.2rem auto 0.3rem !important;
  color: #AE8F52 !important;
  font-size: 1rem !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}.frame-plus {
  font-size: 2rem !important;
  font-weight: 700 !important;
}body.result-page .feature-promo .frame-plus {
  margin: 0.35rem auto 0.45rem !important;
  transform: translateY(0.18rem) !important;
}body.result-page .feature-promo .frame-desc {
  margin-top: 0.12rem !important;
  transform: translateY(0.18rem) !important;
}.feature-promo .promo-badge {
  display: none !important;
}

.feature-promo .promo-title-main {
  width: 12rem !important;
  min-width: 12rem !important;
  max-width: 12rem !important;
  min-height: 1.875rem !important;
  height: 1.875rem !important;
  padding: 0 !important;
  font-size: 0.75rem !important;
  line-height: 1 !important;
}.feature-promo .promo-title-main {
  width: 12rem !important;
  min-width: 12rem !important;
  max-width: 12rem !important;
  height: 1.875rem !important;
  min-height: 1.875rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  background: #AE8F52 !important;
  color: #FFFFFF !important;
  font-size: 0.75rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}.feature-promo .promo-title-main {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  transform: translateY(-0.5rem) !important;
}.feature-promo .promo-title-wrap {
  margin-bottom: -0.8rem !important;
}.hero-features .feature-pill {
  font-size: 0.8713rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.1em !important;
  line-height: 1 !important;
}.hero-features .feature-list li:nth-child(2),
.hero-features .feature-list li:nth-child(3) {
  position: relative !important;
  left: -0.18rem !important;
}.feature-promo .promo-image {
  width: 11.375rem !important;
  max-width: 11.375rem !important;
  height: 5.8125rem !important;
  margin: 0.3rem auto 0 !important;
  object-fit: contain !important;
}.feature-promo .promo-image-link {
  display: block !important;
  text-decoration: none !important;
  color: inherit !important;
}




.feature-promo .frame-desc {
  height: auto !important;
  min-height: 0 !important;
  padding-bottom: 0.9rem !important;
}

.feature-promo .frame-desc .promo-services {
  font-weight: 700;
  color: #7D6F52;
  margin: 0;
  font-size: 0.75rem;
  line-height: 1.5;
  text-align: center;
  letter-spacing: -0.02em;
  width: 100%;
  padding-left: 0;
  margin-left: 0;
  box-sizing: border-box;
}

.feature-promo .frame-desc .promo-services-line {
  display: block;
}

.feature-promo .frame-desc .promo-services-line + .promo-services-line {
  margin-top: 0.3rem;
}

.feature-promo .frame-desc .promo-services-line--nowrap {
  white-space: nowrap;
}

.feature-promo .frame-desc .promo-services-line--offset {
  margin-left: 0;
}

.feature-promo .frame-desc .frame-desc-coupon {
  display: block;
  width: 266px;
  height: 95.72px;
  max-width: 100%;
  margin: 0.7rem auto 0;
  object-fit: contain;
  flex: 0 0 auto;
}

.result-page .feature-promo .frame-desc form {
  width: 100%;
}

.result-page .feature-promo .frame-desc .promo-image-link {
  display: flex !important;
  justify-content: center;
  width: 100%;
}

.result-page .feature-promo .frame-desc .frame-desc-coupon {
  width: min(100%, 266px);
  height: auto;
  aspect-ratio: 266 / 95.72;
}

.contact-step1 .feature-promo .frame-ribbon--contact {
  width: 16.75rem !important;
  min-width: 16.75rem !important;
  max-width: 16.75rem !important;
  height: 2.8125rem !important;
  min-height: 2.8125rem !important;
}

.contact-step1 .feature-promo .frame-ribbon--contact .frame-ribbon-text--contact {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  padding: 0 1rem !important;
  box-sizing: border-box !important;
}

.contact-step1 .feature-promo .frame-ribbon--contact .contact-ribbon-copy {
  color: #FFFFFF;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0;
  white-space: nowrap;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 0.02rem;
}

.contact-step1 .feature-promo .frame-ribbon--contact .contact-ribbon-dotted {
  display: inline-flex;
  align-items: flex-end;
  gap: 0.02rem;
}

.contact-step1 .feature-promo .frame-ribbon--contact .contact-ribbon-char {
  position: relative;
  display: inline-block;
}

.contact-step1 .feature-promo .frame-ribbon--contact .contact-ribbon-char::before {
  content: "・";
  position: absolute;
  top: -0.22rem;
  left: 50%;
  transform: translateX(-50%);
  color: #FFFFFF;
  font-size: 0.55rem;
  line-height: 1;
}

.result-page .feature-promo .frame-ribbon--result {
  width: min(68.7179vw, 16.75rem) !important;
  min-width: min(68.7179vw, 16.75rem) !important;
  max-width: 16.75rem !important;
  height: 3rem !important;
  min-height: 3rem !important;
  top: -2rem !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  overflow: visible !important;
}

.result-page .feature-promo .frame-ribbon--result > img:first-child {
  width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
  display: block !important;
}

.result-page .feature-promo .frame-ribbon--result .result-ribbon-deco {
  position: absolute;
  top: 0.6rem;
  width: auto !important;
  height: 1.8rem !important;
  z-index: 3;
}

.result-page .feature-promo .frame-ribbon--result .result-ribbon-deco--left {
  left: 2rem;
}

.result-page .feature-promo .frame-ribbon--result .result-ribbon-deco--right {
  right: 2rem;
}

.result-page .feature-promo .frame-ribbon--result .result-ribbon-text {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.08rem;
  margin-top: 0.15rem;
  width: auto !important;
  padding: 0 !important;
  z-index: 4;
  white-space: nowrap;
}

.result-page .feature-promo .frame-desc .frame-desc-heading {
  align-items: end;
  align-items: flex-end;
}

@media (min-width:48rem) {
  body.result-page .feature-promo {
    height: auto !important;
    min-height: 26.0625rem !important;
  }
}

.result-page .feature-promo .frame-ribbon--result .result-ribbon-copy {
  color: #FFFFFF;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.5rem;
  letter-spacing: 0;
}

.result-page .feature-promo .frame-ribbon--result .result-ribbon-free {
  margin-top: -0.4rem;
  color: #FFED25;
  font-size: 1.5rem;
  font-weight: 900;
  line-height: 1.5rem;
  letter-spacing: 0;
}

body.mobile-inside .hero.fv-wrap .feature-promo {
  margin-top: 2.6rem !important;
}

body.index-page .feature-promo {
  margin-top: 1.6rem !important;
}

body.step2-page .hero,
body.step2-page #form-step2 {
  position: relative;
  top: -2rem;
}

body.step3-page .hero,
body.step3-page #form-step3 {
  position: relative;
  top: -2rem;
}

.result-title-frame,
body.mobile-inside .result-title-frame {
  border: 0.16rem dotted rgba(90, 60, 40, 0.32) !important;
  color: #40200B !important;
}

/* FINAL FOOTER FLOW FIX */
.site-footer-wrapper,
body.mobile-inside .site-footer-wrapper {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  width: calc(100% + 2rem) !important;
  max-width: none !important;
  margin: 0 -1rem 0 !important;
  padding: 0 !important;
  z-index: auto !important;
  background: #F18A61 !important;
  border-top: 1px solid #faa270 !important;
}

.site-footer,
body.mobile-inside .site-footer {
  width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
  padding: 0.75rem 1rem !important;
}

body,
body.result-page,
body.mobile-inside,
body.result-page.mobile-inside {
  padding-bottom: 0 !important;
}

body.mobile-inside .page-shell {
  position: relative !important;
}

body.result-page.mobile-inside .page-shell {
  padding-bottom: 0 !important;
}

body.result-page.mobile-inside .page-shell > .container {
  min-height: auto !important;
}

body.result-page.mobile-inside .page-shell > .container > .site-footer-wrapper {
  margin-top: 1.6rem !important;
}

@media (min-width:24.375rem) and (max-width:47.999rem) {
  body.mobile-inside .site-footer-wrapper {
    --footer-inline-width: 100vw;
    --footer-inline-max-width: none;
    --footer-inline-margin-left: calc(50% - 50vw);
    --footer-inline-margin-right: calc(50% - 50vw);
  }
}

body.mobile-inside .page-shell,
body.mobile-inside .page-shell > .container,
body.mobile-inside .site-footer-wrapper,
body.mobile-inside .site-footer {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

body.mobile-inside .page-shell > .container {
  padding-bottom: 0 !important;
}

@media (min-width:48rem) {
  body.result-page .cva-wrap--sticky,
  body.result-page.mobile-inside .cva-wrap--sticky {
    width: var(--lp-max-width);
    max-width: var(--lp-max-width);
    left: calc(50% - 0.45rem);
    transform: translateX(-50%);
  }

  body.result-page .cva-wrap--sticky .cva-sticky-shell,
  body.result-page.mobile-inside .cva-wrap--sticky .cva-sticky-shell {
    width: var(--lp-max-width);
    max-width: var(--lp-max-width);
    padding-left: 0;
    padding-right: 0;
  }

  body.result-page .cva-wrap--sticky form,
  body.result-page.mobile-inside .cva-wrap--sticky form {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }

  body.result-page .cva-wrap--sticky .cva-button--text,
  body.result-page.mobile-inside .cva-wrap--sticky .cva-button--text,
  body.result-page .cva-wrap--sticky .cva-button__main,
  body.result-page.mobile-inside .cva-wrap--sticky .cva-button__main {
    width: 100%;
  }
}
