/* テーマカラー連動型の図形を完全に非表示にする */
.site-header svg, 
.banner svg, 
.front-page-section svg, 
section svg,
.banner-shape,
.section-shape {
    display: none !important;
}


/* バナー内の説明文が自動改行されるのを絶対に防ぎ、1段にする */
.banner .banner-caption .banner-desc,
.banner-content .banner-text {
    max-width: 100% !important;
    width: 100% !important;
    white-space: nowrap !important; /* ← これが「絶対に自動改行させない」命令です */
    display: inline-block !important;
}

/* ==========================================
   スマホ（画面幅が狭い端末）の時だけ、
   バナー説明文の自動改行を許可して画角に収める設定
   ========================================== */
@media screen and (max-width: 767px) {
    .banner .banner-caption .banner-desc,
    .banner-content .banner-text {
        white-space: normal !important; /* スマホでは自動改行を許可する */
        word-break: break-all !important; /* 単語の途中でも綺麗に枠内で折り返す */
        font-size: 16px !important;    /* スマホで見やすい文字サイズに自動調整 */
        width: 100% !important;
        max-width: 100% !important;
    }
}


/* ==========================================
   【パソコン用】座布団を画像全体に100%広げ、文字を中央に収める
   ========================================== */
@media screen and (min-width: 0px){
    
    /* 大元のバナーエリアの構造をリセット */
    #site-banner.item,
    #site-banner,
    .site-banner {
        position: relative !important;
        display: block !important;
    }

    /* 1. 黒い座布団（オーバーレイ）を画像全体の「端から端まで」強制的に広げる */
    #site-banner .banner-caption,
    .site-banner .banner-caption {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;   /* 画像と同じ高さいっぱいに座布団を広げる */
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        
        /* テーマ独自の小さな座布団を消し、画像全体を覆う黒べた塗りに上書き（透過度20%） */
        background: rgba(0, 0, 0, 0.2) !important; 
        
        /* 箱の中身（文字）をど真ん中に整列させる命令 */
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important; /* 上下の中央寄せ */
        align-items: center !important;     /* 左右の中央寄せ */
    }

    /* 2. 文字の塊を座布団の完全に「真ん中」へ閉じ込める */
    #site-banner .banner-caption .banner-caption-inner,
    .site-banner .banner-caption-inner {
        position: relative !important;
        width: 100% !important;
        max-width: 900px !important; /* 文字が横に広がりすぎないための枠 */
        text-align: center !important;
        background: transparent !important; /* 二重で座布団ができないように透明化 */
        padding: 20px !important;
    }

    /* 3. サブタイトル、タイトル、説明文が縦に綺麗に並ぶようにする */
    .banner-caption-inner .sub-title,
    .banner-caption-inner .banner-title,
    .banner-caption-inner .banner-desc {
        display: block !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* ==========================================
   文字の上下に張り付いている唐草模様（ボーダー装飾）を完全に消す
   ========================================== */
#site-banner .banner-caption .banner-caption-inner::before,
#site-banner .banner-caption .banner-caption-inner::after,
.site-banner .banner-caption-inner::before,
.site-banner .banner-caption-inner::after {
    content: none !important;
    display: none !important;
    border: none !important;
    background: none !important;
}

/* 万が一、文字の枠線自体にデザインが残る場合の徹底消去 */
#site-banner .banner-caption-inner,
.site-banner .banner-caption-inner {
    border-top: none !important;
    border-bottom: none !important;
    background-image: none !important;
}


/* ==========================================
   ストーリーエンドタイトル「Go After Happiness」横一列・中央寄せ
   ========================================== */

/* 1. 【親要素】文字を包む外枠の「560px制限」を完全に破壊し、中身を中央に集める */
.story-end-title,
.story-ended-title,
[class*="story-end"] {
    max-width: 100% !important;
    width: 100% !important;
    text-align: center !important; /* 中の文字を中央に寄せる */
    display: block !important;
    float: none !important;        /* 左に引っ張る力を完全に無効化 */
}

/* 2. 【子要素】文字自体を「1つの塊」にし、絶対に自動改行させず、真ん中に留まらせる */
.story-end-title h2,
.story-ended-title h2,
[class*="story-end"] h2,
[class*="story-end"] .section-title {
    white-space: nowrap !important;  /* ★TOPで大成功した「絶対に自動改行させない」命令 */
    max-width: 100% !important;
    width: auto !important;
    display: inline-block !important; /* ★塊にして中央にキープする最重要命令 */
    text-align: center !important;
    float: none !important;          /* 左に弾き出されるバグを完全修正 */
    margin: 0 auto !important;       /* 左右の余白を均等にして完全中央寄せ */
}


/* ==========================================================================
   【HOME限定版】エントリータイトルサイズ調整＆本文非表示
   ========================================================================== */

/* 1. 【パソコン用】画面幅が768px以上のときは「25px」にする */
@media screen and (min-width: 768px) {
	#primary .post .entry-title,
	.entry-title a,
	.entry-title {
		font-size: 25px !important; 
	}
}

/* 2. 【スマホ用】画面幅が767px以下のときは「20px」にする */
@media screen and (max-width: 767px) {
	#primary .post .entry-title,
	.entry-title a,
	.entry-title {
		font-size: 20px !important; 
	}
}

/* 3. 【HOME限定・差し替え】
      頭に「.home」を付けることで、他の固定ページを100%完全に保護し、
      HOME画面（トップページ）にある投稿一覧エリアの本文・抜粋文だけを一括で非表示にします */
.home .entry-content,
.home .entry-summary,
.home #primary .post .entry-content,
.home #primary .post .entry-summary {
	display: none !important;
}



/* ==========================================
   フッターのMetaSliderをカットせず、縦横同比率で綺麗に縮小する
   ========================================== */
@media screen and (min-width: 0px) {
    /* 1. プラグイン本来の横幅100%ルールを絶対に壊さず、外枠全体の最大幅を「半分（600px前後）」にギュッと絞り込みます */
    .site-footer .metaslider,
    #colophon .metaslider,
    #colophon div[class*="metaslider"] {
        max-width: 500px !important;  /* ★ここで表示サイズをコントロールします（これ以上広がらなくなります） */
        width: 100% !important;        /* スライダー本来の横の広がりは100%でキープ（これで左右の重なりバグが直ります） */
        margin-left: auto !important;  /* 画面の真ん中に寄せる */
        margin-right: auto !important;
        display: block !important;
        height: auto !important;
        max-height: none !important;
    }

    /* 2. 中の写真の縦横比（プロポーション）を一切壊さず、外枠の大きさに合わせて自動追従させます */
    .site-footer .metaslider .slides img,
    .site-footer .metaslider img,
    #colophon .metaslider img {
        width: 100% !important;        /* 500pxの枠いっぱいに写真を広げる */
        height: auto !important;       /* ★横幅が小さくなった分、縦幅も「全く同じ比率」で自動的に縮みます */
        object-fit: fill !important;   /* 写真を1ミリも切り落とさずに全体を残す */
        transform: none !important;
    }
}


/* ==========================================================================
   【完全決定版】フッターの隙間削減・座布団極薄 ＆ 画像の横センタリング設定
   ========================================================================== */

/* 1. スライダーがある部屋（footer-top）の下側の余白を限界まで削る */
.site-footer .footer-top {
	padding-bottom: 0px !important;
	margin-bottom: 0px !important;
}

/* 2. 【画像全体の暗さ ＆ 横センタリング対策】
      背景画像の表示位置を「中央（center）」に固定し、さらに暗い膜を極薄（0.15）にする */
#colophon,
.site-footer {
	/* 💡【ここを追加！】スマホでも画像の一番良い真ん中の部分が必ず中央に表示されるように強制固定 */
	background-position: center center !important;
	background-repeat: no-repeat !important;
	background-size: cover !important; /* 画面いっぱいに綺麗にフィットさせるお守り */
}
#colophon::before,
.site-footer::before {
	background-color: rgba(0, 0, 0, 0.15) !important;
	background: rgba(0, 0, 0, 0.15) !important;
	opacity: 1 !important;
}

/* 3. コピーライトがある部屋（site-info）の余白を狭め、
      後ろの背景画像と完全に馴染むように透明化（座布団をなくす）する */
#colophon .site-info,
.site-footer .site-info {
	padding-top: 0px !important;    /* あなたの設定を100%維持 */
	padding-bottom: 10px !important; /* 下側の座布団の厚みもスマートに調整 */
	margin-top: 0px !important;      /* あなたの設定を維持 */

	background-color: transparent !important;
	background: transparent !important;
}

/* 4. コピーライト文字自体を座布団の完全に「真ん中」へ整列させる安全対策 */
#colophon .site-info .copyright,
.site-info .copyright {
	display: block !important;
	float: none !important;
	margin: 0 auto !important;
	text-align: center !important;
	line-height: 1.5 !important;
}



/* ==========================================
   サイトタイトル（ひだ高山結婚相談カウンター）のフォント変更
   ========================================== 
.site-header .site-branding .site-title,
.site-header .site-branding .site-title a,
#masthead .site-title a,
.site-title {
    /* ▼ パターンA：上品で信頼感のある「明朝体」（ロゴ文字に一番おすすめ！） 
    font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif !important;
    
    /* ▼ パターンB：現代的でスマートな「ゴシック体」（使う場合は上の行を消してください） */
    /* font-family: "Noto Sans JP", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", sans-serif !important; 
    
    font-weight: bold !important; /* 文字の太さを引き締める */



/* ==========================================
   Blossom Wedding：最上位階層からの完全強制上書き
   ========================================== */

/* 1. 【パソコン用】画面幅が768px以上のとき */
@media screen and (min-width: 768px) {
    body .man-matron-wrap * {
        font-size: 24px !important;
        line-height: 1.6 !important;
    }
}

/* 2. 【スマホ用】画面幅が767px以下のとき */
@media screen and (max-width: 767px) {
    body .man-matron-wrap * {
        font-size: 20px !important;
        line-height: 1.5 !important;
    }
}
/* ==========================================
   成婚者の声：詳細テキストの文字サイズ調整
   ========================================== */

/* 1. 【パソコン用】画面幅が768px以上のとき */
@media screen and (min-width: 768px) {
    .man-matron-wrap p,
    .man-matron-wrap .man-description,
    .man-matron-wrap .matron-description,
    .man-matron-wrap div {
        /* タイトル（28px）に巻き込まれないよう、特定の文字要素だけ小さく指定 */
        font-size: 18px !important;
        line-height: 1.7 !important;
    }
}

/* 2. 【スマホ用】画面幅が767px以下のとき */
@media screen and (max-width: 767px) {
    .man-matron-wrap p,
    .man-matron-wrap .man-description,
    .man-matron-wrap .matron-description,
    .man-matron-wrap div {
        font-size: 16px !important;
        line-height: 1.6 !important;
    }
}
/* ==========================================
   Blossom Wedding：ブロック内に「続きを読む」リンクを強制配置
   ========================================== */
.man-matron-wrap .man-description,
.man-matron-wrap .matron-description,
.man-matron-wrap p {
    position: relative !important;
    padding-bottom: 30px !important; /* ボタンを置くスペースを確保 */
}

.man-matron-wrap .man-description::after,
.man-matron-wrap .matron-description::after,
.man-matron-wrap p::after {
    content: "「成婚者の声」を読む ＞" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    color: #e5a93b !important; /* ひだ高山結婚相談カウンターのテーマカラーに合わせる（自由に変更可） */
    font-weight: bold !important;
    text-decoration: underline !important;
    font-size: 14px !important;
    cursor: pointer !important;
}


.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder {
    color: #f2e6e9;
    opacity: 1;
}


.entrance1291-site-info .copyright{
    color: #fff8dc;
}