@charset "utf-8";

/* ------------------------------------------------------------------------------------------ */
/* WP */

/* WP - テーブル */
.wp-block-table { margin-bottom: 1.5rem; }
.wp-block-table :is(th, td) { height: 2.5em; }
.wp-block-table :is(thead, tfoot) { background-color: var(--c-main); border-width: 1px; }
.wp-block-table :is(thead, tfoot) :is(th, td) { color: white; border: 1px solid black;}
.wp-block-table tbody { background-color: white; }
.wp-block-table figcaption { margin-top: 0.75em; }

/* WP - 画像 */
.wp-block-image figcaption { margin-top: 0.75em; }

/* WP - ボタン */
.wp-block-buttons, .wp-element-button { font-size: var(--fs_s); }
.wp-element-button { color: black; padding: 1em; background-color: var(--color2); border-radius: 9999px; transition: scale 0.3s; }
.wp-element-button:hover { color: var(--c-sub); background-color: var(--color2_hover); scale: 1.03; }
@media only screen and (min-width: 751px) { /* PC */
  .wp-block-buttons { margin-bottom: 1em; gap: 1em 0.75em; }
  .wp-element-button { display: inline-block; min-width: 120px; padding: 15px 20px; }
}
@media only screen and (max-width: 750px) { /* SP */
  .wp-block-buttons { flex-direction: column; margin-bottom: 1.5em; gap: 3vw; }
  .wp-block-button { width: 75%; }
  .wp-element-button { display: flex; justify-content: center; padding: 3vw 3vw; }
}

/* WP - YouTube埋め込み */
.wp-block-embed-youtube { max-width: 500px; }
.wp-block-embed-youtube .wp-block-embed__wrapper { position: relative; width: 100%; height: 0; padding-top: 50%; margin-bottom: 15px; }
@media only screen and (max-width: 750px) { .wp-block-embed-youtube .wp-block-embed__wrapper { margin-bottom: 2.5vw; } } /* SP */
.wp-block-embed-youtube .wp-block-embed__wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.wp-block-embed__wrapper :has(.twitter-tweet.twitter-tweet-rendered) { background-color: aqua; width: 100%; max-width: 100%; overflow: hidden; }

/* WP - X(Twitter) カスタムHTML */
.twitter-tweet.twitter-tweet-rendered { max-width: 100%; margin-block: 0 15px; }
@media only screen and (max-width: 750px) { .twitter-tweet.twitter-tweet-rendered { margin-block: 0 2.5vw; } } /* SP */
.twitter-tweet-rendered iframe { width: 100%; max-width: 100%; }

/* WP - ファイル */
.wp-block-file > a:first-of-type { display: none; }


/* ------------------------------------------------------------------------------------------ */
/* 固定ページ（独自）の設定 */
.mywp_page_basic { margin: 7rem auto 7rem; padding-inline: var(--container-padding-inline); max-width: var(--container-width); }
@media (max-width: 750px) { .mywp_page_basic { padding-inline: 0; } } /* SP */

/* 段落 */
.mywp_page_basic p { letter-spacing: 0.05em; line-height: 1.6; word-wrap: break-word; min-width: 0; word-break: break-all; }
.mywp_page_basic p + p { margin-top: 1em; }

/* 区切り */
.mywp_page_basic .wp-block-separator { border-top: 1px solid black; margin-block: 6rem; }

/* カバー */
.mywp_page_basic__cover { min-height: 280px; height: 280px; }
@media (max-width: 750px) { .mywp_page_basic__cover { min-height: 33vw; height: 33vw; } }

/* グリッドのカラム（.col-2, .col-3 は、自分で命名） */
.mywp_page_basic .is-layout-grid { --mywp-gap-inline: 4.5vw; gap: calc(var(--mywp-gap-inline) * 0.88) var(--mywp-gap-inline); }
@media (min-width: 751px) { /* PC */
  .mywp_page_basic .is-layout-grid { --mywp-gap-inline: 3rem; }
  .mywp_page_basic .is-layout-grid:is(.col-2, .col-3) .wp-block-group { position: relative; }
  .mywp_page_basic .is-layout-grid.col-2 .wp-block-group:nth-child(even)::after,
  .mywp_page_basic .is-layout-grid.col-3 .wp-block-group:is(:nth-child(2n), :nth-child(3n))::after { position: absolute; content: ""; top: 0; bottom: 0; left: calc(var(--mywp-gap-inline) * 2 / 3 * (-1)); border-right: 1px dotted black; }
}

/* 見出し */
.mywp_page_basic__h1 { font-family: var(--font_serif); font-size: var(--fs_xl); font-weight: 700; line-height: 1.2em !important; letter-spacing: 0.1em; color: var(--c-sub); border: 1px solid var(--c-sub); display: table; margin: 0 auto 1.5em; padding: 0.2em 0.6em 0.26em; border-radius: 9999px; }
.mywp_page_basic h2 { margin-top: -0.2em; margin-bottom: 1.2em; font-family: var(--font_serif); font-size: var(--fs_l); font-weight: 700; color: var(--c-main); letter-spacing: 0.07em; line-height: 1.5em; }
.mywp_page_basic h3 { margin-bottom: 0.5em; font-family: var(--font_serif); font-size: var(--fs_m); font-weight: 700; color: var(--c-sub); letter-spacing: 0.07em; line-height: 1.5em; }