@charset "UTF-8";
/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
** ＜下取りクーポンLP＞
**
** ▼ こちらのスタイルシートには、ページ固有のCSSを記述してください。▼
** ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */
:root {
  --content-width: 1012px;
  --mv-width: 1200px;
  --txt-32: 32px;
  --txt-30: 30px;
  --txt-28: 28px;
  --txt-27: 27px;
  --txt-26: 26px;
  --txt-25: 25px;
  --txt-24: 24px;
  --txt-20: 20px;
  --txt-19: 19px;
  --txt-18: 18px;
  --txt-16: 16px;
  --txt-15: 15px;
  --txt-14: 14px;
  --txt-13: 13px;
  --txt-12: 12px;
  --txt-11: 11px;
  --txt-10: 10px;
  --fw-bold: 700;
  --fw-medium: 500;
  --clr-white: #fff;
  --clr-black: #000;
  --clr-black-02: #333;
  --clr-light-gray: #f2f2f2;
  --clr-orange: #f06735;
  --clr-orange-02: #f5a83a;
  --clr-blue: #3b8ad6;
  --clr-line: #06c755;
  --clr-gold: #a89563;
  --clr-navy: #2e3a8c;
  --clr-gray: #ccc;
  --clr-blue-02: #1170b8;
  --clr-light-blue: #eef5fb;
  --clr-gold-02: #ecd788;
  --lh-medium: 1.6;
  --lh-normal: 1.4;
  --lh-tight: 1.25;
  --lh-small: 1;
  --ls-large: 0.06em;
  --ls-medium: 0.1em;
}

/**
 * 共通
 * ---------------------------------------- */
#contents {
  width: 100%;
}

#breadcrumbs {
  max-width: var(--content-width);
  margin-right: auto;
  margin-left: auto;
}

a:hover {
  color: currentColor;
  text-decoration: initial;
}

/**
 * グリッドレイアウト
 * ---------------------------------------- */
.grid {
  display: grid;
}

.grid--col-2 {
  grid-template-columns: repeat(2, 1fr);
}

/**
 * メインビジュアル
 * ---------------------------------------- */
.mv__inner {
  max-width: var(--mv-width);
  margin-right: auto;
  margin-left: auto;
}

/**
 * 共通セクション
 * ---------------------------------------- */
.section {
  position: relative;
  padding-right: 20px;
  padding-left: 20px;
  box-sizing: border-box;
}

.section--bg-light-gray {
  background-color: var(--clr-light-gray);
}

/* 背景画像（買い替えのベストタイミング） */
.section--bg-timing {
  background-image: url('https://www.rasin.co.jp/support/img/replace/bg_timing_pc_01.jpg');
  background-position: right top;
  background-size: cover;
  background-repeat: no-repeat;
}

.section__inner {
  max-width: var(--content-width);
  margin-right: auto;
  margin-left: auto;
}

/**
 * 見出し
 * ---------------------------------------- */
.heading {
  margin: 0;
  line-height: 1.4;
  letter-spacing: 0;
}

.heading--fw-medium {
  font-weight: var(--fw-medium);
}

.heading--clr-black {
  color: var(--clr-black);
}

.heading--txt-center {
  text-align: center;
}

.heading--clr-white {
  color: var(--clr-white);
}

/* 背景色（黒） */
.heading--bg-black {
  padding-top: 6px;
  padding-bottom: 6px;
  background-color: var(--clr-black);
}

.heading--bb-navy {
  background: linear-gradient(to right, var(--clr-navy), transparent) no-repeat left bottom / 100% 1px;
  line-height: var(--lh-small);
}

/**
 * テキスト
 * ---------------------------------------- */
.text {
  margin-bottom: 0;
}

.text--fz-16 {
  font-size: var(--txt-16);
}

.text--fz-15 {
  font-size: var(--txt-15);
}

.text--fw-medium {
  font-weight: var(--fw-medium);
}

.text--clr-black {
  color: var(--clr-black);
}

.text--clr-black-02 {
  color: var(--clr-black-02);
}

.text--clr-gold-02 {
  color: var(--clr-gold-02);
}

.text--txt-center {
  text-align: center;
}

.text--lh-medium {
  line-height: var(--lh-medium);
}

.text--lh-normal {
  line-height: var(--lh-normal);
}

.text--ls-large {
  letter-spacing: var(--ls-large);
}

.text--ls-medium {
  letter-spacing: var(--ls-medium);
}

/* テキストリンク */
.text__link {
  display: inline-flex;
  align-items: center;
  column-gap: 4px;
  padding-bottom: 2px;
  border-bottom: 1px solid var(--clr-navy);
  color: var(--clr-navy);
  font-size: var(--txt-16);
  line-height: var(--lh-small);
  white-space: nowrap;
}

.text__link::after {
  content: '';
  flex-shrink: 0;
  width: 10px;
  height: 12px;
  background-color: currentColor;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}

.text__link:hover {
  color: var(--clr-navy);
}

/* 下線（オレンジ） */
.text--bb-orange {
  position: relative;
  width: fit-content;
  line-height: var(--lh-small);
  padding-bottom: 6px;
  letter-spacing: var(--ls-medium);
}

.text--bb-orange::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: var(--clr-orange-02);
}

/**
 * 画像
 * ---------------------------------------- */
.image--w-full img {
  display: block;
  width: 100%;
  height: auto;
}

/* 枠線 */
.image--border img {
  border: 1px solid var(--clr-black);
  box-sizing: border-box;
}

/* ドロップシャドウ */
.image--drop-shadow img {
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.15);
}

.image--badge {
  position: absolute;
  z-index: 1;
  height: auto;
}

/**
 * ボックス
 * ---------------------------------------- */
.box {
  position: relative;
  box-sizing: border-box;
}

.box--bg-white {
  background-color: var(--clr-white);
}

.box--bg-navy {
  background-color: var(--clr-navy);
}

.box--border-dotted {
  border: 3px dotted var(--clr-navy);
}

/* 背景画像（共通）：画像の指定は各モディファイアで対応 */
.box--bg-image {
  background-position: right top;
  background-size: 100% auto;
  background-repeat: no-repeat;
}

/* 背景画像（店頭の場合） */
.box--bg-flow-shop {
  background-image: url('https://www.rasin.co.jp/support/img/replace/bg_flow_shop_pc_01.jpg');
}

/* 背景画像（通販サイトの場合） */
.box--bg-flow-online {
  background-image: url('https://www.rasin.co.jp/support/img/replace/bg_flow_online_pc_01.jpg');
}

/* 背景画像（よくある質問） */
.box--bg-faq {
  background-image: url('https://www.rasin.co.jp/support/img/replace/bg_faq_pc_01.jpg');
}

/* 背景画像（店頭以外でのご成約の場合） */
.box--bg-coupon-online {
  background-image: url('https://www.rasin.co.jp/support/img/replace/bg_coupon_online_pc_01.jpg');
}

/* 背景画像（店頭買取にてご成約の場合） */
.box--bg-coupon-shop {
  background-image: url('https://www.rasin.co.jp/support/img/replace/bg_coupon_shop_pc_01.jpg');
}

/**
 * タイトル（帯）
 * ---------------------------------------- */
.title-band {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  margin: 0;
  background-color: var(--clr-black);
  box-sizing: border-box;
}

.title-band__icon {
  position: absolute;
  top: 0;
  left: -1px;
  height: 100%;
  width: auto;
}

.title-band__text {
  color: var(--clr-white);
  font-weight: var(--fw-medium);
  line-height: var(--lh-small);
  letter-spacing: var(--ls-large);
}

/**
 * タイトル（バッジ付き）
 * ---------------------------------------- */
.title-badge {
  display: flex;
  align-items: center;
}

.title-badge__image {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
  height: auto;
}

/**
 * 箇条書き（装飾画像付き）
 * ---------------------------------------- */
.marker-list__item {
  display: flex;
  align-items: center;
  color: var(--clr-black-02);
  letter-spacing: var(--ls-medium);
  line-height: 1.4;
}

.marker-list__item::before {
  content: '';
  flex-shrink: 0;
  background: url('https://www.rasin.co.jp/support/img/replace/img_list_marker_01.png') no-repeat center / contain;
}

/**
 * ステップ
 * ---------------------------------------- */
.step__label {
  display: flex;
  align-items: center;
  margin: 0;
  background-color: var(--clr-navy);
  color: var(--clr-white);
  font-weight: var(--fw-medium);
  line-height: var(--lh-small);
  letter-spacing: var(--ls-large);
  box-sizing: border-box;
}

/**
 * テーブル
 * ---------------------------------------- */
.table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.table th,
.table td {
  border: 1px solid var(--clr-gray);
  color: var(--clr-black-02);
  font-size: var(--txt-16);
  line-height: 1.6;
  text-align: left;
  vertical-align: middle;
}

.table th {
  font-weight: var(--fw-bold);
}

/**
 * 注釈
 * ---------------------------------------- */
.note {
  margin: 0;
  padding: 0;
  list-style: none;
}

.note__item {
  position: relative;
  padding-left: 1em;
}

.note__item::before {
  content: '※';
  position: absolute;
  top: 0;
  left: 0;
}

.note--dot .note__item::before {
  content: '・';
}

.note__link {
  color: inherit;
  text-decoration: underline;
}

/**
 * お客様の声
 * ---------------------------------------- */
.voice-card {
  background-color: var(--clr-white);
}

.voice-card__title {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  background-color: var(--clr-blue-02);
  color: var(--clr-white);
  font-size: var(--txt-16);
  font-weight: var(--fw-bold);
  line-height: 1.3;
  text-align: center;
}

.voice-card__titleText::before {
  content: '';
  display: inline-block;
  width: 14px;
  height: 20px;
  margin-right: 6px;
  background: url('https://www.rasin.co.jp/support/img/replace/icon_watch_01.svg') no-repeat center / contain;
  vertical-align: top;
}

.voice-card__name {
  margin: 0;
  padding-left: 6px;
  border-left: 6px solid var(--clr-blue-02);
  border-bottom: 1px solid var(--clr-blue-02);
  color: var(--clr-black-02);
  font-size: var(--txt-16);
  font-weight: var(--fw-bold);
  line-height: 1.3;
}

.voice-card__details {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 12px;
  row-gap: 6px;
  float: none;
  width: auto;
  margin-bottom: 0;
  color: var(--clr-black-02);
  line-height: 1.5;
}

.voice-card__details dt,
.voice-card__details dd {
  float: none;
  width: auto;
  height: auto;
  font-size: var(--txt-16);
}

.voice-card__details dt {
  font-weight: normal;
}

.voice-card__details dt::before {
  content: '■';
}

.voice-card__details dd {
  margin: 0;
  text-align: right;
}

.voice-card__label {
  display: inline-block;
  margin-bottom: 0;
  padding: 4px 8px 3px;
  border-radius: 3px 3px 0 0;
  background-color: var(--clr-blue-02);
  color: var(--clr-white);
  font-size: var(--txt-16);
  font-weight: var(--fw-bold);
  line-height: 1;
}

.voice-card__comment {
  padding: 8px;
  border: 1px solid var(--clr-blue-02);
  background-color: var(--clr-light-blue);
}

.voice-card__link {
  display: block;
  margin-top: 12px;
  padding: 10px;
  background-color: var(--clr-orange);
  color: var(--clr-white);
  font-size: var(--txt-16);
  letter-spacing: var(--ls-medium);
  line-height: 1.2;
  text-align: center;
}

.voice-card__link:hover {
  color: var(--clr-white);
}

/**
 * よくある質問（アコーディオン）
 * ---------------------------------------- */
.faq__question {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  column-gap: 16px;
  border-bottom: 1px solid var(--clr-black);
  color: var(--clr-black-02);
  letter-spacing: var(--ls-medium);
  line-height: 1.4;
  list-style: none;
  cursor: pointer;
}

.faq__question::-webkit-details-marker {
  display: none;
}

.faq__questionText,
.faq__answerBody {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 14px;
}

.faq__icon {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 16'%3E%3Cpolyline points='1,1 16,15 31,1' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E") no-repeat center / contain;
  transition: transform 0.3s ease;
}

.faq__item.is-open .faq__icon {
  transform: scaleY(-1);
}

.faq__answer {
  display: grid;
  transition: grid-template-rows 0.3s ease;
}

.faq__answerInner {
  overflow: hidden;
}

.faq__answerBody {
  margin: 0;
  color: var(--clr-black-02);
  letter-spacing: var(--ls-medium);
  line-height: 1.4;
}

/**
 * リスト
 * ---------------------------------------- */
.list-none {
  margin: 0;
  padding: 0;
  list-style: none;
}

/**
 * CTAカード
 * ---------------------------------------- */
.cta-card {
  display: flex;
  align-items: center;
  box-sizing: border-box;
}

.cta-card--bg-orange {
  background-color: var(--clr-orange);
}

.cta-card--bg-blue {
  background-color: var(--clr-blue);
}

.cta-card--bg-line {
  background-color: var(--clr-line);
}

.cta-card--bg-gold {
  background-color: var(--clr-gold);
}

.cta-card__icon {
  display: block;
  flex-shrink: 0;
  height: auto;
}

.cta-card__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-grow: 1;
  min-width: 0;
}

.cta-card__label {
  display: block;
  width: 100%;
  background-color: var(--clr-white);
  color: var(--clr-black-02);
  line-height: var(--lh-small);
  letter-spacing: var(--ls-medium);
  text-align: center;
  box-sizing: border-box;
}

.cta-card__title {
  display: block;
  color: var(--clr-white);
  font-weight: var(--fw-medium);
  line-height: var(--lh-small);
  letter-spacing: var(--ls-medium);
  text-align: center;
}

/**
 * ボタン
 * ---------------------------------------- */
.button {
  position: relative;
  display: inline-flex;
  align-items: center;
  column-gap: 10px;
  background-color: var(--clr-black-02);
  box-sizing: border-box;
}

.button::after {
  content: '';
  display: inline-block;
  background-color: var(--clr-white);
  clip-path: polygon(100% 50%, 0 0, 0 100%);
}

.button--w-full {
  justify-content: center;
  width: 100%;
}

.button__text {
  color: var(--clr-white);
  font-weight: var(--fw-medium);
  line-height: var(--lh-small);
  letter-spacing: var(--ls-medium);
}

/**
 * max-width
 * ---------------------------------------- */
.maxw-1200 {
  max-width: 1200px;
}

.maxw-600 {
  max-width: 600px;
}

.maxw-582 {
  max-width: 582px;
}

/**
 * margin-top
 * ---------------------------------------- */
.mt-40 {
  margin-top: 40px;
}

.mt-4 {
  margin-top: 4px;
}

/**
 * margin-right、margin-left
 * ---------------------------------------- */
.mx-auto {
  margin-right: auto;
  margin-left: auto;
}

/**
 * PC
 * ---------------------------------------- */
@media screen and (min-width: 769px) {
  .br-sp {
    display: none;
  }

  /* グリッドレイアウト */
  .grid--pc-col-2 {
    grid-template-columns: repeat(2, 1fr);
  }

  .grid--pc-gap-x-32 {
    row-gap: 32px;
  }

  .grid--pc-gap-x-30 {
    row-gap: 30px;
  }

  .grid--pc-gap-y-40 {
    column-gap: 40px;
  }

  .grid--pc-gap-y-38 {
    column-gap: 38px;
  }

  .grid--pc-gap-x-42 {
    row-gap: 42px;
  }

  .grid--pc-gap-x-40 {
    row-gap: 40px;
  }

  .grid--pc-gap-x-38 {
    row-gap: 38px;
  }

  .grid--pc-gap-x-26 {
    row-gap: 26px;
  }

  /* 共通セクション */
  .section {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  /* 見出し */
  .heading--pc-fz-30 {
    font-size: var(--txt-30);
  }

  .heading--pc-fz-28 {
    font-size: var(--txt-28);
  }

  .heading--pc-fz-24 {
    font-size: var(--txt-24);
  }

  .heading--bb-navy {
    padding-bottom: 9px;
    padding-left: 25px;
  }

  /* 画像 */
  .image--badge {
    top: -35px;
    right: 56px;
    width: 200px;
  }

  /* タイトル（帯） */
  .title-band {
    min-height: 57px;
    padding-left: 70px;
    clip-path: polygon(0 0, 100% 0, calc(100% - 30px) 100%, 0 100%);
  }

  .title-band__text {
    font-size: var(--txt-32);
  }

  /* ステップ */
  .step__label {
    width: 179px;
    min-height: 33px;
    padding-left: 31px;
    font-size: var(--txt-28);
    clip-path: polygon(0 0, 100% 0, calc(100% - 20px) 100%, 0 100%);
  }

  /* ラベル大 */
  .step--label-lg .step__label {
    width: 315px;
    padding-left: 30px;
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: var(--txt-28);
  }

  /* テーブル */
  .table__col-head {
    width: 177px;
  }

  .table th,
  .table td {
    padding: 10px 19px;
  }

  .title-badge__image {
    width: 200px;
    margin-left: -34px;
  }

  .title-badge .heading {
    margin-left: -20px;
    padding-left: 30px;
  }

  /* 箇条書き（装飾画像付き） */
  .marker-list__item {
    column-gap: 22px;
    font-size: var(--txt-28);
  }

  /* よくある質問（アコーディオン） */
  .faq__question {
    padding: 23px 6px;
    font-size: var(--txt-19);
  }

  .faq__icon {
    width: 32px;
    height: 16px;
  }

  .faq__answerBody {
    padding: 27px 6px 24px;
    font-size: var(--txt-19);
  }

  .marker-list__item::before {
    width: 23px;
    height: 37px;
  }

  /* お客様の声 */
  .voice-card__title {
    min-height: 60px;
    padding: 9px 12px;
  }

  .voice-card__body {
    padding: 36px 12px 20px;
  }

  .voice-card__details {
    margin-top: 18px;
  }

  .voice-card__label {
    margin-top: 24px;
  }

  .step--media {
    display: grid;
    grid-template-columns: 1fr 490px;
    grid-template-rows: auto 1fr;
    padding-right: 20px;
  }

  .step--media > .image {
    grid-column: 2;
    grid-row: 1 / 3;
  }

  /* テキスト */
  .text--pc-fz-32 {
    font-size: var(--txt-32);
  }

  .text--pc-fz-28 {
    font-size: var(--txt-28);
  }

  .text--pc-fz-26 {
    font-size: var(--txt-26);
  }

  .text--pc-fz-25 {
    font-size: var(--txt-25);
  }

  .text--pc-fz-20 {
    font-size: var(--txt-20);
  }

  .text--pc-fz-15 {
    font-size: var(--txt-15);
  }

  .text--pc-lh-tight {
    line-height: var(--lh-tight);
  }

  .text__link {
    margin-left: 4px;
  }

  .text--bb-orange {
    padding-right: 20px;
    padding-left: 20px;
  }

  /* CTAカード */
  .cta-card {
    min-height: 89px;
    padding-top: 13px;
    padding-right: 20px;
    padding-bottom: 15px;
    padding-left: 20px;
  }

  /* アイコンはカード左端から30pxの位置 */
  .cta-card__icon {
    width: 72px;
    margin-left: 10px;
  }

  .cta-card__body {
    row-gap: 12px;
  }

  .cta-card__label {
    max-width: 266px;
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: var(--txt-16);
  }

  .cta-card__title {
    font-size: var(--txt-28);
  }

  /* ボタン */
  .button {
    min-height: 60px;
    padding-top: 10px;
    padding-right: 20px;
    padding-bottom: 10px;
    padding-left: 20px;
    column-gap: 12px;
  }

  .button::after {
    width: 19px;
    height: 22px;
  }

  .button__text {
    font-size: var(--txt-25);
  }

  /* margin-top */
  .mt-pc-133 {
    margin-top: 133px;
  }

  .mt-pc-80 {
    margin-top: 80px;
  }

  .mt-pc-75 {
    margin-top: 75px;
  }

  .mt-pc-50 {
    margin-top: 50px;
  }

  .mt-pc-45 {
    margin-top: 45px;
  }

  .mt-pc-40 {
    margin-top: 40px;
  }

  .mt-pc-38 {
    margin-top: 38px;
  }

  .mt-pc-36 {
    margin-top: 36px;
  }

  .mt-pc-32 {
    margin-top: 32px;
  }

  .mt-pc-30 {
    margin-top: 30px;
  }

  .mt-pc-24 {
    margin-top: 24px;
  }

  .mt-pc-20 {
    margin-top: 20px;
  }

  .mt-pc-10 {
    margin-top: 10px;
  }

  .mt-pc-8 {
    margin-top: 8px;
  }

  .mt-pc-5 {
    margin-top: 5px;
  }

  .mt-pc-4 {
    margin-top: 4px;
  }

  /* padding-top */
  .pt-pc-120 {
    padding-top: 120px;
  }

  .pt-pc-90 {
    padding-top: 90px;
  }

  .pt-pc-80 {
    padding-top: 80px;
  }

  .pt-pc-15 {
    padding-top: 15px;
  }

  /* padding-bottom */
  .pb-pc-90 {
    padding-bottom: 90px;
  }

  .pb-pc-80 {
    padding-bottom: 80px;
  }

  .pb-pc-75 {
    padding-bottom: 75px;
  }

  .pb-pc-50 {
    padding-bottom: 50px;
  }

  .pb-pc-45 {
    padding-bottom: 45px;
  }

  /* max-width */
  .maxw-pc-760 {
    max-width: 760px;
  }

  .maxw-pc-685 {
    max-width: 685px;
  }

  .maxw-pc-672 {
    max-width: 672px;
  }

  .maxw-pc-595 {
    max-width: 595px;
  }

  .maxw-pc-564 {
    max-width: 564px;
  }

  /* width（要素の幅を中身に合わせる場合） */
  .w-pc-fit {
    width: fit-content;
  }

  /* padding-left */
  .pl-pc-36 {
    padding-left: 36px;
  }

  .pl-pc-31 {
    padding-left: 31px;
  }

  /* padding-right、padding-left */
  .px-pc-90 {
    padding-right: 90px;
    padding-left: 90px;
  }

  .px-pc-80 {
    padding-right: 80px;
    padding-left: 80px;
  }

  .px-pc-56 {
    padding-right: 56px;
    padding-left: 56px;
  }

  .px-pc-45 {
    padding-right: 45px;
    padding-left: 45px;
  }

  .px-pc-37 {
    padding-right: 37px;
    padding-left: 37px;
  }

  .px-pc-18 {
    padding-right: 18px;
    padding-left: 18px;
  }

  .px-pc-13 {
    padding-right: 13px;
    padding-left: 13px;
  }

  /* padding-top、padding-bottom */
  .py-pc-30 {
    padding-top: 30px;
    padding-bottom: 30px;
  }

  .py-pc-12 {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .py-pc-10 {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .py-pc-8 {
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .py-pc-17 {
    padding-top: 17px;
    padding-bottom: 17px;
  }
}

/**
 * SP
 * ---------------------------------------- */
@media screen and (max-width: 768px) {
  /* 共通 */
  #breadcrumbs {
    padding-right: 15px;
    padding-left: 15px;
  }

  #contents section {
    width: initial;
    margin: initial;
    padding-bottom: 40px;
    clear: initial;
  }

  section > div:not(.accordion):not(.customersbox):not(.period):not(.form_t):not(.formlist):not(.titlebar_list):not(.titlebar_g):not(.pager):not(.required):not(.title):not(.formbox):not(.formbox_n):not(.title_c):not(.comment):not(.titlebar_g_o):not(.product_img):not(#sub_img):first-child {
    background: transparent;
    padding: initial;
  }

  [class*='col-'] {
    float: initial;
  }

  /* 改行 */
  .br-pc {
    display: none;
  }

  /* グリッドレイアウト */
  .grid--sp-gap-x-30 {
    row-gap: 30px;
  }

  .grid--sp-gap-x-20 {
    row-gap: 20px;
  }

  .grid--sp-gap-x-16 {
    row-gap: 16px;
  }

  .grid--sp-gap-x-6 {
    row-gap: 6px;
  }

  .grid--sp-gap-y-14 {
    column-gap: 14px;
  }

  /* 共通セクション */
  .section {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  /* 見出し */
  .heading--sp-fz-18 {
    font-size: var(--txt-18);
  }

  .heading--sp-fz-16 {
    font-size: var(--txt-16);
  }

  .heading--sp-fz-15 {
    font-size: var(--txt-15);
  }

  .heading--sp-lh-tight {
    line-height: var(--lh-tight);
  }

  .heading--bb-navy {
    padding-bottom: 6px;
    padding-left: 10px;
  }

  /* 画像 */
  .image--badge {
    top: 31px;
    right: -6px;
    width: 72px;
  }

  /* 点線の枠線（SPは破線） */
  .box--border-dotted {
    border: 2px dashed var(--clr-navy);
  }

  /* 背景画像（よくある質問） */
  .box--bg-faq {
    background-image: url('https://www.rasin.co.jp/support/img/replace/bg_faq_sp_01.jpg');
  }

  /* 背景画像（買い替えのベストタイミング） */
  .section--bg-timing {
    background-image: url('https://www.rasin.co.jp/support/img/replace/bg_timing_sp_01.jpg');
  }

  /* 背景画像（店頭の場合） */
  .box--bg-flow-shop {
    background-image: url('https://www.rasin.co.jp/support/img/replace/bg_flow_shop_sp_01.jpg');
  }

  /* 背景画像（通販サイトの場合） */
  .box--bg-flow-online {
    background-image: url('https://www.rasin.co.jp/support/img/replace/bg_flow_online_sp_01.jpg');
  }

  /* 背景画像（店頭以外でのご成約の場合） */
  .box--bg-coupon-online {
    background-image: url('https://www.rasin.co.jp/support/img/replace/bg_coupon_online_sp_01.jpg');
  }

  /* 背景画像（店頭買取にてご成約の場合） */
  .box--bg-coupon-shop {
    background-image: url('https://www.rasin.co.jp/support/img/replace/bg_coupon_shop_sp_01.jpg');
  }

  /* タイトル（帯） */
  .title-band {
    min-height: 24px;
    padding-left: 25px;
    clip-path: polygon(0 0, 100% 0, calc(100% - 14px) 100%, 0 100%);
  }

  .title-band__text {
    font-size: var(--txt-16);
  }

  /* ステップ */
  .step__label {
    width: 81px;
    min-height: 23px;
    padding-left: 10px;
    font-size: var(--txt-13);
    clip-path: polygon(0 0, 100% 0, calc(100% - 12px) 100%, 0 100%);
  }

  /* ラベル大 */
  .step--label-lg .step__label {
    width: 175px;
    font-size: var(--txt-16);
    white-space: nowrap;
  }

  /* テーブル */
  .table__col-head {
    width: 92px;
  }

  .table th,
  .table td {
    padding: 8px;
  }

  /* タイトル（バッジ付き） */
  .title-badge__image {
    width: 80px;
    margin-left: -6px;
  }

  .title-badge .heading {
    margin-left: -4px;
    padding-left: 10px;
  }

  /* 箇条書き（装飾画像付き） */
  .marker-list__item {
    column-gap: 10px;
    font-size: var(--txt-15);
    letter-spacing: 0;
  }

  .marker-list__item::before {
    width: 12px;
    height: 19px;
  }

  /* よくある質問（アコーディオン） */
  .faq__question {
    padding: 12px 0;
    font-size: var(--txt-16);
  }

  .faq__questionText,
  .faq__answerBody {
    column-gap: 8px;
  }

  .faq__icon {
    width: 22px;
    height: 11px;
  }

  .faq__answerBody {
    padding: 14px 0;
    font-size: var(--txt-16);
  }

  /* お客様の声 */
  .voice-card__title {
    min-height: 58px;
    padding: 8px 10px;
  }

  .voice-card__body {
    padding: 24px 10px 0;
  }

  .voice-card__details {
    margin-top: 14px;
  }

  .voice-card__label {
    margin-top: 18px;
  }

  /* テキスト */
  .text--sp-fz-16 {
    font-size: var(--txt-16);
  }

  .text--sp-fz-15 {
    font-size: var(--txt-15);
  }

  .text--sp-ls-none {
    letter-spacing: 0;
  }

  .text--sp-fz-13 {
    font-size: var(--txt-13);
  }

  .text--sp-lh-tight {
    line-height: var(--lh-tight);
  }

  .text--sp-lh-medium {
    line-height: var(--lh-medium);
  }

  .text__link {
    display: flex;
    width: fit-content;
    margin-top: 4px;
    margin-left: auto;
  }

  /* CTAカード */
  .cta-card {
    min-height: 40px;
    padding-top: 4px;
    padding-right: 6px;
    padding-bottom: 5px;
    padding-left: 6px;
    column-gap: 4px;
  }

  .cta-card__icon {
    width: 26px;
  }

  .cta-card__body {
    row-gap: 3px;
  }

  .cta-card__label {
    width: 90%;
    padding: 2px 10px;
    font-size: var(--txt-10);
    letter-spacing: 0;
    white-space: nowrap;
  }

  .cta-card__title {
    font-size: var(--txt-15);
    letter-spacing: 0;
    white-space: nowrap;
  }

  /* ボタン */
  .button {
    padding-top: 7px;
    padding-right: 12px;
    padding-bottom: 7px;
    padding-left: 12px;
  }

  .button::after {
    width: 10px;
    height: 12px;
  }

  .button__text {
    font-size: var(--txt-16);
    letter-spacing: 0.02em;
  }

  /* margin-top */
  .mt-sp-60 {
    margin-top: 60px;
  }

  .mt-sp-45 {
    margin-top: 45px;
  }

  .mt-sp-40 {
    margin-top: 40px;
  }

  .mt-sp-30 {
    margin-top: 30px;
  }

  .mt-sp-24 {
    margin-top: 24px;
  }

  .mt-sp-20 {
    margin-top: 20px;
  }

  .mt-sp-16 {
    margin-top: 16px;
  }

  .mt-sp-14 {
    margin-top: 14px;
  }

  .mt-sp-12 {
    margin-top: 12px;
  }

  .mt-sp-10 {
    margin-top: 10px;
  }

  .mt-sp-8 {
    margin-top: 8px;
  }

  .mt-sp-4 {
    margin-top: 4px;
  }

  /* padding-top */
  .pt-sp-36 {
    padding-top: 36px;
  }

  .pt-sp-20 {
    padding-top: 20px;
  }

  .pt-sp-15 {
    padding-top: 15px;
  }

  .pt-sp-0 {
    padding-top: 0;
  }

  /* padding-bottom */
  .pb-sp-40 {
    padding-bottom: 40px;
  }

  /* max-width */
  .maxw-sp-318 {
    max-width: 318px;
  }

  .maxw-sp-240 {
    max-width: 240px;
  }

  .maxw-sp-235 {
    max-width: 235px;
  }

  .maxw-sp-170 {
    max-width: 170px;
  }

  .maxw-sp-227 {
    max-width: 227px;
  }

  /* padding-right、padding-left */
  .px-sp-28 {
    padding-right: 28px;
    padding-left: 28px;
  }

  .px-sp-15 {
    padding-right: 15px;
    padding-left: 15px;
  }

  .px-sp-12 {
    padding-right: 12px;
    padding-left: 12px;
  }

  .px-sp-10 {
    padding-right: 10px;
    padding-left: 10px;
  }

  /* padding-top、padding-bottom */
  .py-sp-20 {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .py-sp-12 {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .py-sp-10 {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  /* margin-left */
  .ml-sp-15 {
    margin-left: 15px;
  }
}

/**
 * ホバー
 * ---------------------------------------- */
@media (hover: hover) {
  .cta-card,
  .button,
  .voice-card__link {
    transition: opacity 0.3s ease;
  }

  .cta-card:hover,
  .button:hover,
  .voice-card__link:hover {
    opacity: 0.7;
    text-decoration: none;
  }
}