@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/*TOP画像下の余白を削除*/
.top #content {
    padding-top: 1em;
}


/*固定ページ画像下の余白を削除*/
.l-mainContent__inner>.post_content {
margin: em 0;
padding: 0 var(--swl-pad_post_content, 0);
}
/*TOPメッセージ(スマホ用)*/
@media (max-width: 600px){
.top-msg span {
 font-size:25px!important;
}
}

/*ヘッダーフォント*/
.c-gnav>.menu-item>a .ttl {
    display: block;
font-size: 15px;
}


/* 見出しの上下のボーダー除去 */
h2::before,
h2::after{
  content:none !important;
  display:none !important;
}

/* もし「見出しブロック（h3等）」で作っている場合にも効かせる */
h2{
  border:0 !important;
}
h2::before,
h2::after,
{
  content:none !important;
  display:none !important;
}


/* 電話番号表示用オレンジボタン */
.cta-tel-btn{
  --the-btn-color: #F28C2A;
  --the-btn-color2: #F6A24D;
  --the-solid-shadow: rgba(242, 140, 42, 0.6);
}






/* =========================
   お知らせ（Query Loop最終版）
   対象：.lp-news（セクション） + .lp-newsBox（カード）
   ========================= */

/* セクション余白（他セクションにも使っているならlp-sec側に寄せてOK） */
.lp-news{ padding:44px 0; }
@media (max-width: 782px){ .lp-news{ padding:32px 0; } }

/* 見出し（左）＆一覧リンク（右） */
.lp-news .lp-sec__eyebrow{
  color:#e18a45;
  font-weight:800;
  font-size:13px;
  letter-spacing:.08em;
  margin:0;
}
.lp-news .lp-link{ margin:0; }
.lp-news .lp-link a{
  color:#e18a45;
  text-decoration:none;
  font-weight:800;
}

/* カード枠 */
.lp-news .lp-newsBox{
  background:#fff;
  border-radius:18px;
  padding:14px 16px;
  border:1px solid rgba(0,0,0,.05);
  box-shadow:0 10px 24px rgba(0,0,0,.04);
}

/* Query Loop ul/li のリセット */
.lp-news .lp-newsBox ul.wp-block-post-template{
  list-style:none;
  padding:0;
  margin:0;
}
.lp-news .lp-newsBox ul.wp-block-post-template > li{
  margin:0;
  padding:8px 0;
}
.lp-news .lp-newsBox ul.wp-block-post-template > li:last-child{
  padding-bottom:0;
}

/* 1件の行（Columnsをflexで固定） */
.lp-news .lp-newsBox ul.wp-block-post-template > li .wp-block-columns{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0;
}
.lp-news .lp-newsBox ul.wp-block-post-template > li .wp-block-columns > .wp-block-column{
  margin:0;
}

/* 3カラム比率（日付 / バッジ / タイトル） */
.lp-news .lp-newsBox ul.wp-block-post-template > li .wp-block-columns > .wp-block-column:nth-child(1){
  flex:0 0 105px;
}
.lp-news .lp-newsBox ul.wp-block-post-template > li .wp-block-columns > .wp-block-column:nth-child(2){
  flex:0 0 80px;
}
.lp-news .lp-newsBox ul.wp-block-post-template > li .wp-block-columns > .wp-block-column:nth-child(3){
  flex:1 1 auto;
  min-width:0;
}

/* 日付 */
.lp-news .lp-newsBox .wp-block-post-date{
  margin:0;
  color:#9a9a9a;
  font-size:12px;
  white-space:nowrap;
}

/* カテゴリ（バッジ化） */
.lp-news .lp-newsBox .wp-block-post-terms{
  margin:0;
}
.lp-news .lp-newsBox .wp-block-post-terms a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:4px 10px;
  border-radius:999px;
  background:#f3f3f3;
  color:#777;
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
  text-decoration:none;
}

/* タイトル（SWELLの装飾線を完全無効化） */
.lp-news .lp-newsBox .wp-block-post-title{
  margin:0;
  padding:0;
  border:0;
  background:none;
  box-shadow:none;
  line-height:1.6;
  font-size:14px;
  font-weight:700;
}
.lp-news .lp-newsBox .wp-block-post-title a{
  color:#333;
  text-decoration:none;
  border:0;
  background:none;
  box-shadow:none;
  background-image:none;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2; /* 2行まで */
  overflow:hidden;
}
.lp-news .lp-newsBox .wp-block-post-title::before,
.lp-news .lp-newsBox .wp-block-post-title::after,
.lp-news .lp-newsBox .wp-block-post-title a::before,
.lp-news .lp-newsBox .wp-block-post-title a::after{
  content:none;
  display:none;
}
.lp-news .lp-newsBox .wp-block-post-title a:hover{ opacity:.75; }

/* 区切り線（最後は非表示） */
.lp-news .lp-newsBox hr.wp-block-separator{
  width:100%;
  margin:8px 0;
  opacity:.18;
}
.lp-news .lp-newsBox ul.wp-block-post-template > li:last-child hr.wp-block-separator{
  display:none;
}

/* スマホ：タイトルは下に回す */
@media (max-width: 600px){
  .lp-news .lp-newsBox{ padding:12px 12px; }
  .lp-news .lp-newsBox ul.wp-block-post-template > li .wp-block-columns{
    flex-wrap:wrap;
    gap:10px 12px;
  }
  .lp-news .lp-newsBox ul.wp-block-post-template > li .wp-block-columns > .wp-block-column:nth-child(1),
  .lp-news .lp-newsBox ul.wp-block-post-template > li .wp-block-columns > .wp-block-column:nth-child(2){
    flex:0 0 auto;
  }
  .lp-news .lp-newsBox ul.wp-block-post-template > li .wp-block-columns > .wp-block-column:nth-child(3){
    flex:1 1 100%;
  }
}

/* ===== 1行内の縦ズレを解消（高さを揃えて中央配置） ===== */
.lp-news .lp-newsBox .wp-block-post-date,
.lp-news .lp-newsBox .wp-block-post-terms,
.lp-news .lp-newsBox .wp-block-post-title{
  display:flex;
  align-items:center;
  min-height: 32px;   /* ここを基準高さに（好みで 30〜34） */
}

/* タイトルは2行クリップのため block/box を維持しつつ、縦位置は親で揃える */
.lp-news .lp-newsBox .wp-block-post-title a{
  line-height: 1.6;   /* ここは好み。ズレ防止で固定 */
}

/* バッジの中身も中央に */
.lp-news .lp-newsBox .wp-block-post-terms a{
  height: 24px;       /* バッジ高さ固定 */
  padding: 0 10px;    /* 高さ固定したので上下paddingは0へ */
  display:inline-flex;
  align-items:center;
}


/* =========================
   お知らせ：行間を詰める
   ========================= */

/* 1行ごとの上下余白をさらに詰める */
.lp-news .lp-newsBox ul.wp-block-post-template > li{
padding: 1px 0;   /* ← 8px → 4px に */
}

/* 区切り線の上下余白も縮小 */
.lp-news .lp-newsBox hr.wp-block-separator{
  margin: 0 0;
  opacity: .15;
}


/* =========================
   お知らせ：バッジをパステルカラーに
   ========================= */

/* カテゴリバッジ（全体） */
.lp-news .lp-newsBox .wp-block-post-terms a{
  background: #E9F5F0;
  color: #2F7F67;
  border: 1px solid #CFEAE0;
}

/* もし将来カテゴリ別で色分けしたい場合の例 */
/*
.lp-news .wp-block-post-terms a[href*="news"]{
  background:#FFF2E6;
  color:#E18A45;
  border-color:#FFE1C7;
}
.lp-news .wp-block-post-terms a[href*="campaign"]{
  background:#EEF3FF;
  color:#5A77D6;
  border-color:#DCE4FF;
}
*/


/* カテゴリバッジも同様に */
.lp-news .lp-newsBox .wp-block-post-terms a{
  margin:0 !important;
  flex:0 0 auto !important;
}

/* もしまだ左に寄るなら「カテゴリ列（2列目）」自体の内側余白を少し足す */
.lp-news .lp-newsBox ul.wp-block-post-template > li
.wp-block-columns > .wp-block-column:nth-child(2){
  padding-left: 6px;           /* 0〜10pxで微調整 */
}


/* 日付とバッジ（列間）を詰める */
.lp-news .lp-newsBox ul.wp-block-post-template > li .wp-block-columns{
gap: 4px;  /* 12px → 6px（好みで 4〜8） */
}


/* 日付列の固定幅を詰める（空白自体を減らす） */
.lp-news .lp-newsBox ul.wp-block-post-template > li
.wp-block-columns > .wp-block-column:nth-child(1){
  flex: 0 0 88px; /* 105px → 92px（88〜96で調整） */
}



/* 日付⇔バッジをもっと詰める（最優先） */
.lp-news .lp-newsBox ul.wp-block-post-template > li .wp-block-columns{
  gap: 2px !important;      /* 4px→2px（1〜3で好み） */
}

/* 2列目の左余白をゼロに（←今の padding-left:6px が原因） */
.lp-news .lp-newsBox ul.wp-block-post-template > li
.wp-block-columns > .wp-block-column:nth-child(2){
  padding-left: 0 !important;
}

/* 日付列をさらに細く（必要なら） */
.lp-news .lp-newsBox ul.wp-block-post-template > li
.wp-block-columns > .wp-block-column:nth-child(1){
  flex: 0 0 84px !important; /* 88→84（80〜86で調整） */
}



/* =========================
   お知らせ：横幅を強制的に広げる（SWELL総当たり）
   ========================= */

/* お知らせブロック内の “幅制限コンテナ” を解除（よくあるクラスを全部） */
.lp-news :where(
  .l-container,
  .c-container,
  .p-section__inner,
  .wp-block-group__inner-container,
  .swell-block-fullWide__inner,
  .swell-block-fullWide__body,
  .swell-block-fullWide__content,
  .swell-block-fullWide__inner > div
){
  max-width: none !important;
  width: 100% !important;
}

/* カード（白い箱）自体を広げる */
.lp-news .lp-newsBox{
  width: 100% !important;
  max-width: 1200px !important; /* ←下のエリアに合わせて調整（例: 1100/1200/1280） */
  margin-left: auto !important;
  margin-right: auto !important;
}


/* お知らせカードに左アクセントライン */
.lp-news .lp-newsBox{
  position: relative;
  padding-left: 24px; /* ライン分だけ内側余白を増やす */
}

.lp-news .lp-newsBox::before{
  content:"";
  position:absolute;
  left:0;
  top:14px;
  bottom:14px;
  width:4px;
  border-radius:4px;
  background: linear-gradient(to bottom, #f4b183, #e18a45);
}









/* =========================
   私たちのこだわり（lp-kodawari）
   ========================= */
.lp-kodawari{
  padding: 56px 0;
  background: #F7F1E9; /* 薄いベージュ */
}
@media (max-width: 782px){
  .lp-kodawari{ padding: 40px 0; }
}

.lp-kodawari__inner{
  padding: 0 16px;
}

.lp-kodawari__eyebrow{
  display: inline-block;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .06em;
  color: #E6863B; /* オレンジ系 */
  background: #fff;
  border-radius: 999px;
  padding: 6px 12px;
  margin: 0 0 12px;
}

.lp-kodawari__ttl{
  margin: 0 0 14px;
  line-height: 1.35;
}
.lp-kodawari__lead{
  margin: 0 0 18px;
  color: rgba(0,0,0,.72);
  line-height: 1.9;
}

/* バッジ */
.lp-kodawari__badges{
  gap: 10px 12px;
  margin-top: 8px;
}
.lp-kodawariBadge{
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 999px;
  padding: 12px 14px;
  gap: 10px;
  box-shadow: 0 6px 18px rgba(0,0,0,.05);
  align-items: center;
}
.lp-kodawariBadge__icon{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: #FFF3E8;
  position: relative;
}
.lp-kodawariBadge__icon::after{
  content:"";
  position:absolute;
  inset: 10px;
  border-radius: 6px;
  background: #E6863B;
  opacity: .9;
}
.lp-kodawariBadge__ttl{
  margin: 0;
  font-weight: 800;
  font-size: 13px;
  line-height: 1.2;
}
.lp-kodawariBadge__desc{
  margin: 2px 0 0;
  font-size: 12px;
  color: rgba(0,0,0,.65);
  line-height: 1.35;
}

/* 右側コラージュ */
.lp-kodawariCollage{
  position: relative;
  padding: 18px 0;
}
.lp-kodawariCollage__main img{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 18px;
  box-shadow: 0 18px 40px rgba(0,0,0,.12);
}
.lp-kodawariCollage__sub{
  position: absolute;
  background: #fff;
  padding: 8px;
  border-radius: 18px;
  box-shadow: 0 16px 30px rgba(0,0,0,.12);
}
.lp-kodawariCollage__sub img{
  display:block;
  border-radius: 14px;
}
.lp-kodawariCollage__sub--1{
  left: 6%;
  bottom: -6%;
  width: 46%;
}
.lp-kodawariCollage__sub--2{
  right: 4%;
  bottom: -10%;
  width: 38%;
}

/* SPは重なり弱める */
@media (max-width: 782px){
  .lp-kodawari__cols{ gap: 18px; }
  .lp-kodawariCollage{ padding-bottom: 44px; }
  .lp-kodawariCollage__sub--1{ left: 2%; bottom: -10%; width: 52%; }
  .lp-kodawariCollage__sub--2{ right: 0%; bottom: -14%; width: 42%; }
}








/* =========================
   私たちのこだわり（目標寄せ：2枚カード版）
   ========================= */
.kodawari{
padding: 28px 0;
  background: #F7F1E9;
}
@media (max-width: 782px){
  .kodawari{ padding: 44px 0; }
}

.kodawari__inner{
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px;
}

.kodawari__tag{
  display:inline-block;
  font-weight:800;
  font-size:16px;
  letter-spacing:.06em;
  color:#E6863B;
  background:#fff;
  border-radius:999px;
  padding:6px 12px;
  margin:0;
}

/* 左右 */
.kodawari__grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 34px;
  align-items: center;
}
@media (max-width: 900px){
  .kodawari__grid{ grid-template-columns: 1fr; gap: 22px; }
}

/* 見出し：SWELLの装飾を強制的に殺す */
.kodawari__title{
  margin: 0 0 14px !important;
  line-height: 1.35;
/*  font-size: clamp(22px, 2.2vw, 32px);*/
  font-size: 30px !important;
  color: #111 !important;

  background: transparent !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
/* SWELLが見出しに付けがちな疑似要素・内側要素も全部無効 */
.kodawari__title::before,
.kodawari__title::after{
  content: none !important;
  display: none !important;
}
.kodawari__title *{
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* 本文 */
.kodawari__lead{
  margin: 0 0 18px;
  color: rgba(0,0,0,.72);
  line-height: 1.9;
  font-size: 15px;
}

/* バッジ */
.kodawari__badges{
  display:flex;
  flex-wrap:wrap;
  gap: 12px 12px;
  margin-top: 14px;
}
.badge{
  display:flex;
  align-items:center;
  gap:10px;

  background: rgba(255,255,255,.92);
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 999px;
  padding: 12px 16px;
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
}
.badge__icon{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: #FFF3E8;
  position: relative;
  flex: 0 0 auto;
}
.badge__icon::after{
  content:"";
  position:absolute;
  inset: 10px;
  border-radius: 6px;
  background: #E6863B;
  opacity: .9;
}
.badge__ttl{
  font-weight: 900;
  font-size: 13px;
  line-height: 1.2;
}
.badge__desc{
  margin-top: 2px;
  font-size: 12px;
  color: rgba(0,0,0,.65);
  line-height: 1.35;
}

/* 右：2枚カード（目標の形） */
.cards{
  display:flex;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
  position: relative;
}
.card{
  margin: 0;
  background: #fff;
  border-radius: 18px;
  padding: 10px;
  box-shadow: 0 18px 40px rgba(0,0,0,.12);
}
.card img{
  display:block;
  width:100%;
  height:auto;
  border-radius: 14px;
}

/* 大きいカードと小さいカードの段差 */
.card--lg{
  width: min(320px, 64%);
  transform: translateY(10px);
}
.card--sm{
  width: min(210px, 42%);
  transform: translateY(38px);
}

/* モバイルは縦寄せ */
@media (max-width: 900px){
  .cards{ justify-content: flex-start; }
  .card--lg{ width: 62%; transform: translateY(0); }
  .card--sm{ width: 42%; transform: translateY(22px); }
}


/* =========================
   私たちのこだわり：画像 重ねレイアウト（案①）
   ========================= */

/* 右側：画像エリア */
.kodawari__right .cards{
  position: relative;
  width: min(520px, 80%);
  margin-left: auto; /* 右寄せ */
}

/* 画像カード共通 */
.kodawari__right .card{
  margin: 0;
  border-radius: 18px;
  background: #fff;
  padding: 10px;                 /* 白フチ */
  box-shadow: 0 12px 32px rgba(0,0,0,.12);
}

/* imgの角丸（白フチの内側） */
.kodawari__right .card img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 14px;
}

/* 大きい画像 */
.kodawari__right .card--lg{
  width: 100%;
}

/* 小さい画像：右下に重ねる */
.kodawari__right .card--sm{
  position: absolute;
  right: -36px;     /* 右に少しはみ出す */
  bottom: -36px;    /* 下に少しはみ出す */
  width: 56%;
  z-index: 2;
}

/* スマホ：はみ出しを減らして自然に */
@media (max-width: 782px){
  .kodawari__right .cards{
    width: min(420px, 100%);
    margin: 0 auto; /* 中央寄せ */
  }

  .kodawari__right .card--sm{
    right: -14px;
    bottom: -14px;
    width: 60%;
  }
}





/* =========================
   サービスメニュー：カード（1枚）
   ========================= */

/* カード全体 */
.lpMenuCard{
  background:#fff;
  border-radius:18px;
  overflow:hidden;              /* 角丸を画像にも効かせる */
  box-shadow:0 10px 24px rgba(0,0,0,.08);
  border:1px solid rgba(0,0,0,.06);
}

/* 画像エリア（画像ブロック or 画像を囲うグループに付ける） */
.lpMenuCard__img img{
  width:100%;
  /*height:240px;*/                 /* 高さ固定で整える（好みで調整） */
  height:100%;                 /* 高さ固定で整える（好みで調整） */
  object-fit:cover;
  display:block;
}

/* タイトル帯（濃い帯） */
.lpMenuCard__label{
  margin:0;                     /* 段落/見出しの余白を消す */
  padding:14px 16px;
  background:#0b3f4f;           /* 濃い帯色（好みで変更） */
  color:#fff;
  font-weight:700;
  font-size:16px;
  letter-spacing:.04em;
}

/* 本文エリア：カード内のテキスト群を「グループ」で囲ってクラス無しでもOK */
.lpMenuCard .wp-block-group,
.lpMenuCard .wp-block-swell-group{
  padding:14px 16px 18px;
}

/* 見出し・段落の“空きすぎ”をカード内だけ詰める */
.lpMenuCard h2,
.lpMenuCard h3,
.lpMenuCard h4{
  margin:0 0 .5em;
}

.lpMenuCard p{
  margin:.5em 0;
}

/* リストがあるなら */
.lpMenuCard ul,
.lpMenuCard ol{
  margin:.6em 0 0;
  padding-left:1.2em;
}

/* 価格（使う場合） */
.lpMenuCard__price{
  margin:.8em 0 0;
  font-weight:800;
  color:#e48b3a;
  font-size:18px;
}

/* ボタン（SWELLボタン/リンクどちらでも） */
.lpMenuCard__btn,
.lpMenuCard .swell-block-button__link{
  border-radius:9999px;
}

/* SP調整 */
@media (max-width:782px){
  .lpMenuCard__img img{ height:200px; }
}



/* カード内の「トリミング」見出し（帯）を強制的に素の見た目にする */
.lpMenuCard .lpMenuCard__label{
  margin:0 !important;
  padding:14px 16px !important;
  background:#0b3f4f !important;
  color:#fff !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  text-align:center;
}



/*サービスメニューエリアの見出しの背景色を白に変更*/
.lpMenuGroup h2 {
    margin: 0 !important;
    padding: 1px 16px !important;
    background: #ffffff !important;
    color: #000000 !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    text-align: center;
}

/*カードの見出しの背景色を白に変更*/
.lpMenuCard .lpMenuCard__label {
    margin: 0 !important;
    padding: 1px 16px !important;
    background: #ffffff !important;
    color: #000000 !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    text-align: center;
}



/* お客様の声：カード */
.voiceCard{
  background:#FFF6D8;
  border-radius:18px;
  padding:22px 22px;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
}

/* 左だけ薄い色にする場合 */
.voiceCard.is-accent{
  background:#E9F7F1;
}

/* 左だけ薄い色にする場合 */
.voiceCard.is-accent2{
  background:#EEF5FB;
}

/* 下部のアイコン画像を丸く */
.voiceCard .wp-block-media-text__media img{
  border-radius:999px;
}
/* アイコンと紹介文の横間隔を詰める */
.voiceProfile{
  gap: 8px; /* デフォルトは16〜24pxくらい */
}


/* =========================================================
   犬種別 料金表（SWELLタブ + テーブル）
   付与クラス：
   - セクション（フルワイド等）： .priceSection
   - タブブロック全体：           .priceTabs
   - 表の外枠グループ：           .priceCard
   - テーブルブロック：           .priceTable
========================================================= */


/* =========================
   セクション（背景・余白）
========================= */
.priceSection{
  background:#fff;              /* ← 今のご要望：白背景 */
  padding:56px 0;
}
@media (max-width: 782px){
  .priceSection{ padding:40px 0; }
}

/* 見出しや説明文を中央寄せ（必要なければ削除OK） */
.priceSection .wp-block-heading,
.priceSection p{
  text-align:center;
}

/* フルワイドの枠などが出る場合は消す（保険） */
.swell-block-fullWide.priceSection,
.priceSection .swell-block-fullWide__inner{
  border:none !important;
  outline:none !important;
  box-shadow:none !important;
}


/* =========================
   タブ（犬種選択）
   - 丸ボタン
   - 外枠で囲う
   - 中央寄せ（崩れ防止の最終形）
========================= */
.priceTabs{
  margin-top:16px;
  text-align:center !important; /* inline-flex中央寄せ用 */
}

/* タブの並び（SWELL） */
.priceTabs .c-tabList{
  display:inline-flex !important;   /* 中身幅 */
  width:auto !important;
  max-width:100% !important;
  margin:0 auto 18px !important;
  justify-content:center !important;
  gap:10px !important;

  /* 囲い枠 */
  border:1px solid #f0e2d2 !important;
  border-radius:18px !important;
  padding:10px 14px !important;
  background:transparent !important;
}

/* li側の余計な挙動を潰す */
.priceTabs .c-tabList__item{
  margin:0 !important;
  float:none !important;
}

/* ボタン（未選択） */
.priceTabs .c-tabList__button{
  border-radius:999px !important;
  padding:10px 18px !important;
  line-height:1 !important;

  border:1px solid #e7ded4 !important;
  background:#fff !important;
  color:#6b5a4d !important;

  box-shadow:0 2px 10px rgba(0,0,0,.05);
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}

/* 選択中（SWELLは aria-selected="true"） */
.priceTabs .c-tabList__button[aria-selected="true"]{
  background:#f28c2a !important;
  border-color:#f28c2a !important;
  color:#fff !important;
 /* box-shadow:0 10px 22px rgba(242,140,42,.25); */
  transform:translateY(-1px);
}

.is-style-default>.c-tabList .c-tabList__button {
    opacity: .9;
} 

/* hover（PCのみ） */
@media (hover:hover){
  .priceTabs .c-tabList__button:hover{
    transform:translateY(-1px);
    box-shadow:0 10px 22px rgba(0,0,0,.08);
  }
}

/* タブ囲い：スマホ微調整 */
@media (max-width: 782px){
  .priceTabs .c-tabList{
    padding:8px 10px !important;
    border-radius:16px !important;
    gap:8px !important;
  }
  .priceTabs .c-tabList__button{
    padding:9px 14px !important;
  }
}


/* =========================
   カード外枠（表の器）
========================= */
.priceCard{
  max-width:980px;
  margin:0 auto;
  background:#fff;
  border-radius:22px;
  padding:18px;
  overflow:hidden;

  /* 枠線＋影 */
  border:1px solid #f0e2d2;
  box-shadow:0 10px 26px rgba(0,0,0,.06);
}

@media (max-width: 782px){
  .priceCard{
    padding:14px 12px;
    border-radius:18px;
    box-shadow:0 6px 16px rgba(0,0,0,.06);
  }
}


/* =========================
   テーブル（PC）
   - 縦線なし
   - 横罫線のみ
   - 縞（stripes）無効
   - ヘッダー薄いベージュ
========================= */
.priceCard .priceTable{
  margin:0;
}

/* 縞を完全無効（is-style-stripes 対策） */
.priceCard .priceTable.is-style-stripes tbody tr:nth-child(odd){
  background:transparent !important;
}

/* テーブルの基本 */
.priceCard .priceTable table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  table-layout:auto;
}

/* セル共通 */
.priceCard .priceTable th,
.priceCard .priceTable td{
  border:none !important;
  padding:14px 16px !important;
  vertical-align:middle;
}

/* ヘッダー */
.priceCard .priceTable thead th{
  background:#fff7ec !important;
  color:#5b4b40 !important;
  font-weight:700;
  border-bottom:1px solid #f0e2d2 !important;
}

/* 本文：横罫線だけ */
.priceCard .priceTable tbody tr + tr td{
  border-top:1px solid #f0e7dd !important;
}

/* 1列目（犬種） */
.priceCard .priceTable tbody td:first-child{
  font-weight:600;
  color:#4f4036;
}

/* 金額列（2,3列目） */
.priceCard .priceTable tbody td:nth-child(2),
.priceCard .priceTable tbody td:nth-child(3){
  color:#f28c2a;
  font-weight:700;
}

/* 右端の縦ライン対策（念のため） */
.priceCard .priceTable th:last-child,
.priceCard .priceTable td:last-child{
  border-right:none !important;
}


/* =========================
   スマホ：横スクロール廃止 → 1行を縦積みカード表示
========================= */
@media (max-width: 782px){

  /* SWELLが付ける固定幅（--table-width）を潰す */
  .priceCard .priceTable table{
    width:100% !important;
    min-width:0 !important;
    --table-width:100% !important;
  }

  /* 「スクロールできます」ヒントを消す */
  .priceCard .c-scrollHint{
    display:none !important;
  }

  /* ヘッダー非表示 */
  .priceCard .priceTable thead{
    display:none !important;
  }

  /* ブロック化 */
  .priceCard .priceTable table,
  .priceCard .priceTable tbody,
  .priceCard .priceTable tr,
  .priceCard .priceTable td{
    display:block !important;
  }

  /* 1行＝1カード */
  .priceCard .priceTable tr{
    padding:12px 12px;
    border-top:1px solid #f0e7dd !important;
  }
  .priceCard .priceTable tr:first-child{
    border-top:none !important;
  }

  /* セル共通 */
  .priceCard .priceTable td{
    padding:8px 0 !important;
    border:none !important;
    text-align:left !important;
    font-size:14px;
  }

  /* 1列目：犬種（見出し） */
  .priceCard .priceTable td:first-child{
    font-weight:700;
    color:#4f4036;
    padding-top:0 !important;
  }

  /* 2列目：ラベル付け */
  .priceCard .priceTable td:nth-child(2){
    display:flex !important;
    justify-content:space-between;
    align-items:baseline;
    color:#f28c2a;
    font-weight:700;
  }
  .priceCard .priceTable td:nth-child(2)::before{
    content:"シャンプー：";
    color:#8b7b6e;
    font-weight:600;
    margin-right:8px;
  }

  /* 3列目：ラベル付け */
  .priceCard .priceTable td:nth-child(3){
    display:flex !important;
    justify-content:space-between;
    align-items:baseline;
    color:#f28c2a;
    font-weight:700;
  }
  .priceCard .priceTable td:nth-child(3)::before{
    content:"シャンプーカット：";
    color:#8b7b6e;
    font-weight:600;
    margin-right:8px;
  }
}


/* =========================
   料金表：SWELLタブ本文の外枠を完全に消す
========================= */
.is-style-default .c-tabBody {
border: 0px solid var(--color_text); */
}

/* =========================
   料金表：右端の縦線を完全除去
========================= */

/* テーブル本体の右枠 */
.priceCard .priceTable table{
  border-right: none !important;
  outline: none !important;
}

/* th / td の右枠（念のため） */
.priceCard .priceTable th,
.priceCard .priceTable td{
  border-right: none !important;
}

/* 最後の列をさらに保険で */
.priceCard .priceTable th:last-child,
.priceCard .priceTable td:last-child{
  border-right: none !important;
}

/* ラッパー側に付いている可能性のある枠も除去 */
.priceCard .wp-block-table{
  border-right: none !important;
}


/* =========================
   オプション表：料金表と同じトーンに統一（PC/共通）
   対象：テーブルブロックに optionTable
========================= */

/* 縞（ストライプ）や既存背景を完全に潰す */
.optionTable table,
.optionTable thead,
.optionTable tbody,
.optionTable tr,
.optionTable th,
.optionTable td{
  background: transparent !important;
}

/* WP/SWELLの「青ヘッダー」等を上書き */
.optionTable thead th{
  background: #fff7ec !important;       /* 料金表と同じ薄ベージュ */
  color: #5b4b40 !important;
  font-weight: 700 !important;
  border-bottom: 1px solid #f0e2d2 !important;
}

/* ストライプ（odd/even）を完全無効化 */
.optionTable .wp-block-table.is-style-stripes tbody tr:nth-child(odd),
.optionTable .wp-block-table.is-style-stripes tbody tr:nth-child(even){
  background: transparent !important;
}

/* テーブル基本：縦線なし＋横罫線のみ */
.optionTable table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border-right: none !important;
  outline: none !important;
}

/* セル：縦線を消す（右線も事故防止で潰す） */
.optionTable th,
.optionTable td{
  border: none !important;
  border-right: none !important;
  padding: 14px 16px !important;
  vertical-align: middle;
}

/* 本文：横罫線だけ */
.optionTable tbody tr + tr td{
  border-top: 1px solid #f0e7dd !important;
}

/* 1列目（オプション名） */
.optionTable tbody td:first-child{
  font-weight: 700;
  color: #4f4036;
  line-height: 1.45;
}

/* 金額（2〜4列目） */
.optionTable tbody td:nth-child(2),
.optionTable tbody td:nth-child(3),
.optionTable tbody td:nth-child(4){
  color: #f28c2a;
  font-weight: 700;
}

/* 右端の縦線が出る事故を完全防止 */
.optionTable th:last-child,
.optionTable td:last-child{
  border-right: none !important;
}


/* =========================================================
   オプションMENU：SPだけ「縦積み」にして横スクロールを無効化
   対象：.optionTable（テーブルブロックに付与）
========================================================= */
@media (max-width: 782px){

  /* SWELLの横スクロール（固定幅）を殺す */
  .optionTable{
    overflow: visible !important;
  }
  .optionTable table{
    width: 100% !important;
    min-width: 0 !important;
    table-layout: auto !important;
    --table-width: 100% !important; /* SWELLの inline 変数対策 */
  }

  /* 「スクロールできます」ヒントを消す */
  .optionTable .c-scrollHint{
    display: none !important;
  }

  /* ヘッダー行は非表示（縦積み表示のため） */
  .optionTable thead{
    display: none !important;
  }

  /* 1行＝1カードの縦積みにする */
  .optionTable table,
  .optionTable tbody,
  .optionTable tr,
  .optionTable td{
    display: block !important;
  }

  .optionTable tr{
    padding: 12px 12px;
    border-top: 1px solid #f0e7dd !important;
  }
  .optionTable tr:first-child{
    border-top: none !important;
  }

  /* セル共通 */
  .optionTable td{
    padding: 8px 0 !important;
    border: none !important;
    text-align: left !important;
  }

  /* 1列目：オプション名（見出し） */
  .optionTable td:first-child{
    font-weight: 800;
    color: #4f4036;
    line-height: 1.45;
    padding-top: 0 !important;
  }

  /* 2〜4列目：ラベル付け（小/中/大） */
  .optionTable td:nth-child(2)::before{
    content: "小型犬：";
    color: #8b7b6e;
    font-weight: 600;
    margin-right: 8px;
  }
  .optionTable td:nth-child(3)::before{
    content: "中型犬：";
    color: #8b7b6e;
    font-weight: 600;
    margin-right: 8px;
  }
  .optionTable td:nth-child(4)::before{
    content: "大型犬：";
    color: #8b7b6e;
    font-weight: 600;
    margin-right: 8px;
  }

  /* 金額は左右に分けて見やすく */
  .optionTable td:nth-child(2),
  .optionTable td:nth-child(3),
  .optionTable td:nth-child(4){
    display: flex !important;
    justify-content: space-between;
    align-items: baseline;
    font-weight: 800;
    color: #f28c2a;
  }
}

/* =========================================================
   【保険】もし optionTable が付いていない場合でも、
   「オプションMENU見出し直下のテーブル」だけ SP縦積みにする
   ※影響を最小化したいので .optionMenuWrap を付けるのが理想
========================================================= */
@media (max-width: 782px){
  .optionMenuWrap .wp-block-table table{
    width: 100% !important;
    min-width: 0 !important;
    --table-width: 100% !important;
  }
  .optionMenuWrap .c-scrollHint{
    display: none !important;
  }
}




/* =========================
　犬種選択エリアと料金表の間のすき間を0emに上書き
========================= */
.is-style-default .c-tabBody {
padding: 0em 2em;
}

















/* =========================================================
   STEP（縦ライン＋丸アイコン＋説明）
   付与クラス：
   ・外枠グループ： stepCard
   ・各行グループ： stepItem
   ・画像：         stepIcon
   ・STEP表記：     stepNo
   ・見出し：       stepTitle
   ・説明：         stepText
========================================================= */

/* 外枠カード */
.stepCard{
  background:#fff;
  border-radius:26px;
  padding:28px 28px;
  box-shadow:0 14px 34px rgba(0,0,0,.06);
  border:1px solid rgba(0,0,0,.04);
  position:relative;
  overflow:hidden;
  opacity:.8;
}

/* 左の縦ライン（全体に1本） */
.stepCard::before{
  content:"";
  position:absolute;
  top:28px;
  bottom:28px;
  left:44px;                 /* ← アイコンの中心位置に合わせる */
  width:2px;
  background:#f3e6d8;         /* 薄いベージュ線 */
  border-radius:2px;
}

/* STEP1行 */
.stepItem{
  position:relative;
}

/* STEP間の余白 */
.stepItem + .stepItem{
  margin-top:22px;
  padding-top:22px;
}

/* 2列カラムの調整（SWELL/WPのcolumnsに対応） */
.stepItem .wp-block-columns{
  margin:0;
  gap:18px;
  align-items:flex-start;
}
.stepItem .wp-block-column{
  margin:0;
}

/* 左カラムをアイコン幅に固定（列のズレ防止） */
.stepItem .wp-block-column:first-child{
  flex:0 0 72px;
  max-width:72px;
}

/* 右カラム */
.stepItem .wp-block-column:last-child{
  flex:1 1 auto;
  min-width:0;
}

/* アイコン画像（丸背景に見えるように） */
.stepIcon img{
  width:52px;
  height:52px;
  object-fit:contain;
  display:block;

  /* 画像が「丸背景込み」でない場合でも丸く見せる保険 */
  border-radius:999px;
  background:#fff3e8;
  padding:10px;
  box-shadow:0 10px 20px rgba(242,140,42,.14);
}

/* STEP表記 */
.stepNo{
  margin:0 0 6px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
  color:#f28c2a;
}

/* タイトル */
.stepTitle{
  margin:0 0 6px;
  font-size:18px;
  font-weight:800;
  color:#111;
  line-height:1.3;

  /* SWELLの見出し装飾が出る場合の保険 */
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.stepTitle::before,
.stepTitle::after{
  content:none !important;
  display:none !important;
}

/* 説明文 */
.stepText{
  margin:0;
  color:rgba(0,0,0,.65);
  line-height:1.8;
  font-size:14px;
}

/* SP調整 */
@media (max-width: 782px){
  .stepCard{
    padding:22px 18px;
    border-radius:22px;
  }
  .stepCard::before{
    top:22px;
    bottom:22px;
    left:34px;               /* SPは左余白が減るので合わせる */
  }
  .stepItem .wp-block-column:first-child{
    flex:0 0 58px;
    max-width:58px;
  }
  .stepIcon img{
    width:46px;
    height:46px;
    padding:9px;
  }
  .stepTitle{ font-size:17px; }
  .stepText{ font-size:13px; }
}

/* STEPの縦ライン（疑似要素）を消す */
.stepCard::before{
  content: none !important;
  display: none !important;
}
















/* =========================
   ホテル料金表：料金表と同じトーンに統一（PC/共通）
   対象：テーブルブロックに hotelTable
========================= */

/* 縞（ストライプ）や既存背景を完全に潰す */
.hotelTable table,
.hotelTable thead,
.hotelTable tbody,
.hotelTable tr,
.hotelTable th,
.hotelTable td{
  background: transparent !important;
}

/* WP/SWELLの「青ヘッダー」等を上書き */
.hotelTable thead th{
  background: #fff7ec !important;       /* 料金表と同じ薄ベージュ */
  color: #5b4b40 !important;
  font-weight: 700 !important;
  border-bottom: 1px solid #f0e2d2 !important;
}

/* ストライプ（odd/even）を完全無効化 */
.hotelTable .wp-block-table.is-style-stripes tbody tr:nth-child(odd),
.hotelTable .wp-block-table.is-style-stripes tbody tr:nth-child(even){
  background: transparent !important;
}

/* テーブル基本：縦線なし＋横罫線のみ */
.hotelTable table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border-right: none !important;
  outline: none !important;
}

/* セル：縦線を消す（右線も事故防止で潰す） */
.hotelTable th,
.hotelTable td{
  border: none !important;
  border-right: none !important;
  padding: 14px 16px !important;
  vertical-align: middle;
}

/* 本文：横罫線だけ */
.hotelTable tbody tr + tr td{
  border-top: 1px solid #f0e7dd !important;
}

/* 1列目（オプション名） */
.hotelTable tbody td:first-child{
  font-weight: 700;
  color: #4f4036;
  line-height: 1.45;
}

/* 金額（2〜4列目） */
.hotelTable tbody td:nth-child(2),
.hotelTable tbody td:nth-child(3),
.hotelTable tbody td:nth-child(4){
  color: #f28c2a;
  font-weight: 700;
}

/* 右端の縦線が出る事故を完全防止 */
.hotelTable th:last-child,
.hotelTable td:last-child{
  border-right: none !important;
}


/* =========================================================
   オプションMENU：SPだけ「縦積み」にして横スクロールを無効化
   対象：.hotelTable（テーブルブロックに付与）
========================================================= */
@media (max-width: 782px){

  /* SWELLの横スクロール（固定幅）を殺す */
  .hotelTable{
    overflow: visible !important;
  }
  .hotelTable table{
    width: 100% !important;
    min-width: 0 !important;
    table-layout: auto !important;
    --table-width: 100% !important; /* SWELLの inline 変数対策 */
  }

  /* 「スクロールできます」ヒントを消す */
  .hotelTable .c-scrollHint{
    display: none !important;
  }

  /* ヘッダー行は非表示（縦積み表示のため） */
  .hotelTable thead{
    display: none !important;
  }

  /* 1行＝1カードの縦積みにする */
  .hotelTable table,
  .hotelTable tbody,
  .hotelTable tr,
  .hotelTable td{
    display: block !important;
  }

  .hotelTable tr{
    padding: 12px 12px;
    border-top: 1px solid #f0e7dd !important;
  }
  .hotelTable tr:first-child{
    border-top: none !important;
  }

  /* セル共通 */
  .hotelTable td{
    padding: 8px 0 !important;
    border: none !important;
    text-align: left !important;
  }

  /* 1列目：オプション名（見出し） */
  .hotelTable td:first-child{
    font-weight: 800;
    color: #4f4036;
    line-height: 1.45;
    padding-top: 0 !important;
  }

  /* 2列目：ラベル付け（小/中/大） */
  .hotelTable td:nth-child(2)::before{
    content: "1日あたりの料金：";
    color: #8b7b6e;
    font-weight: 600;
    margin-right: 8px;
  }

/* 追加：一時預かり（1時間あたり） */
.hotelTable.hotelTable--hourly td:nth-child(2)::before{
  content: "1時間あたりの料金：";
}

  /* 金額は左右に分けて見やすく */
  .hotelTable td:nth-child(2),
  .hotelTable td:nth-child(3),
  .hotelTable td:nth-child(4){
    display: flex !important;
    justify-content: space-between;
    align-items: baseline;
    font-weight: 800;
    color: #f28c2a;
  }
}

/* =========================================================
   【保険】もし hotelTable が付いていない場合でも、
   「オプションMENU見出し直下のテーブル」だけ SP縦積みにする
   ※影響を最小化したいので .optionMenuWrap を付けるのが理想
========================================================= */
@media (max-width: 782px){
  .optionMenuWrap .wp-block-table table{
    width: 100% !important;
    min-width: 0 !important;
    --table-width: 100% !important;
  }
  .optionMenuWrap .c-scrollHint{
    display: none !important;
  }
}


/* =========================
   注意事項（ホテル料金表の下）
   ========================= */
.hotelNotice{
  display:flex;
  gap:14px;
  align-items:flex-start;

  padding:18px 18px;
  border-radius:14px;
  background:#fff1f6;              /* 画像の薄ピンクに寄せ */
  border:1px solid rgba(242,140,42,.25);
}

/* 左アイコン */
.hotelNotice__icon{
flex:0 0 24px;
width:24px;
height:24px;
  border-radius:999px;
  display:grid;
  place-items:center;

  background:#ff5aa0;              /* ピンクの丸アイコン */
  color:#fff;
  font-weight:800;
  font-size:16px;
  line-height:1;
}

/* 本文（左に縦ライン） */
.hotelNotice__body{
  flex:1;
  padding-left:14px;
  border-left:2px solid rgba(255,90,160,.35);
}

/* 箇条書きの詰め・折返し改善 */
.hotelNotice__body ul{
  margin:0;
  padding:0;
  list-style:none;
}
.hotelNotice__body li{
  position:relative;
  padding-left:1.2em;             /* ・分の余白 */
  line-height:1.75;
  font-size:14px;
  color:#6a5f57;
}
.hotelNotice__body li + li{ margin-top:8px; }

.hotelNotice__body li::before{
  content:"・";
  position:absolute;
  left:0;
  top:0;
  color:#ff5aa0;
  font-weight:700;
}

/* スマホ最適化 */
@media (max-width: 782px){
  .hotelNotice{
    padding:14px 14px;
    gap:12px;
    border-radius:12px;
  }
  .hotelNotice__icon{
flex-basis:18px;
width:18px;
height:18px;
font-size:14px;
  }
  .hotelNotice__body{
    padding-left:12px;
    border-left:2px solid rgba(255,90,160,.28);
  }
  .hotelNotice__body li{
    font-size:13px;
    line-height:1.8;
  }
}


/* =========================
   Instagramのフォローボタンの位置ズレ修正
   ========================= */
#sb_instagram #sbi_load .sbi_load_btn, #sb_instagram .sbi_follow_btn a, .et-db #et-boc .et-l .et_pb_module .sbi_follow_btn a {
display: inline-block;
vertical-align: top;
zoom: 1;
padding: 7px 14px;
margin: 0px auto 0;
background: #333;
text-decoration: none;
line-height: 1.5;
}






/* 左：画像カード */
.safe-card{
  background:#fff;
  border-radius:16px;
  padding:20px;
  box-shadow:0 10px 25px rgba(0,0,0,.08);
}
.safe-card figure{ margin:0; }
.safe-card p{
  margin:12px 0 0;
  text-align:center;
  color:#a68a6a; /* 近い色に */
  font-weight:600;
}

/* 右：チェックリスト（緑の丸チェック風） */
.check-list{
  list-style:none;
  padding-left:0;
  margin:16px 0 0;
}
.check-list li{
  position:relative;
  padding-left:28px;
  margin:10px 0;
}
.check-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:1px;
  width:20px;
  height:20px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#2ecc71;
  color:#fff;
  font-weight:700;
  font-size:13px;
}