/* =========================================================
   コーティングメニュー・料金のHTML化（2026-10）
   元は画像だった部品。寸法は元画像を実測し、--u（デザイン幅1px）で
   画面幅に合わせて画像と同じ比率で伸び縮みさせる。
   ========================================================= */

.rl-card, .rl-head, .rl-tp, .rl-tk, .rl-cp, .rl-net {
  font-family: "Noto Sans JP", -apple-system, "Hiragino Kaku Gothic ProN", "游ゴシック体", YuGothic, sans-serif;
  color: #222;
  font-feature-settings: "palt";
}
.rl-card *, .rl-head *, .rl-tp *, .rl-tk *, .rl-cp *, .rl-net * { box-sizing: border-box; }

/* ---------- 共通部品 ---------- */
.rl-tab { position: absolute; display: block; }
.rl-tab svg { display: block; width: 100%; height: 100%; fill: #fff; stroke: var(--c); stroke-width: 3; }
.rl-tab__no {
  position: absolute; inset: 0 22% 0 0;
  display: flex; align-items: center; justify-content: center;
  color: var(--c); font-family: "Noto Sans JP", sans-serif; font-weight: 900; line-height: 1;
}
.rl-catch em {
  font-style: normal; font-weight: 900; color: var(--c);
  background: linear-gradient(transparent 74%, #f7d147 74%, #f7d147 94%, transparent 94%);
  padding: 0 .08em; margin-right: .2em;
}
.rl-catch small { font-weight: 700; color: #222; margin-right: .2em; }
.rl-catch, .rl-box__body, .rl-tk__text { text-wrap: pretty; word-break: auto-phrase; }
.rl-box { display: flex; flex-direction: column; overflow: hidden; background: color-mix(in srgb, var(--c) 20%, #fff); }
.rl-box__label { display: flex; align-items: center; justify-content: center; background: var(--c); color: #fff; font-weight: 700; line-height: 1; }
.rl-box__body { display: flex; flex-wrap: wrap; align-items: baseline; align-content: center; justify-content: center; flex: 1; font-weight: 700; line-height: 1.1; text-align: center; }
.rl-num { color: #e60012; font-family: "Noto Sans JP", sans-serif; font-weight: 900; letter-spacing: -.02em; }
.rl-unit { color: #e60012; font-weight: 900; margin-right: .3em; }
.rl-txt { font-weight: 700; color: #222; }
.rl-chev { fill: none; stroke: #fff; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- トップ：表紙の金額 ---------- */
.main_v .rl-fv { position: relative; }
.main_v .rl-fv img { display: block; }
.rl-fv__price { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.rl-fv__text text { fill: #fde100; stroke: #24244a; paint-order: stroke fill; stroke-linejoin: round; }
.rl-fv__num { font-family: Jost, "Noto Sans JP", sans-serif; font-weight: 600; }
.rl-fv__ja { font-family: "Noto Sans JP", sans-serif; font-weight: 900; }

/* ---------- 料金ページ：上部の商品カード（デザイン幅320） ---------- */
.rl-card { display: block; container-type: inline-size; text-decoration: none; }
.rl-card__in {
  --u: calc(100cqi / 320);
  display: flex; flex-direction: column; background: #fff;
  border: calc(2 * var(--u)) solid var(--c);
}
.rl-card__band {
  position: relative; display: flex; align-items: center; justify-content: center;
  margin: calc(11 * var(--u)) calc(9 * var(--u)) 0 calc(12 * var(--u));
  height: calc(38 * var(--u)); padding-left: calc(34 * var(--u));
  background: var(--c); color: #fff;
}
.rl-card__band .rl-tab { left: calc(-14 * var(--u)); top: calc(-13 * var(--u)); width: calc(56 * var(--u)); height: calc(41 * var(--u)); }
.rl-card__band .rl-tab__no { font-size: calc(14 * var(--u)); }
.rl-card__name { font-size: calc(17 * var(--u)); font-weight: 700; letter-spacing: .03em; white-space: nowrap; }
.rl-card__catch { display: block; min-height: calc(64 * var(--u)); padding: calc(10 * var(--u)) calc(10 * var(--u)) 0 calc(14 * var(--u)); line-height: 1.85; }
.rl-card__catch em { font-size: calc(15 * var(--u)); }
.rl-card__catch small { font-size: calc(9.5 * var(--u)); }
.rl-card__boxes { display: grid; grid-template-columns: 1fr 1fr; gap: calc(12 * var(--u)); padding: calc(6 * var(--u)) calc(11 * var(--u)) calc(12 * var(--u)); }
.rl-card .rl-box { border-radius: calc(9 * var(--u)); }
.rl-card .rl-box__label { height: calc(18 * var(--u)); font-size: calc(10.5 * var(--u)); }
.rl-card .rl-box__body { flex: none; height: calc(44 * var(--u)); padding: 0 calc(3 * var(--u)); line-height: 1.05; overflow: hidden; }
.rl-card__price small { color: #e60012; font-size: calc(10 * var(--u)); font-weight: 900; }
.rl-card__price b { color: #e60012; font-family: "Noto Sans JP", sans-serif; font-weight: 900; font-size: calc(25 * var(--u)); letter-spacing: -.02em; margin: 0 calc(1 * var(--u)); text-shadow: 0 0 calc(2 * var(--u)) #fff; }
.rl-card .rl-dur .rl-num { font-size: calc(20 * var(--u)); }
.rl-card .rl-dur .rl-unit { font-size: calc(11 * var(--u)); }
.rl-card .rl-dur .rl-txt { font-size: calc(10 * var(--u)); }
.price_page .main_v .rl-card__img { display: block; width: 100%; height: auto; aspect-ratio: 624 / 206; object-fit: cover; }
.rl-card__foot {
  display: flex; align-items: center; justify-content: center; gap: calc(6 * var(--u));
  height: calc(22 * var(--u)); background: var(--c); color: #fff;
  font-size: calc(11.5 * var(--u)); font-weight: 700; letter-spacing: .08em;
}
.rl-card__foot .rl-chev { width: calc(12 * var(--u)); height: calc(12 * var(--u)); }
.rl-card:hover { opacity: .85; }

/* ---------- 料金ページ：商品見出し ---------- */
.price_page .price_list .kizu .rl-head { display: flex; gap: 8px; align-items: flex-start; margin: 40px 0 0; }
.rl-head__left { flex: 0 0 40%; container-type: inline-size; }
.rl-head__right { flex: 1 1 auto; container-type: inline-size; }
/* 左（デザイン幅406） */
.rl-head__left .rl-head__in { --u: calc(100cqi / 406); }
.price_page .price_list .kizu .rl-head h3.rl-head__band {
  position: relative; display: flex; align-items: center; justify-content: flex-start; gap: 0;
  margin: calc(14 * var(--u)) calc(8 * var(--u)) 0 calc(21 * var(--u));
  height: calc(51 * var(--u)); padding-left: calc(80 * var(--u));
  background: var(--c); color: #fff;
  outline: calc(1.5 * var(--u)) solid var(--c); outline-offset: calc(6 * var(--u));
}
.rl-head__band .rl-tab { left: calc(-21 * var(--u)); top: calc(-14 * var(--u)); width: calc(74 * var(--u)); height: calc(54 * var(--u)); }
.rl-head__band .rl-tab__no { font-size: calc(20 * var(--u)); }
.rl-head__name { display: flex; flex-direction: column; justify-content: center; font-size: calc(23 * var(--u)); font-weight: 700; letter-spacing: .03em; line-height: 1.1; white-space: nowrap; }
.rl-head__name small { font-size: calc(10 * var(--u)); font-weight: 500; letter-spacing: 0; margin-top: calc(3 * var(--u)); }
.price_page .price_list .kizu .rl-head__catch { margin: calc(26 * var(--u)) 0 0 calc(6 * var(--u)); line-height: 2.05; font-size: calc(13 * var(--u)); }
.rl-head__catch em { font-size: calc(20 * var(--u)); }
.rl-head__catch small { font-size: calc(12.5 * var(--u)); }
/* 右（デザイン幅610） */
.rl-head__right .rl-head__in { --u: calc(100cqi / 610); position: relative; height: calc(231 * var(--u)); }
.rl-head__right .rl-head__in::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(205 * var(--u)); right: 0; background: var(--tint); }
.rl-head__car { position: absolute; right: 0; top: 0; height: 100%; width: calc(183 * var(--u)); object-fit: contain; object-position: right top; }
.rl-head .rl-box { position: absolute; border-radius: calc(12 * var(--u)); }
.rl-head .rl-box__label { height: calc(26 * var(--u)); font-size: calc(16 * var(--u)); }
.rl-head__dur { left: 0; top: calc(26 * var(--u)); width: calc(192 * var(--u)); height: calc(85 * var(--u)); }
.rl-head__time { left: calc(221 * var(--u)); top: calc(26 * var(--u)); width: calc(191 * var(--u)); height: calc(85 * var(--u)); }
.rl-head__proc { left: 0; top: calc(132 * var(--u)); width: calc(412 * var(--u)); height: calc(89 * var(--u)); overflow: visible; }
.rl-head__proc .rl-box__label { border-radius: calc(12 * var(--u)) calc(12 * var(--u)) 0 0; position: relative; }
.rl-head__proc .rl-box__body { justify-content: flex-start; padding: 0 calc(22 * var(--u)); font-size: calc(13.5 * var(--u)); text-align: left; border-radius: 0 0 calc(12 * var(--u)) calc(12 * var(--u)); }
.rl-hand { position: absolute; left: calc(17 * var(--u)); top: calc(-20 * var(--u)); width: calc(45 * var(--u)); height: auto; }
.rl-head .rl-dur .rl-num { font-size: calc(27 * var(--u)); }
.rl-head .rl-dur .rl-unit { font-size: calc(16 * var(--u)); }
.rl-head .rl-dur .rl-txt { font-size: calc(15 * var(--u)); }

/* ---------- トップ：価格カード（PCデザイン幅1162） ---------- */
.price .rl-tp { display: block; container-type: inline-size; width: 1162px; max-width: 95%; margin: 0 auto; text-decoration: none; }
.rl-tp__in {
  --u: calc(100cqi / 1162);
  position: relative; display: block; height: calc(620 * var(--u));
  background: linear-gradient(90deg, #d1e9f8, #9fb9e7);
}
.rl-tp__memo { position: absolute; left: calc(28 * var(--u)); top: calc(12 * var(--u)); width: calc(268 * var(--u)); }
.rl-tp__memo img { display: block; width: 100%; height: auto; }
.rl-tp__memo-web { position: absolute; left: calc(24 * var(--u)); top: calc(50 * var(--u)); font-size: calc(21 * var(--u)); font-weight: 900; color: #111; letter-spacing: .02em; }
.rl-tp__memo-off { position: absolute; left: calc(10 * var(--u)); top: calc(92 * var(--u)); width: calc(250 * var(--u)); height: auto; overflow: visible; }
.rl-tp__memo-off text { fill: #2b67d3; stroke: #f7d147; paint-order: stroke fill; stroke-linejoin: round; font-family: "Noto Sans JP", sans-serif; font-weight: 900; }
.rl-tp__memo-off .rl-tp__memo-big { font-family: "Noto Sans JP", sans-serif; font-weight: 900; }
.rl-tp__lead { position: absolute; left: calc(380 * var(--u)); right: calc(80 * var(--u)); top: calc(48 * var(--u)); text-align: center; color: #2b67d3; font-weight: 900; font-size: calc(37 * var(--u)); line-height: 1.7; letter-spacing: .02em; }
.rl-tp__lead .rl-sp { display: none; }
.rl-tp__cols { position: absolute; left: calc(35 * var(--u)); right: calc(35 * var(--u)); top: calc(218 * var(--u)); display: grid; grid-template-columns: repeat(3, 1fr); }
.rl-tp__cols::before { content: ""; position: absolute; left: 0; right: 0; top: calc(72 * var(--u)); height: calc(235 * var(--u)); background: #fff; border-radius: calc(12 * var(--u)); }
.rl-tp__col { position: relative; display: flex; flex-direction: column; align-items: center; }
.rl-tp__col + .rl-tp__col .rl-tp__body::before { content: ""; position: absolute; left: 0; top: calc(15 * var(--u)); bottom: calc(10 * var(--u)); border-left: calc(1.5 * var(--u)) dotted #5d84f7; }
.rl-tp__tab {
  position: relative; display: flex; align-items: center; justify-content: center;
  width: calc(310 * var(--u)); height: calc(46 * var(--u)); margin: calc(8 * var(--u)) 0 0 calc(18 * var(--u));
  padding-left: calc(30 * var(--u)); background: var(--c);
  outline: calc(1.5 * var(--u)) solid var(--c); outline-offset: calc(5 * var(--u));
}
.rl-tp__tab .rl-tab { left: calc(-18 * var(--u)); top: calc(-12 * var(--u)); width: calc(58 * var(--u)); height: calc(44 * var(--u)); }
.rl-tp__tab .rl-tab__no { font-size: calc(19 * var(--u)); }
.rl-tp__name { color: #fff; font-weight: 700; font-size: calc(21 * var(--u)); letter-spacing: .03em; white-space: nowrap; }
.rl-tp__body { position: relative; align-self: stretch; display: flex; flex-direction: column; align-items: center; padding-top: calc(32 * var(--u)); }
.price .rl-tp .rl-tp__img { display: block; width: calc(255 * var(--u)); height: auto; aspect-ratio: 624 / 206; object-fit: cover; }
.rl-tp__price { display: flex; align-items: baseline; width: calc(255 * var(--u)); margin-top: calc(6 * var(--u)); font-size: calc(15 * var(--u)); font-weight: 700; color: #222; white-space: nowrap; }
.rl-tp__price b { color: #e8302a; font-family: "Noto Sans JP", sans-serif; font-weight: 900; font-size: calc(46 * var(--u)); letter-spacing: -.01em; margin: 0 calc(4 * var(--u)) 0 calc(10 * var(--u)); }
.rl-tp__price small { color: #e8302a; font-size: calc(15 * var(--u)); font-weight: 700; }
.rl-tp__dur { width: calc(255 * var(--u)); margin-top: calc(4 * var(--u)); font-size: calc(14.5 * var(--u)); font-weight: 700; color: #222; white-space: nowrap; }
.rl-tp__more { position: absolute; right: calc(28 * var(--u)); top: calc(548 * var(--u)); display: flex; align-items: center; gap: calc(6 * var(--u)); color: #2b67d3; font-weight: 900; font-size: calc(36 * var(--u)); letter-spacing: .03em; }
.rl-tp__more svg { width: calc(38 * var(--u)); height: calc(38 * var(--u)); fill: none; stroke: #2b67d3; stroke-width: 3.4; stroke-linecap: round; stroke-linejoin: round; }
.rl-tp:hover { opacity: .9; }

/* ---------- トップ：新車限定特典バナー（PCデザイン幅1162） ---------- */
.price .rl-tk { display: block; container-type: inline-size; width: 1162px; max-width: 95%; margin: 0 auto 20px; text-decoration: none; }
.rl-tk__in { --u: calc(100cqi / 1162); position: relative; display: block; height: calc(608 * var(--u)); background: #eef2fd; overflow: hidden; }
.rl-tk__car { position: absolute; z-index: 1; right: calc(40 * var(--u)); top: calc(4 * var(--u)); width: calc(300 * var(--u)); height: auto; }
.rl-tk__box {
  position: absolute; left: calc(32 * var(--u)); top: calc(52 * var(--u)); width: calc(796 * var(--u)); height: calc(212 * var(--u));
  display: flex; flex-direction: column; justify-content: center; gap: calc(16 * var(--u)); padding-left: calc(45 * var(--u));
  border: calc(3 * var(--u)) solid #2b67d3; border-radius: calc(7 * var(--u));
  background: linear-gradient(90deg, #fff 62%, rgba(255,255,255,.6));
}
.rl-tk__line { color: #2b67d3; font-weight: 900; font-size: calc(46 * var(--u)); line-height: 1.15; letter-spacing: .01em; white-space: nowrap; }
.rl-tk__line b, .rl-tk__text b { color: #e8230c; }
.rl-tk__label { position: absolute; left: calc(32 * var(--u)); top: calc(317 * var(--u)); width: calc(315 * var(--u)); height: calc(68 * var(--u)); background: #2b67d3; padding: calc(4 * var(--u)); }
.rl-tk__label span { display: flex; align-items: center; justify-content: center; height: 100%; border: calc(1.5 * var(--u)) solid #fff; color: #fff; font-weight: 900; font-size: calc(42 * var(--u)); letter-spacing: .02em; }
.rl-tk__text { position: absolute; left: calc(30 * var(--u)); top: calc(392 * var(--u)); color: #2b67d3; font-weight: 900; font-size: calc(35 * var(--u)); line-height: 1.75; letter-spacing: .01em; }
.rl-tk__btn { position: absolute; left: calc(738 * var(--u)); top: calc(523 * var(--u)); width: calc(380 * var(--u)); height: calc(70 * var(--u)); display: flex; align-items: center; justify-content: center; background: #ff9300; color: #fff; border-radius: calc(6 * var(--u)); box-shadow: 0 calc(3 * var(--u)) calc(4 * var(--u)) rgba(0,0,0,.25); font-weight: 900; font-size: calc(33 * var(--u)); letter-spacing: .03em; }
.rl-tk:hover .rl-tk__btn { filter: brightness(1.06); }
.rl-tk .rl-sp { display: none; }

/* ---------- 料金ページ：割引・特典（デザイン幅560） ---------- */
.rl-cp, .rl-net { container-type: inline-size; width: 560px; max-width: 100%; margin: 0 auto 57px; }
.rl-cp__title, .rl-cp__body, .rl-net__left, .rl-net__right { --u: calc(100cqi / 560); }
.price_page .coupon .rl-cp p { margin: 0; text-align: center; font-weight: 700; color: #fff; text-shadow: 0 2px 4px rgba(0,0,0,.35); }
.rl-cp { background: #f4b400; padding: 6px 9px 6px 9px; }
.price_page .coupon .rl-cp .rl-cp__title { background: #8b0000; font-size: calc(18 * var(--u)); padding: calc(10 * var(--u)) 0; letter-spacing: .06em; }
.price_page .coupon .rl-cp .rl-cp__body {
  display: flex; flex-direction: column; justify-content: center; min-height: calc(108 * var(--u));
  padding: calc(14 * var(--u)) calc(10 * var(--u));
  background: linear-gradient(120deg, #c90f45 0%, #e4500e 50%, #c3203a 100%);
  font-size: calc(22 * var(--u)); line-height: 1.6; letter-spacing: .04em;
}
.rl-cp__body small { display: block; font-size: calc(13 * var(--u)); margin-top: calc(10 * var(--u)); }
.rl-net { display: flex; background: #f4b400; padding: 7px; }
.price_page .coupon .rl-net p { margin: 0; text-align: center; font-weight: 700; }
.price_page .coupon .rl-net .rl-net__left {
  flex: 0 0 64%; display: flex; flex-direction: column; justify-content: center;
  padding: calc(18 * var(--u)) calc(16 * var(--u)) calc(14 * var(--u)) calc(6 * var(--u));
  background: linear-gradient(120deg, #c90f45 0%, #e4500e 55%, #c3203a 100%); color: #fff;
  font-size: calc(15.5 * var(--u)); line-height: 1.95; text-shadow: 0 2px 4px rgba(0,0,0,.35);
  clip-path: polygon(0 0, 97% 0, 100% 5%, 97% 10%, 100% 15%, 97% 20%, 100% 25%, 97% 30%, 100% 35%, 97% 40%, 100% 45%, 97% 50%, 100% 55%, 97% 60%, 100% 65%, 97% 70%, 100% 75%, 97% 80%, 100% 85%, 97% 90%, 100% 95%, 97% 100%, 0 100%);
}
.rl-net__left small { display: block; font-size: calc(11 * var(--u)); line-height: 1.6; margin-top: calc(6 * var(--u)); }
.price_page .coupon .rl-net .rl-net__right { flex: 1; display: flex; align-items: center; justify-content: center; background: #fff; color: #e8230c; font-size: calc(26 * var(--u)); line-height: 1.6; letter-spacing: .03em; }

/* ---------- スマホ ---------- */
@media screen and (max-width: 700px) {
  .price_page .price_list .kizu .rl-head { flex-direction: column; align-items: center; gap: 18px; margin: 30px 0 24px; }
  .rl-head__left, .rl-head__right { flex: none; width: 100%; max-width: 420px; }
  /* スマホは右の箱を流し込みにして文字を読める大きさに（画像のままだと8px程度だった） */
  .rl-head__right .rl-head__in { height: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 22px 10px; padding: 14px 12px 14px; background: var(--tint); border-radius: 10px; }
  .rl-head__right .rl-head__in::before, .rl-head__car { display: none; }
  .rl-head .rl-box { position: relative; left: auto; top: auto; width: auto; height: auto; border-radius: 8px; }
  .rl-head .rl-box__label { height: 24px; font-size: 13px; }
  .rl-head .rl-box__body { padding: 8px 6px; min-height: 46px; }
  .rl-head__proc { grid-column: 1 / -1; }
  .rl-head__proc .rl-box__label { border-radius: 8px 8px 0 0; }
  .rl-head__proc .rl-box__body { font-size: 13px; line-height: 1.5; padding: 8px 12px; border-radius: 0 0 8px 8px; }
  .rl-hand { left: 10px; top: -16px; width: 30px; }
  .rl-head .rl-dur .rl-num { font-size: 22px; }
  .rl-head .rl-dur .rl-unit { font-size: 13px; }
  .rl-head .rl-dur .rl-txt { font-size: 12px; }

  .price .rl-tp { width: 100%; max-width: none; }
  .rl-tp__in { --u: calc(100cqi / 375); height: auto; padding: calc(30 * var(--u)) calc(28 * var(--u)) calc(40 * var(--u)); display: flex; flex-direction: column; align-items: center; }
  .rl-tp__lead { position: static; order: 1; font-size: calc(25 * var(--u)); line-height: 1.62; }
  .rl-tp__lead .rl-sp { display: inline; }
  .rl-tp__memo { position: relative; left: auto; top: auto; order: 2; width: calc(282 * var(--u)); margin-top: calc(40 * var(--u)); }
  .rl-tp__memo-web { left: calc(25 * var(--u)); top: calc(52 * var(--u)); font-size: calc(22 * var(--u)); }
  .rl-tp__memo-off { left: calc(10 * var(--u)); top: calc(96 * var(--u)); width: calc(262 * var(--u)); }
  .rl-tp__cols { position: relative; left: auto; right: auto; top: auto; order: 3; display: flex; flex-direction: column; width: 100%; margin-top: calc(18 * var(--u)); padding: calc(26 * var(--u)) calc(14 * var(--u)) calc(30 * var(--u)); background: #fff; border-radius: calc(12 * var(--u)); gap: calc(34 * var(--u)); }
  .rl-tp__cols::before { display: none; }
  .rl-tp__col + .rl-tp__col .rl-tp__body::before { display: none; }
  .rl-tp__tab { width: calc(282 * var(--u)); height: calc(36 * var(--u)); margin: calc(8 * var(--u)) 0 0 calc(14 * var(--u)); padding-left: calc(30 * var(--u)); }
  .rl-tp__tab .rl-tab { left: calc(-14 * var(--u)); top: calc(-10 * var(--u)); width: calc(48 * var(--u)); height: calc(36 * var(--u)); }
  .rl-tp__tab .rl-tab__no { font-size: calc(15 * var(--u)); }
  .rl-tp__name { font-size: calc(20 * var(--u)); }
  .rl-tp__body { padding-top: calc(20 * var(--u)); }
  .price .rl-tp .rl-tp__img, .rl-tp__price, .rl-tp__dur { width: calc(290 * var(--u)); }
  .rl-tp__price { margin-top: calc(16 * var(--u)); font-size: calc(15 * var(--u)); }
  .rl-tp__price b { font-size: calc(40 * var(--u)); }
  .rl-tp__price small { font-size: calc(14 * var(--u)); }
  .rl-tp__dur { font-size: calc(15 * var(--u)); margin-top: calc(6 * var(--u)); }
  .rl-tp__more { position: static; order: 4; margin-top: calc(34 * var(--u)); font-size: calc(21 * var(--u)); }
  .rl-tp__more svg { width: calc(22 * var(--u)); height: calc(22 * var(--u)); }

  .price .rl-tk { width: 90%; max-width: none; }
  .rl-tk__in { --u: calc(100cqi / 375); height: calc(306 * var(--u)); }
  .rl-tk__car { right: calc(4 * var(--u)); top: calc(4 * var(--u)); width: calc(104 * var(--u)); }
  .rl-tk__box { left: calc(9 * var(--u)); top: calc(19 * var(--u)); width: calc(303 * var(--u)); height: calc(86 * var(--u)); padding-left: calc(18 * var(--u)); gap: calc(6 * var(--u)); border-width: calc(1.5 * var(--u)); border-radius: calc(3 * var(--u)); }
  .rl-tk__line { font-size: calc(17.5 * var(--u)); }
  .rl-tk__label { left: calc(115 * var(--u)); top: calc(127 * var(--u)); width: calc(149 * var(--u)); height: calc(30 * var(--u)); padding: calc(2 * var(--u)); }
  .rl-tk__label span { font-size: calc(19 * var(--u)); border-width: calc(1 * var(--u)); }
  .rl-tk__text { left: 0; right: 0; top: calc(165 * var(--u)); text-align: center; font-size: calc(16 * var(--u)); line-height: 1.55; }
  .rl-tk .rl-sp { display: inline; }
  .rl-tk__btn { left: calc(115 * var(--u)); top: calc(263 * var(--u)); width: calc(149 * var(--u)); height: calc(31 * var(--u)); font-size: calc(14 * var(--u)); border-radius: calc(3 * var(--u)); }

  .rl-cp, .rl-net { width: 100%; margin-bottom: 32px; }
}

/* ---------- container query 非対応ブラウザ（Safari 15以前など）の代替：画面幅から近似 ---------- */
@supports not (width: 1cqi) {
  .rl-card__in, .rl-head__left .rl-head__in, .rl-head__right .rl-head__in { --u: 1px; }
  .rl-tp__in, .rl-tk__in { --u: calc(min(1162px, 95vw) / 1162); }
  .rl-cp__title, .rl-cp__body, .rl-net__left, .rl-net__right { --u: 1px; }
  @media screen and (max-width: 1100px) {
    .rl-card__in { --u: calc((89vw - 32px) / 3 / 320); }
    .rl-head__left .rl-head__in { --u: calc(89vw * .4 / 406); }
    .rl-head__right .rl-head__in { --u: calc(89vw * .6 / 610); }
  }
  @media screen and (max-width: 700px) {
    .rl-card__in { --u: calc((89vw - 16px) / 2 / 320); }
    .rl-head__left .rl-head__in { --u: calc(min(420px, 89vw) / 406); }
    .rl-tp__in { --u: calc(100vw / 375); }
    .rl-tk__in { --u: calc(90vw / 375); }
    .rl-cp__title, .rl-cp__body, .rl-net__left, .rl-net__right { --u: calc(89vw / 560); }
  }
  @media screen and (max-width: 500px) {
    .rl-card__in { --u: calc(89vw / 320); }
  }
}