/* ========================================
   グループブロック全体の基本設定
   ======================================== */
.wp-block-group.has-background {
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    /* align-itemsは指定せず、各要素のmargin: autoで制御します */
}

/* ========================================
   画像・動画：クラスなしでも「中央寄せ＋全幅」
   ======================================== */
.wp-block-group.has-background figure,
.wp-block-group.has-background img,
.wp-block-group.has-background .wp-block-video,
.wp-block-group.has-background video {
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
    width: 100% !important; /* 基本は750pxいっぱい */
    max-width: 750px !important;
}

/* ========================================
   素材設定：lp-inner-media または lp-inner-img をつけた時だけサイズ変更
   ======================================== */
/* クラスがついた場合は100%を解除して、指定のサイズ（デフォルト60%）にする */
.wp-block-group.has-background .lp-inner-media,
.wp-block-group.has-background .lp-inner-media video,
.wp-block-group.has-background .lp-inner-img,
.wp-block-group.has-background img.lp-inner-img {
    width: var(--lp-width, 60%) !important; 
    max-width: 100% !important;
}

/* サイズ微調整用クラス */
.w-40 { --lp-width: 40% !important; }
.w-50 { --lp-width: 50% !important; }
.w-70 { --lp-width: 70% !important; }
.w-80 { --lp-width: 80% !important; }

/* ========================================
   テキスト設定：エディターの配置（左・中・右）を優先
   ======================================== */
.wp-block-group.has-background p,
.wp-block-group.has-background h1,
.wp-block-group.has-background h2,
.wp-block-group.has-background h3,
.wp-block-group.has-background h4,
.wp-block-group.has-background ul {
    padding: 15px 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    /* margin: auto を入れないことで、text-alignの設定が効くようになります */
}

/* 隙間対策の徹底 */
.wp-block-group.has-background::before,
.wp-block-group.has-background::after { display: none !important; }
.wp-block-group.has-background video { vertical-align: top !important; }
/**
 * Twenty Twenty-Three LP用カスタムCSS
 * 上下左右余白0、画像間隙間0、コンテンツ幅750px固定
 * 投稿・固定ページ・カスタム投稿すべてに適用
 */

/* ========================================
   body、HTML全体の余白リセット
======================================== */
body,
html {
    margin: 0 !important;
    padding: 0 !important;
}

/* ========================================
   サイト全体のコンテナ幅を750pxに固定
======================================== */
.wp-site-blocks,
body > .is-root-container,
.wp-block-group.is-root-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* ========================================
   メインコンテンツエリアの設定
======================================== */
main,
.wp-block-post-content,
.entry-content {
    max-width: 750px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* ========================================
   記事コンテンツの余白をすべて削除
======================================== */
article,
.entry-content,
.wp-block-post-content {
    margin: 0 !important;
    padding: 0 !important;
}

/* ========================================
   すべてのブロック要素の余白を0に
======================================== */
.wp-block-post-content > *,
.entry-content > *,
.wp-site-blocks > * {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* ========================================
   画像ブロックの設定
======================================== */
.wp-block-image,
.wp-block-image img,
figure.wp-block-image {
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    max-width: 750px !important;
    width: 100% !important;
    height: auto !important;
}

/* 画像自体の設定 */
img {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: top !important;
    max-width: 750px !important;
    width: 100% !important;
    height: auto !important;
}

/* figcaptionは非表示（必要に応じて調整） */
figcaption {
    display: none;
}

/* ========================================
   グループブロックやカラムの余白削除
======================================== */
.wp-block-group,
.wp-block-columns,
.wp-block-column,
.wp-block-cover {
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
}

/* ========================================
   Twenty Twenty-Three特有の設定
======================================== */
/* コンテナブロックの調整 */
.wp-block-group.has-global-padding {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* グローバルパディングの無効化 */
body {
    --wp--style--root--padding-top: 0 !important;
    --wp--style--root--padding-right: 0 !important;
    --wp--style--root--padding-bottom: 0 !important;
    --wp--style--root--padding-left: 0 !important;
}

/* ========================================
   ヘッダー・フッターの調整
======================================== */
header,
footer,
.wp-block-template-part {
    max-width: 750px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* ヘッダー・フッターを非表示にする場合は以下のコメントを外す */

header.wp-block-template-part,
footer.wp-block-template-part {
    display: none !important;
}


/* ========================================
   段落・見出しなどのテキスト要素
======================================== */
p,
h1, h2, h3, h4, h5, h6,
.wp-block-heading {
    margin: 0 !important;
    padding: 0 !important;
}

/* ========================================
   リストの余白削除
======================================== */
ul, ol {
    margin: 0 !important;
    padding: 0 !important;
    list-style-position: inside !important;
}

/* ========================================
   ボタンブロックなどの調整
======================================== */
.wp-block-buttons,
.wp-block-button {
    margin: 0 !important;
}

/* ========================================
   スペーサーブロックの調整
======================================== */
.wp-block-spacer {
    margin: 0 !important;
}

/* ========================================
   カスタム投稿タイプページの設定
======================================== */
.post-type-archive,
.single-post,
.page,
.single {
    max-width: 750px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* ========================================
   レスポンシブ設定（SPもPCも750px固定）
======================================== */
@media (max-width: 750px) {
    .wp-site-blocks,
    main,
    .wp-block-post-content,
    .entry-content,
    article {
        max-width: 750px !important;
        width: 100% !important;
    }
    
    /* 750px以下の画面では横スクロールを許可 */
    body {
        overflow-x: auto !important;
    }
}

/* ========================================
   ギャラリーブロックの調整
======================================== */
.wp-block-gallery {
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
}

.wp-block-gallery .wp-block-image {
    margin: 0 !important;
}

/* ========================================
   埋め込みコンテンツの調整
======================================== */
.wp-block-embed,
.wp-block-embed__wrapper {
    margin: 0 !important;
    padding: 0 !important;
}

/* ========================================
   メディア&テキストブロック
======================================== */
.wp-block-media-text {
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
}

/* ========================================
   テーブルブロック
======================================== */
.wp-block-table,
table {
    margin: 0 !important;
    border-spacing: 0 !important;
    border-collapse: collapse !important;
}

/* ========================================
   セパレーターブロック
======================================== */
.wp-block-separator,
hr {
    margin: 0 !important;
}

/* ========================================
   カバーブロック
======================================== */
.wp-block-cover__inner-container {
    padding: 0 !important;
}

/* ========================================
   コンテナクエリ対応
======================================== */
.wp-block-group.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    max-width: 750px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
/* ========================================
   動画やGIF対応
======================================== */
/* カバーブロックの中にある動画（または画像）を強制的にサイズ調整 */
.wp-block-cover .wp-block-video,
.wp-block-cover video,
.lp-inner-media {
    width: var(--lp-video-width, 60%) !important; /* デフォルト60%、後で個別調整可 */
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ついでに、カバー内のコンテンツを上下左右中央に配置する */
.wp-block-cover__inner-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}
