:root{--sky:#52c2ef;--sky2:#dff8ff;--blue:#1573a7;--deep:#102f48;--ink:#213d50;--muted:#6f8795;--cream:#fff8df;--yellow:#ffd84f;--orange:#ffae35;--pink:#ff8fab;--white:#fff;--line:#d8edf5;--shadow:0 24px 60px rgba(17,92,132,.16);--radius:28px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{text-align:inherit;margin:0;font-family:'Noto Sans JP',system-ui,sans-serif;color:var(--ink);background:linear-gradient(180deg,#f2fcff 0,#fff 42%,#effaff 100%);line-height:1.75}
a{text-decoration:none;color:inherit}
section{width: inherit;}
footer section {
    max-width: 1150px;
    padding: 10px 0;
    margin: 0 auto;
        text-align: center;
}
section h1{text-align:inherit;}
.primary{background:linear-gradient(135deg,var(--yellow),var(--orange));color:#503800;box-shadow:0 16px 30px rgba(255,174,53,.28)}
.secondary{background:#fff;color:var(--blue);box-shadow:inset 0 0 0 2px #ccefff}
.btn:hover,.header-cta:hover{transform:translateY(-2px)}
.hero{position:relative;overflow:hidden;display:grid;grid-template-columns:1.02fr .98fr;gap:44px;padding:40px 7vw 100px;min-height:720px;background:radial-gradient(circle at 76% 24%,rgba(255,255,255,.82) 0 11%,transparent 30%),linear-gradient(135deg,#e9fbff 0,#bdefff 58%,#fff3bd 100%);}
.hero:after{content:"";position:absolute;left:-8%;right:-8%;bottom:-180px;height:300px;background:#fff;border-radius:50% 50% 0 0}
.hero-copy,.hero-visual{position:relative;z-index:1}
.eyebrow,.section-title p{margin:0;color:var(--blue);font-weight:900;letter-spacing:.16em;font-size:14px;text-transform:uppercase}
.hero h1{margin:18px 0 22px;font-family:游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, arial, helvetica;font-size:clamp(42px,5.6vw,76px);line-height:1.08;color:var(--deep);letter-spacing:-.04em}
.hero h1 span{background:linear-gradient(transparent 62%,rgba(255,216,79,.8) 0)}
.lead{max-width:640px;font-size:20px;font-weight:700;color:#385b70}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:34px 0}
.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:620px}
.hero-stats div{padding:18px;border-radius:22px;background:rgba(255,255,255,.78);box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.9)}
.hero-stats strong{display:block;font-size:30px;line-height:1;color:var(--blue);font-family:游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, arial, helvetica;}
.hero-stats span{display:block;margin-top:4px;color:var(--muted);font-weight:900;font-size:13px}
.hero-visual{min-height:560px}.compare-card{position:absolute;width:280px;padding:26px;border-radius:30px;box-shadow:var(--shadow)}
.compare-card b{display:block;margin-bottom:14px;font-family:游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, arial, helvetica;;font-size:25px}
.compare-card span{display:block;margin-top:10px;padding:11px 14px;border-radius:14px;font-weight:800}
.compare-card.other{left:310px;right:inherit;bottom:0px;background:#fff;color:#8a6b73;transform:rotate(4deg)}
.compare-card.other span{background:#fff1f4}
.compare-card.ours{left:0px;right:auto;bottom:0px;background:linear-gradient(135deg,#1592c9,#52c2ef);color:#fff;transform:rotate(-5deg)}
.compare-card.ours span{background:rgba(255,255,255,.2)}
.vs{z-index:20;position:absolute;left:290px;bottom:5%;transform:translate(-50%,-50%);width:80px;height:80px;border-radius:50%;display:grid;place-items:center;background:var(--yellow);font-family:游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, arial, helvetica;;font-size:42px;font-weight:900;color:#6b4a00;box-shadow:0 18px 36px rgba(255,174,53,.28)}
.section{padding:92px 7vw}
.compact{padding-top:58px}
.section-title{text-align:center;margin-bottom:42px}
.section-title.left{text-align:left}
.section-title h2{margin:.25em auto 0;max-width:900px;font-family:游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, arial, helvetica;font-size:clamp(30px,4vw,50px);line-height:1.25;color:var(--deep)}
.section-title.left h2{margin-left:0}
.table-wrap{overflow:auto;border-radius:34px;background:#fff;box-shadow:var(--shadow);border:1px solid var(--line)}
.compare-table{width:100%;min-width:760px;border-collapse:separate;border-spacing:0}
.compare-table th{padding:24px 22px;background:var(--deep);color:#fff;font-size:18px;text-align:left}
.compare-table th:first-child{border-top-left-radius:32px}
.compare-table th:last-child{border-top-right-radius:32px;background:linear-gradient(135deg,var(--blue),var(--sky))}
.compare-table td{padding:22px;border-bottom:1px solid var(--line);vertical-align:middle;font-weight:700}
.compare-table td:first-child{width:18%;color:var(--blue);font-weight:900}
.compare-table td:nth-child(2){width:35%;color:#7d7f86;background:#fbfbfb}
.compare-table td:nth-child(3){position:relative;background:#f0fbff;color:var(--deep);font-size:18px}
.compare-table td:nth-child(3):before{content:"◎";margin-right:8px;color:var(--orange);font-weight:900}
.caption{text-align:right;color:var(--muted);font-size:13px}
.switch-grid,.voice-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.service-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}
.switch-grid article,.service-grid article,.voice-grid article{padding:30px;border-radius:var(--radius);background:#fff;box-shadow:var(--shadow);margin-bottom: 10%;}
.switch-grid span{display:inline-grid;place-items:center;width:50px;height:50px;border-radius:16px;background:var(--sky2);color:var(--blue);font-size:24px;font-weight:900}
.switch-grid h3,.service-grid h3, .voice-grid h3{margin:18px 0 8px;color:var(--deep);font-size:23px}
.switch-grid p,.service-grid p{margin:0;color: #000; font-weight: normal;margin-top:5%;}
.card-header {
  display: flex;
  align-items: center; /* 上下中央揃え */
  gap: 12px;           /* 数字とタイトルの間の余白 */
}

/* h3のデフォルトのマージンを消去 */
.card-header h3 {
  margin: 0;
}
.quality{display:grid;grid-template-columns:.95fr 1.05fr;gap:50px;align-items:center;background:linear-gradient(135deg,#fff,#ebfbff)}
.quality h2{margin:12px 0 20px;font-family:游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, arial, helvetica;;font-size:clamp(32px,4vw,54px);line-height:1.2;color:var(--deep)}
.quality p{font-size:18px;font-weight:700;color:#4b697b}
.quality ul{padding:0;margin:24px 0 0;list-style:none}
.quality li{position:relative;margin-top:12px;padding:14px 16px 14px 46px;border-radius:16px;background:#fff;box-shadow:0 10px 28px rgba(17,92,132,.08);font-weight:900}
.quality li:before{content:"✓";position:absolute;left:17px;color:var(--orange);font-weight:900}.fold-visual{position:relative;min-height:430px}
.emblem_wrap {
    display: flex;
    margin: 5% auto;
    width: 100%;
}
.emblem_wrap img{
    width: 100%;
}
.fold{position:absolute;left:8%;padding: 20px;border-radius:24px;background:#fff;box-shadow:0 18px 34px rgba(17,92,132,.13)}
.f1{top:0px; right: 26%;}
.f2{top:120px;left:16%;right:8%;}
.f3{top:240px;right:18%;}
.f4{top:370px;left:18%;right:14%;}
/* --- 追加する吹き出し用CSS --- */
.fold::after {
  content: "";
  position: absolute;
  bottom: -10px; /* 吹き出しの下側に配置 */
  left: 30px;    /* しっぽの位置（左からの距離） */
  border-width: 10px 8px 0 8px; /* 三角形のサイズ */
  border-style: solid;
  border-color: #fff transparent transparent transparent; /* 上辺のみ白にして下向き三角形を作成 */
}
/* 右寄せの吹き出し（f1, f3など）のしっぽを右側に寄せたい場合の調整 */
.f1::after, .f3::after {
  left: auto;
  right: 30px;
}
.tag{position:absolute;right:0;top:22px;width:148px;height:148px;border-radius:50%;display:grid;place-items:center;text-align:center;background:var(--yellow);font-family:游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, arial, helvetica;;font-size:32px;font-weight:900;color:#624500;box-shadow:0 18px 36px rgba(255,174,53,.25)}
.tag small{display:block;font-size:13px}
.bag,.compare{background:#fff}
.bag-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:42px;align-items:center}
.bag-illust{position:relative;min-height:380px;border-radius:42px;box-shadow:var(--shadow);display:grid;place-items:center;text-align:center;color:#fff}
.bag-illust .handle{position:absolute;top:-42px;width:150px;height:96px;border:19px solid #1687bd;border-bottom:0;border-radius:90px 90px 0 0}
.bag-illust strong{font-family:游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, arial, helvetica;;font-size:88px;line-height:1;text-shadow:0 6px 20px rgba(16,47,72,.15)}
.bag-illust span{display:block;margin-top:95px;position:absolute;font-weight:900;font-size:18px}
.bag-points{display:grid;gap:18px}
.bag-points div{padding:24px;border-radius:24px;background:linear-gradient(135deg,#f4fcff,#fff);border:1px solid var(--line)}
.bag-points b{display:inline-block;margin-bottom:8px;padding:5px 14px;border-radius:999px;background:var(--yellow);color:#654900}
.bag-points p{margin:0;font-weight:700}
.service-grid{grid-template-columns:repeat(5,1fr)}
.voice{background:linear-gradient(135deg,#f2fcff,#fff8df)}
.voice-grid{grid-template-columns:repeat(3,1fr)}
.voice-grid div{font-size:22px;color:#ffb400}
.voice-grid p{color: #000; font-weight: normal;margin-top:5%;}
.voice-grid span{color:var(--blue);font-weight:900}
.final-cta{margin:42px 7vw 82px;padding:72px 30px;text-align:center;border-radius:42px;background:linear-gradient(135deg,#fff2b9,#d6f7ff);box-shadow:var(--shadow)}
/*.final-cta p{margin:0;color:var(--blue);font-weight:900}*/
.final-cta h2{margin:8px 0 24px;font-family:游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, arial, helvetica;;font-size:clamp(34px,5vw,56px);line-height:1.2;color:var(--deep)}
.hero {
  position: relative;
  width: 100%;
  min-height: 720px; /* 現在の高さに合わせて調整 */
  background-image: url('../img/clp_top_pc.jpg');
  background-repeat: no-repeat;
  background-size: 100% auto; /* 横幅100% */
  background-position: center center; /* 上下左右中央 */
  overflow: hidden;
}

/* コンテンツを画像の上に表示 */
.hero .hero-inner {
  position: relative;
  z-index: 2;
}
.hero {
  position: relative;
  overflow: hidden;
  margin-top:80px;
}

.hero-person {
  position: absolute;
  right: 40px;
  bottom: 0;
}
.hero-bags {
    position: absolute;
    left: 180px;
    bottom: 200px;
    z-index: 20;
}
.hero-baga {
    position: absolute;
    left: 500px;
    bottom: 190px;
    z-index: 19;
}
.hero-bags img, .hero-baga img{
  width: 100px;
}
.hero-person {
  opacity: 0;
  transform: translateY(120px);

  transition:
      transform 0.8s cubic-bezier(.17,.84,.44,1),
      opacity 0.8s ease;

  z-index: 10;
}

.hero-person.show {
  opacity: 1;
  transform: translateY(0);
}

.hero-person img {
  width: 200px;
  display: block;
}
@media (max-width:980px){
  .hero,.quality,.bag-layout{grid-template-columns:1fr}
  .hero{min-height:auto}.hero-visual{min-height:500px}
  .switch-grid,.service-grid{grid-template-columns:repeat(2,1fr)}
}
  @media (max-width:680px){
    .site-header{padding:12px 20px}
    .header-cta{display:none}.hero,
    .section{padding-left:22px;padding-right:22px}
    .hero h1{font-size:35px}
    .hero .lead{font-size:14px}
    .hero-stats,.switch-grid,.service-grid,.voice-grid{grid-template-columns:1fr}
    .hero .hero-inner {min-height: 600px;}
    .hero-visual{min-height:400px}
    .compare-card{width:200px;padding:10px;border-radius: 10px;}
    .compare-card.ours{right: inherit;left: 4px; top: 30px;bottom: inherit;}
    .compare-card.other{left:inherit;right:0;top:200px;bottom: inherit;}
    .compare-card span {
    display: block;
    margin-top: 5px;
    padding: 5px 5px;
    border-radius: 5px;
    font-weight: 400;
    font-size: 13px;
    }
    .compare-card b {
    font-size: 15px;
    margin-bottom: 0px;
    }
    .vs{width: 75px;
        height: 75px;
        font-size: 30px;
        left: 80px;
    top: 240px;}
    .emblem_wrap {margin-top: 180px;}
    .quality{padding-top:0px}
    .fold-visual{min-height:360px}
    .tag{width:116px;height:116px;font-size:25px}
    .final-cta{margin-left:22px;margin-right:22px;padding:0;}
    .hero-baga {
    left: inherit;
    top: 170px;
    right:0;
    }
    .hero-bags {
    right: 30px;
    left:inherit;
    top: 20px;
    }
    .hero{margin-top:0px;}
    .quality p {
      font-size: 12px;
      font-weight: normal;
    }

    .fold{left:5%;padding: 5px 10px;border-radius:12px;}
.f1{top:0px; right: 12%;}
.f2{top:80px;left:12%;right:8%;}
.f3{top:160px;right:12%;}
.f4{top:240px;left:12%;right:12%;}
.section{padding:45px 7vw}
.switch-grid,.voice-grid{gap:0px}
.service-grid{gap:0px}
.switch-grid article,.service-grid article,.voice-grid article{padding:15px;border-radius:10px;margin-bottom: 5%;}
.switch-grid h3,.service-grid h3, .voice-grid h3{margin:8px 0 8px;color:var(--deep);font-size:20px}
}

.compare-mobile{display:none}
/* ========================================
   COMPARE
======================================== */

.compare-list {
  max-width: 1100px;
  margin: 40px auto 0;
}


/* 1つの比較項目 */
.compare-item {
  display: grid;
  grid-template-columns: 20% 40% 40%;
  align-items: stretch;
  /*max-width:1200px;*/
  margin: 0 auto 25px;

  border: 1px solid #dcebf5;
  border-radius: 16px;
  overflow: hidden;

  background: #fff;
  box-shadow: 0 5px 20px rgba(0, 80, 130, 0.06);
}


/* ========================================
   比較項目名
======================================== */

.compare-item__title {
  display: flex;
  align-items: center;
  justify-content: center;

  padding: 25px 15px;

  background: #f8fcff;
  border-right: 1px solid #dcebf5;

  text-align: center;
}

.compare-item__title h3 {
  margin: 0;

  color: #168bd2;

  font-size: 30px;
  font-weight: 700;
}


/* ========================================
   一般的な洗濯代行
======================================== */

.compare-item__normal {
  padding: 20px;
  position:relative;
  border-right: 1px solid #dcebf5;

  color: #666;
}


/* ========================================
   しろふわ便
======================================== */

.compare-item__shirofuwa {
  padding: 20px;
  position:relative;
  background: #f0f9ff;
}


/* ========================================
   比較画像
======================================== */

.compare-item__image {
  display: block;

  width: 100%;
  height: 200px;

  margin-top: 15px;

  object-fit: cover;

  border-radius: 10px;
}


/* ========================================
   ラベル
======================================== */

.compare-label {
  display: inline-block;

  padding: 5px 12px;

  border-radius: 30px;

  font-size: 12px;
  font-weight: 700;
}

.compare-label--normal {
  background: #eeeeee;
  color: #777;
}

.compare-label--shirofuwa {
  background: #168bd2;
  color: #fff;
}


/* ========================================
   テキスト
======================================== */

.compare-item__normal p,
.compare-item__shirofuwa p {
  margin: 15px 0 0;

  font-size: 15px;
  line-height: 1.8;
}

.compare-item__shirofuwa strong {
  color: #0787d1;
}

/* --- 既存コードの修正 --- */
.compare-item__title {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 25px 15px;
  background: #f8fcff;
  border-right: 1px solid #dcebf5;
  text-align: center;
}

.compare-item__title h3 {
  position: relative;
  margin: 0;
  z-index: 1; /* 円の上に文字をのせる */
  display: flex;
  flex-direction: column; /* 英字と日本語を上下並びに */
  align-items: center;
  gap: 2px; /* POINTと畳み品質の間隔 */
}

/* --- 上の英字（キャプション） --- */
.compare-item__title h3::after {
  content: "POINT";
  order: -1; /* 文字の上に配置 */
  font-size: 10px;
  font-weight: bold;
  color: #2389d7; /* アクセントカラー */
  letter-spacing: 0.1em;
}

/* --- 文字の背景に重ねる正円 --- */
.compare-item__title h3::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* 中央寄せ */
  width: 5.5em;            /* 正円の直径 */
  aspect-ratio: 1 / 1; /* 縦横比を1:1（正円）に固定 */
  border-radius: 50%;
  background: #e3f2fd;    /* 正円の色（淡い水色） */
  opacity: 0.6;           /* 少し透けさせて馴染ませる */
  z-index: -1;            /* 文字の後ろに配置 */
}
/* --- 親要素に相対配置を指定 --- */
.compare-item_normal,
.compare-item_shirofuwa {
  position: relative; /* 子要素の絶対配置の基準点にする */
}

/* --- ラベル（span）を画像の上に重ねる --- */
.compare-label {
  position: absolute;
  top: 10px;          /* 画像の上端からの距離（要微調整） */
  left: 10px;         /* 画像の左端からの距離（要微調整） */
  z-index: 2;         /* 画像より前面に表示 */
  
  /* 既存のスタイル */
  display: inline-block;
  padding: 5px 12px;
  border-radius: 30px;
  font-size: 12px;
  font-weight: 700;
}

/* 既存の個別カラー指定 */
.compare-label--shirofuwa {
  background: #168BD2;
  color: #fff;
}

/* ========================================
   SP
======================================== */

@media (max-width: 768px) {

  .compare-list {
    margin-top: 25px;
  }

  .compare-item {
    display: block;

    margin-bottom: 25px;

    border-radius: 14px;
  }


  /* 比較項目タイトル */

  .compare-item__title {
    padding: 12px 15px;

    border-right: none;
    border-bottom: 1px solid #dcebf5;

    background: #168bd2;
  }

  .compare-item__title h3 {
    color: #fff;
    font-size: 17px;
  }


  /* 一般的な洗濯代行 */

  .compare-item__normal {
    padding: 15px;

    border-right: none;
    border-bottom: 1px solid #dcebf5;

    background: #f7f7f7;
  }


  /* しろふわ便 */

  .compare-item__shirofuwa {
    padding: 15px;

    background: #f0f9ff;
  }


  /* 画像 */

  .compare-item__image {
    height: auto;
    aspect-ratio: 16 / 9;

    margin-top: 0px;

    object-fit: cover;
  }


  /* テキスト */

  .compare-item__normal p,
  .compare-item__shirofuwa p {
    margin-top: 10px;

    font-size: 14px;
    line-height: 1.7;
  }
.compare-item__title h3::before {
  background: none;    /* 正円の色（淡い水色） */
}
.compare-item__title h3::after {
    color: #fff;
}
}


@media (max-width:680px){
  .comparison .section-title{margin-bottom:24px;text-align:left}
  .comparison .section-title h2{font-size:31px;line-height:1.32}
  .comparison .table-wrap{display:none}
  .compare-mobile{display:grid;gap:16px}
  .compare-mobile article{position:relative;overflow:hidden;padding:18px;border-radius:24px;background:#fff;box-shadow:0 16px 40px rgba(17,92,132,.13);border:1px solid var(--line)}
  .compare-mobile article:before{content:"COMPARE";position:absolute;right:-24px;top:12px;font-size:38px;font-weight:900;color:rgba(82,194,239,.11);letter-spacing:.08em}
  .compare-mobile h3{position:relative;margin:0 0 12px;display:inline-flex;align-items:center;gap:8px;color:var(--deep);font-family:游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, arial, helvetica;font-size:21px;line-height:1.3}
  .compare-mobile h3:before{content:"✓";display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--yellow);color:#6b4a00;font-family:'Noto Sans JP',sans-serif;font-size:16px;font-weight:900}
  .vs-row{position:relative;display:grid;grid-template-columns:1fr;gap:8px}
  .vs-row p{margin:0;padding:12px 13px 12px 82px;border-radius:16px;background:#f7f7f7;color:#7b8790;font-size:13px;font-weight:800;line-height:1.55}
  .vs-row p span{position:absolute;left:13px;display:inline-flex;align-items:center;justify-content:center;width:58px;min-height:24px;border-radius:999px;background:#e9edf0;color:#66737d;font-size:11px;font-weight:900}
  .vs-row .win{padding:15px 14px 15px 92px;background:linear-gradient(135deg,#eafaff,#fff8df);color:var(--deep);font-size:15px;border:2px solid #bfeeff;box-shadow:0 10px 24px rgba(21,115,167,.12)}
  .vs-row .win:after{content:"おすすめ";position:absolute;right:14px;top:50%;transform:translateY(-50%);padding:3px 8px;border-radius:999px;background:var(--orange);color:#fff;font-size:10px;font-weight:900;line-height:1.2}
  .vs-row .win span{left:13px;width:68px;background:var(--blue);color:#fff}
  .caption{text-align:left;font-size:12px;line-height:1.5}
  .hero {
    min-height: 620px;
  background-image: url('../img/clp_top_sp.jpg');
    /* スマホは画像の縦横比を維持しつつ中央表示 */
    background-position: top center;
    padding: 20px 7vw;
}
.hero-person {
right: inherit;
        left: 5px;
        bottom: 0;
}

.hero-person img {
  width: 120px;
}
}
.price_new {
    text-align: center;
    max-width: 1200px;
}
.top_extra .limited_wrap {
    height: 246px;
}
.column-1 {
  max-width: 1200px;
  text-align:center;
}
a.btn-c {
  width: 100%;
    max-width: inherit;
}
.review_lp .user {
margin:0 auto;
}
@media (max-width:680px){
    .column-1{
width:100%;
    }
    .top_extra .limited_wrap {
    height: 208px;
}
  }

  /* 比較項目名 */
.compare-item__title {
  grid-column: 1;
}

/* しろふわ便を左側へ */
.compare-item__shirofuwa {
  grid-column: 2;
  grid-row: 1;
}

/* 一般的な洗濯代行を右側へ */
.compare-item__normal {
  grid-column: 3;
  grid-row: 1;
}

@media (max-width: 768px) {

  .compare-item {
    display: flex;
    flex-direction: column;
  }

  /* POINT・項目名 */
  .compare-item__title {
    order: 1;
  }

  /* しろふわ便を先に */
  .compare-item__shirofuwa {
    order: 2;
  }

  /* 洗濯代行A社を後に */
  .compare-item__normal {
    order: 3;
  }

}