/* ------------------------
   共通スタイル（初期）
------------------------ */
body {
  font-family:
    "Noto Sans JP",
    "Hiragino Sans",
    "Hiragino Kaku Gothic ProN",
    "Yu Gothic",
    "Meiryo",
    sans-serif;
  font-size: 16px;
  line-height: 1.6;
  font-weight: 400;
  font-style: normal;
  margin: 0;
  padding: 0;
  color: #333;
  background: #fff;
}


/* PC表示 / SP非表示 */
.pc {
  display: block;
}

/* SP表示 / PC非表示 */
.sp {
  display: none;
}

/* 899px以下をスマホ扱い */
@media screen and (max-width: 899px) {
  .pc {
    display: none;
  }

  .sp {
    display: block;
  }
}

/* PCで表示、スマホで非表示 */
.br-pc {
  display: block;
}

.br-sp {
  display: none;
}

/* スマホ時（899px以下など自由に調整可能） */
@media screen and (max-width: 899px) {
  .br-pc {
    display: none;
  }

  .br-sp {
    display: block;
  }
}
.center{
	text-align : center;
}
.left{
	text-align : left;
}
.space-l{
	height : 40px;
}
.space-m{
	height : 25px;
}
.red{
	color : #cc0000;
}

/* 最初に全画像を隠す */
.fv-wrap{
	line-height : 0;
}
.fv-wrap img {
    width: 100%;
    height: auto;
}

.site-header__content{
    height : 0;
}

/* PC（1081px～） → PCだけ表示 */
@media screen and (min-width:1081px) {
    .fv-pc {
        display: block;
    }

    .fv-tab,
    .fv-sp {
        display: none;
    }
}

/* タブレット（768～1080px） → タブレットだけ表示 */
@media screen and (min-width:768px) and (max-width:1080px) {
    .fv-tab {
        display: block;
    }

    .fv-pc,
    .fv-sp {
        display: none;
    }
}

@media screen and (min-width:1024px) and (max-width:1366px) {
  .section-in {
    max-width: 820px;
    width: 100%;
    margin: 20px auto;
    padding: 0;
    box-sizing: border-box;
    text-align: left;
  }
	.section-in img{
		width : 680px!important;
	}
}


/* スマホ（〜767px） → SPだけ表示 */
@media screen and (max-width:767px) {
    .fv-sp {
        display: block;
    }

    .fv-pc,
    .fv-tab {
        display: none;
    }
}

/* すべての要素のパディング幅を内側に */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/* セクション内の横幅をスマホでも安全に */
.section-in {
	max-width : 900px;
	width : auto;
	margin : 20px auto;
    padding: 0;
    box-sizing: border-box;
    text-align : left;
}
.section-in-profile {
	max-width : 900px;
	width : auto;
	margin : 20px auto;
    padding: 25px;
    box-sizing: border-box;
    text-align : left;
	background : #fffef8;
	border-radius : 10px;
	border : 1px solid #555151;
}

/* スマホの横スクロール禁止 */
body {
    overflow-x: hidden;
}


section {
    width: 100%;
    padding: 20px 0px;
}

.mini-font{
	font-size : 13px;
	line-height : 20px;
	font-weight : 600;
	margin-top : 35px;
	text-align : left;
}

.garally-text{
	max-width : 880px;
	font-size : 14px;
	line-height : 20px;
	font-weight : 600;
	margin : 60px auto 0px;
	text-align : left;
}
.marker-pink{
	background : #ffe4e1;
}

/*セクション背景*/
.bg-gray {
    background: #f8f8f8;
}

.bg-white {
    background: #ffffff;
}

.bg-yellow {
    background : #fffef8;
}

.bg-blue {
    background: #2e85fc;
}

.bg-pink-light {
    background: #FFF1F5;
}
.bg-blue-light{
	background : #f3fbfd;
}

.bg-red {
    background: #fc4949;
}




/* ▼▼▼ セクション共通レイアウト ▼▼▼ */
.lp-block {
    padding: 20px;
}


/* ▼▼▼ 見出し（h2）共通 ▼▼▼ */
.lp-heading {
    font-size: 1.8rem;
    text-align: center;
    margin: 0 0 24px;
    font-weight: 700;
    line-height: 1.4;
}

h3.lp-subheading {
    font-size: 1.4rem;
    text-align: center;
    margin-bottom : 35px!important;
    font-weight: 700;
    line-height: 1.4;
    background : #fd811f;
    padding : 0.5em 0;
    color : #fff;
    border-radius : 10px;    
}
h4.lp-subheading {
    font-size: 1.4rem;
    text-align: left;
    margin-top : 20px!important;
    margin-bottom : 20px!important;
    font-weight: 700;
    line-height: 1.4;
    padding-bottom : 5px;
    color : #333;
    border-bottom : 2px solid #333;
}

/* ▼▼▼ テキスト ▼▼▼ */
.lp-text {
    font-size: 1rem;
    line-height: 1.9;
    margin: 0 0 35px 0;
}
p.lp-text{
	margin-bottom : 10px!important;
}

/* ▼▼▼ 箇条書き ▼▼▼ */
.lp-list {
    margin: 0 0 18px 1.4em;
    padding: 0;
}

.lp-list li {
    margin-bottom: 6px;
    line-height: 1.8;
}

/* MAPが整っていないと起きる問題 */
.map-problem {
    /* lp-block と同じデザインに統一するため */
    padding: 20px;
}

.map-problem .lp-text {
    margin-bottom: 14px;
}

.map-problem .lp-list li {
    margin-bottom: 6px;
}

/* Googleマップが整うと “集客の入口” が強くなる理由 */
.map-strength {
    padding: 20px 0px;
    /* 他セクションと統一 */
}

/* 提供するサービス（あなたの商品内容） */
.map-service {
    padding: 20px 0px;
    /* 他セクションと統一 */
}

/* =========================
   ページ構成 全体レイアウト
========================= */

.kousei{
  display: flex;
  gap: 20px;
}

/* 左右ブロック共通 */
.kousei-left,
.kousei-right{
  width: 50%;
  padding: 10px;
  box-sizing: border-box;
  text-align: center;
}

/* floatは完全に不要なので削除 */
.kousei-left,
.kousei-right{
  float: none;
}

/* =========================
   スマホ用（縦並び）
========================= */

@media screen and (max-width: 767px){

  .kousei{
    flex-direction: column;
  }

  .kousei-left,
  .kousei-right{
    width: 100%;
    padding: 5px;
  }

}


/* ターコイズ系背景（④） */
.bg-turquoise-bright {
    background: #c3f5f5;
}

/* レイアウト図（ワイヤーフレーム） */
.wireframe {
    list-style: none;
    padding: 0;
    margin: 24px 0 0;
}

.wireframe li {
    border: 1px solid #53b4bf;
    background: #e4f8fa;
    padding: 14px;
    margin-bottom: 12px;
    text-align: center;
    font-weight: 600;
    border-radius: 6px;
}


/* この1ページWebで得られる効果 */
.map-effect {
    padding: 20px 0;
    /* 他セクションと統一 */
}

/* ▼ 料金セクション全体 */
.price-section {
    padding: 20px 0;
}

/* ▼ 横並び（スマホは縦並び） */
.price-table {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
}

/* ▼ ボックス */
.price-box {
    background: #fff;
    border: 2px solid #ddd;
    border-radius: 8px;
    padding: 20px;
    flex: 1;
    min-width: 260px;
}

/* ▼ プラン名 */
.price-title {
    font-size: 1.3rem;
    font-weight: 700;
    text-align: center;
    margin: 0 0 10px!important;
	background : pink;
	padding : 8px;
	border-radius : 10px;
}

/* 価格表示 */
.price{
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 4px;
  font-weight: 700;
  margin: 12px 0 18px;
}

/* 数字 */
.price .num{
  font-size: 40px;
  line-height: 1;
}

/* 円 */
.price .yen{
  font-size: 22px;
  margin-top: 3px;
}

/* 税別 */
.price .tax{
  font-size: 14px;
  margin-top: 4px;
}




/* ▼ 項目一覧 */
.price-list {
    margin: 0;
    padding-left: 1.2em;
}

.price-list li {
    margin-bottom: 8px;
    line-height: 1.7;
}

/* ▼ オプション一覧 */
.option-list {
    margin: 15px 0;
    padding-left: 1.2em;
}

.option-list li {
    margin-bottom: 8px;
    line-height: 1.7;
	text-align : left;
}

/* ▼ スタンダードにしかない項目を強調 */
.price-list .plus {
    font-weight: 600;
    color: #0076d6;
}

@media (max-width: 767px) {

    .price-table {
        flex-direction: column;
        gap: 0;
    }

    .price-box {
        flex: none;
        width: 100%;
        margin: 0 0 15px 0 !important; /* ← 下だけ余白を15px */
        padding: 14px;
    }

}



/*ホームページとの違い*/
.chigai-box{
	max-width : 720px;
	margin : 30px auto;
	border : 1px solid #555151;
	padding : 15px 0px;
	border-radius : 10px;
}

/* 申し込みの流れ */
.flow-section {
    padding: 20px 0;
}

.flow-list {
    list-style: none;
    margin: 30px auto 0;
    padding: 0;
    max-width: 720px;
}

.flow-list li {
    background: #fff;
	border : 1px solid #0dbed3;
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 14px;

    display: flex;
    align-items: center;
    gap: 12px;

    position: relative;
}

/* 下向き矢印で流れを表現 */
.flow-list li:not(:last-child)::after{
    content: "▼";
    position: absolute;
    bottom: -14px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 14px;
    color: #0dbed3;
}

/* STEP丸バッジ */
.step-badge{
    min-width: 82px;
    text-align: center;
    background: #0dbed3;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    padding: 6px 10px;
    border-radius: 20px;
    white-space: nowrap;
}

/* 説明文 */
.flow-list p{
    margin: 0;
    font-size: 16px;
    color: #333;
    line-height: 1.7;
}


/*よくある質問*/
.qa-section {
    padding: 20px;
}

.qa-box {
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid #ddd;
}

.qa-q {
    margin: 0 0 8px;
    font-weight: 700;
}

.qa-a {
    margin: 0;
    line-height: 1.8;
}

/*申込フォーム*/
.form-section {
   padding: 30px  20px;
}

/*最後の締め部分*/
.final-cta {
    padding: 20px;
    text-align: center;
}

.cta-btn-wrap {
    margin-top: 30px;
    text-align : center;
}

.cta-btn {
    display: inline-block;
    background: #E85A8C;
    color : #fff;
    padding: 14px 36px;
    font-size: 1.2rem;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700;
    transition: opacity .2s;
	text-align : center;
}
.cta-btn:hover {
    opacity: 0.85;
	color : #fff;
}

/*フッター*/
.lp-footer {
    background: #333;
    color: #fff;
    font-size: 13px;
    padding: 10px;
    text-align: center;
}

/* ▼▼ スマホ固定ボタン ▼▼ */
.fixed-buttons {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    display: flex;
    z-index: 9999;
}

.fixed-btn {
    flex: 1;
    text-align: center;
    padding: 14px 0;
    font-size: 1rem;
    font-weight: 700;
    color: #fff;
    text-decoration: none;
}

/* 電話ボタン（青系） */
.call-btn {
    background: #0076d6;
}

/* フォームボタン（ピンク） */
.form-btn {
    background: #ff2768;
}

/* ホバー効果（PCでの確認用） */
.fixed-btn:hover {
    opacity: 0.85;
}

/* ▼ PC では非表示（768px以上） */
@media screen and (min-width: 768px) {
    .fixed-buttons {
        display: none;
    }
}

/* スマホ用設定（768px以下） */
@media screen and (max-width: 768px) {
    .lp-heading {
        font-size: 1.4rem;
    }
.lp-footer {
    background: #333;
    color: #fff;
    font-size: 13px;
    padding: 10px;
    text-align: center;
	margin-bottom : 70px;
}
/*ホームページとの違い*/
.chigai-box{
	width : auto;
	margin : 20px 0px;
}
.garally-text{
	width : auto;
	margin : 50px 15px 0px 15px;
	text-align : left;
}
.section-in-profile {
  max-width: 900px;
  width: auto;
  margin: 20px auto;
  padding: 15px;
  box-sizing: border-box;
  text-align: left;
  background: #fffef8;
  border-radius: 10px;
  border: 1px solid #555151;
}

}

/* ─────────── LP固定ページ 全幅調整（最終版） ─────────── */

/* 固定ページのタイトル（h1）は非表示 */
h1 {
    display: none !important;
}

/* 横幅を完全フル幅にする（container制御解除） */
.container,
.ys-container {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ファーストビュー直下の余白ゼロ */
header + #content,
.site-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 最初に自動生成される <br> を削除 */
.entry-content > br:first-child {
    display: none !important;
}

/* 空の pタグを削除（Gutenberg が勝手に入れる対策） */
.entry-content > p:empty {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* LP全セクションの不要な上下余白ゼロ */
.entry-content .lp-block {
    margin-top: 20px !important;
    margin-bottom: 0 !important;
}

/* LP見出しの上余白をゼロ */
/* LP見出しの上余白をゼロ */
.lp-block .lp-heading {
    max-width : 900px;
    margin: 20px auto!important;
    background-color: #ffd700;/*背景色*/
    color: #000;/*文字色（黒）*/
    font-size: 26px;/*文字サイズ*/
    padding: 0.7em 0.8em;/*文字回りの余白（上下 左右）*/
    border-radius : 10px;
    text-align : center;
}
.lp-block .lp-heading-green {
    max-width : 900px;
    margin: 20px auto 0!important;
    background-color: #0cb1c5;/*背景色*/
    color: #fff;/*文字色（黒）*/
    font-size: 20px;/*文字サイズ*/
    padding: 0.7em 0.8em;/*文字回りの余白（上下 左右）*/
    border-radius : 10px;
    text-align : center;
}
.lp-block .lp-heading-pink {
    max-width : 900px;
    margin: 20px auto!important;
    background-color: #E85A8C;/*背景色*/
    color: #fff;/*文字色（黒）*/
    font-size: 26px;/*文字サイズ*/
    padding: 0.7em 0.8em;/*文字回りの余白（上下 左右）*/
    border-radius : 10px;
    text-align : center;
}
h3.lp-heading-sub {
    max-width : 900px;
    margin: 20px auto!important;
    color: #dc143c;/*文字色（黒）*/
    font-size: 22px;/*文字サイズ*/
    padding: 0.5em 0.8em;/*文字回りの余白（上下 左右）*/
    text-align : center;
}

/* ブロック間の無駄な下マージンを削除 */
.entry-content > *:not(:last-child) {
    margin-bottom: 0 !important;
}

@media screen and (max-width: 768px) {
.lp-block .lp-heading {
    width : auto;
    margin: 20px auto 0!important;
    background-color: #ffd700;/*背景色*/
    color: #000;/*文字色（黒）*/
    font-size: 20px;/*文字サイズ*/
    padding: 0.7em 0.8em;/*文字回りの余白（上下 左右）*/
    border-radius : 10px;
    text-align : center;
}
.lp-block .lp-heading-green {
    width : auto;
    margin: 20px auto 0!important;
    background-color: #0cb1c5;/*背景色*/
    color: #fff;/*文字色（黒）*/
    font-size: 20px;/*文字サイズ*/
    padding: 0.7em 0.8em;/*文字回りの余白（上下 左右）*/
    border-radius : 10px;
    text-align : center;
}
.lp-block .lp-heading-pink {
    width : auto;
    margin: 20px auto 0!important;
background-color:#E85A8C;
    color: #fff;/*文字色（黒）*/
    font-size: 22px;/*文字サイズ*/
    padding: 0.7em 0.8em;/*文字回りの余白（上下 左右）*/
    border-radius : 10px;
    text-align : center;
}
h3.lp-subheading {
    font-size: 1.2rem;
    text-align: center;
    margin-bottom : 35px!important;
    font-weight: 700;
    line-height: 1.4;
    background : #fd811f;
    padding : 0.5em 0;
    color : #fff;
    border-radius : 10px;    
}
h4.lp-subheading {
    font-size: 1.1rem;
    text-align: left;
    margin : 0px 10px!important;
    font-weight: 700;
    line-height: 1.4;
    padding-bottom : 5px;
    color : #333;
    border-bottom : 2px solid #333;
}
.lp-block {
    padding: 20px;
}
.lp-block-top {
    padding: 0 20px;
}
.section-in {
    max-width: 900px;
    margin: 20px auto;
    padding: 0;
    box-sizing: border-box;
    text-align : left;
}
.entry-content .lp-block {
    margin-top: 0px !important;
    margin-bottom: 0 !important;
}
}

.font-120{
	font-size : 120%;
}

/*画像調整のためのcss*/
.wp-image-83{
  width: 100% !important;
	max-width : 700px;
  height: auto !important;
  margin: 0 auto !important;
  display: block !important;
}

/*フォームのcss*/
/* ====================
   ペット用フォーム
==================== */

.pet-form{
  max-width:780px;
  margin:40px auto;
  padding:0px;
  font-family:"Noto Sans JP",sans-serif;
}

.pet-form-card{
  background:#fff;
  border-radius:14px;
  padding:15px;
  margin-bottom:16px;
  box-shadow:0 4px 10px rgba(0,0,0,0.08);
}

.pet-form label{
  display:block;
  font-size:15px;
  color:#E85A8C;
  margin-bottom:6px;
  font-weight:600;
}

.pet-form input,
.pet-form textarea{
  width:100%;
  border-radius:10px;
  border:1px solid #f1b5cd;
  padding:10px;
  font-size:16px;
  background:#fffafc;
}

.pet-form input:focus,
.pet-form textarea:focus{
  outline:none;
  border-color:#ff8fb3;
  background:#fff;
}

.pet-form small{
  display:block;
  margin-top:4px;
  color:#666;
  font-size:12px;
}

/* radio checkbox */

.pet-form input[type="radio"],
.pet-form input[type="checkbox"]{
  width:auto;
  margin-right:6px;
  accent-color:#ff8fb3;
}

.pet-form label > input{
  margin-right:6px;
}

/* 必須 */

.req{
  color:#ff3860;
}

/* ボタン */

.pet-submit{
  width:100%;
background: linear-gradient(135deg, #ff5f9e, #ffb3cc);

  color:#fff;
  font-size:18px;
  border:none;
  border-radius:40px;
  padding:15px 0;
  cursor:pointer;
  font-weight:700;
  box-shadow:0 5px 14px rgba(255,150,180,0.4);
}

.pet-submit:hover{
  opacity:.9;
}
/* チェック・ラジオ行の行間をリセットして正常化 */
.pet-form-card label{
  display:flex !important;
  align-items:center;
  margin:3px 0 !important;
  line-height:1.4 !important;
  color: #e85a8c !important; /* ラベルの色を元に戻す */
}
/* チェックボックス・ラジオの行間を強制修正 */
.pet-form-card label{
  line-height:1.2 !important;
  margin:0 !important;
  padding:0 !important;
}

/*サンクスページのFVを非表示*/
/* サンクスページだけFVを消す */
.page-thanks .lp-fv,
.page-thanks .fv,
.page-thanks .first-view {
  display: none !important;
}

/* サブページ（thanks含む）では site-title を非表示 */
body:not(.front-page) .site-title {
  display: none !important;
}

.sankou-ttl{
	border-radius : 8px;
	background : #0dbed3;
	color : #fff;
	font-weight: 600;
	margin : 20px 0 0 0;
	padding : 8px;
	text-align : center;
}
.sankou {
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

.sankou li{
	float : left;
	width : 50%;
	margin : 0px auto;
	padding : 2px;
	text-align : center;
	list-style : none;
}

/* =========================
   ギャラリー全体
========================= */
.garally {
  width: 100%;
  background: #fffef8;
  padding: 40px;
}

.garally-ttl{
	max-width : 1080px;
	margin : 10px auto;
	text-align : center;
	font-size : 20px;
	background : #00ced1;
	padding : 5px 0px;
	color : #fff;
	font-weight : 600;
	border-radius : 8px;
}

/* 中央寄せ・最大幅 */
.garally_in {
  max-width: 1080px;   /* ← PC基準 */
  width: 100%;
  margin: 0 auto;
}

/* =========================
   Slick本体
========================= */

/* 初期化前は非表示（チラ見え防止） */
.garally-slider {
  opacity: 0;
}

/* 初期化後に表示 */
.garally-slider.slick-initialized {
  opacity: 1;
  transition: opacity 0.2s ease;
}

/* 画像 */
.garally-slider img {
  width: 100%;
  height: auto;
  display: block;
}

/* スライド間隔（PC） */
.garally-slider .slick-slide {
  margin: 0 5px;       /* 画像間10px */
}

/* 両端のズレ補正 */
.garally-slider {
  margin: 0 -5px;
}
/* ドット全体の位置（すでに入っていれば不要） */
.garally-slider .slick-dots {
  bottom: -30px;
}

/* ドットの間隔を狭める */
.garally-slider .slick-dots li {
  margin: 0 3px;   /* ← デフォルトより狭く */
}

/* ドット自体を大きくする */
.garally-slider .slick-dots li button:before {
  font-size: 14px;   /* ← 少し大きく */
  color: #bbb;       /* 色はそのまま */
  opacity: 1;
}

/* アクティブ時（色は変更しない） */
.garally-slider .slick-dots li.slick-active button:before {
  color: #333;
}


/* =========================
   スマホ調整
========================= */
@media screen and (max-width: 768px) {

  .garally {
    padding: 20px 8px;   /* スマホ余白 */
  }
.garally-ttl{
	font-size : 18px;
}
  .garally_in {
    max-width: 100%;
    margin: 0;
  }

  /* スマホ用：間隔を控えめに */
  .garally-slider .slick-slide {
    margin: 0 2px;       /* 画像間4px */
  }

  .garally-slider {
    margin: 0 -2px;
  }
}

/*トップのリンクボタン動き*/
.yura-btn img {
  display: inline-block;
  animation: upDown 2.6s ease-in-out infinite;
}

/* 上下にふわっと */
@keyframes upDown {
  0%   { transform: translateY(0); }
  40%  { transform: translateY(-10px); } 
  70%  { transform: translateY(0); }
  100% { transform: translateY(0); }
}

/* チェック専用リスト（完全独立） */
.check-list-safe {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* 1行ずつ完全制御 */
.check-list-safe li {
  position: relative;
  padding-left: 1.6em;   /* ← チェック分の余白だけ */
  margin-bottom: 0.6em;
  line-height: 1.5;
  letter-spacing: 0;
  animation: none !important; /* ← アニメ完全無効 */
	font-weight : 600;
}

/* チェックマークは疑似要素で固定 */
.check-list-safe li::before {
  content: "✔";
  position: absolute;
  left: 0;
  top: 0.1em;           /* ← 文字位置を安定させる */
  font-weight: bold;
  line-height: 1;
}

.profile-badge {
  text-align: center;
  margin: 0 auto;
}

.profile-badge__photo {
  width: 100px;
  height: 100px;
  margin: 0 auto 10px;
  border-radius: 50%;
  overflow: hidden;
}

.profile-badge__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;   /* 正方形でもきれいにトリミング */
  display: block;
}

.profile-badge__title {
  font-size: 12px;
  line-height: 1.3;
  margin-bottom: 4px;
  color: #555;
}

.profile-badge__name {
  font-size: 13px;
  line-height: 1.3;
  font-weight: 600;
  color: #333;
}