@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
*/

/*===================================================*/
/** 外部リンクにアイコンを付ける **/
/*===================================================*/
.post_content a[target="_blank"]::after {
    content: "\f35d";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-left: .35em;
    font-size: .9em;
    vertical-align: .05em;
}
.footer__widget {
    text-align: center;
}
.footer__widget img {
    margin-left: auto;
    margin-right: auto;
}

/* ファイルブロックの「ダウンロード」ボタンには外部リンクアイコンを付けない */
.wp-block-file__button::after {
    content: none !important;
    display: none !important;
}

/*===================================================*/
/* p-postList__title を持つh2を除外して背景に影を適用 */
/*===================================================*/
h2:not(.p-postList__title) {
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
  
  /* 見映え調整（内側余白・角丸） */
  padding: 0.8em 1em;
  border-radius: 4px;
}

/*===================================================*/
/** メディアとテキスト、および画像ブロックの画像に影 **/
/*===================================================*/
.wp-block-media-text__media img,
.wp-block-image img {
    box-shadow: 2px 6px 20px rgba(0, 0, 0, 0.4) !important;
}


/*===================================================*/
/* 固定ページ：ページタイトル下の余白を小さくする */
/*===================================================*/
/* 1. タイトルの下余白を詰める */
.l-mainContent__inner .c-pageTitle {
    margin-bottom: 5px !important;
    padding-bottom: 5px !important;
}

/* 2. 本文エリア（post_content）の上の隙間を消す */
.l-mainContent__inner .post_content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 3. 本文の最初にある画像（figure）の上の隙間を消す */
.post_content > figure.wp-block-image:first-child,
.post_content > *:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}


/*===================================================*/
/* ブロックリストのスマホ表示件数制限 */
/*===================================================*/
@media screen and (max-width: 767px) {
  
  /* クラス「sp-count-1」を付けた投稿リスト：2件目以降を非表示（＝1件表示） */
  .sp-count-1 .p-postList__item:nth-child(n+2) {
    display: none !important;
  }

  /* クラス「sp-count-2」を付けた投稿リスト：3件目以降を非表示（＝2件表示） */
  .sp-count-2 .p-postList__item:nth-child(n+3) {
    display: none !important;
  }

  /* クラス「sp-count-3」を付けた投稿リスト：4件目以降を非表示（＝3件表示） */
  .sp-count-3 .p-postList__item:nth-child(n+4) {
    display: none !important;
  }

}

/*===================================================*/
/* 投稿リストブロック（テキスト型）の表示カスタマイズ */
/*===================================================*/
/* PC表示時（768px以上）：日付とタイトルを1行で配置し、文字の基準線を揃える */
@media screen and (min-width: 768px) {
  .p-postListWrap .p-postList.-type-simple .p-postList__body {
    display: flex !important;
    flex-direction: row !important; /* 左：日付 / 右：タイトル */
    align-items: baseline !important; /* 文字の高さ（ベースライン）を基準に揃える */
    gap: 1em !important;            /* 日付とタイトルの間の余白 */
  }

  .p-postListWrap .p-postList.-type-simple .p-postList__meta {
    flex-shrink: 0 !important;      /* 日付エリアの崩れ防止 */
    position: relative;
    top: 0px;                       /* 日付位置の微調整（下げる場合は正の数値、上げる場合はマイナス数値） */
  }

  .p-postListWrap .p-postList.-type-simple .p-postList__title {
    margin: 0 !important;
  }
}

/* 全画面共通：日付の太字化とサイズ調整 */
.p-postListWrap .p-postList.-type-simple .c-postTimes,
.p-postListWrap .p-postList.-type-simple .c-postTimes * {
  font-weight: 700 !important;    /* 太字 */
  font-size: 1.15em !important;    /* やや大きめ */
  color: #333 !important;         /* 文字色 */
}

/*===================================================*/
/* 前後の記事ナビゲーション全体を縦並びにする */
/*===================================================*/
@media screen and (max-width: 768px) {
    /* 前後の記事ナビゲーション全体を縦並びにする */
    .l-articleBottom .p-pnLinks.-style-simple {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }
    
    /* 各リンクアイテムの幅を100%にして、左右の回り込みを解除 */
    .l-articleBottom .p-pnLinks__item {
        width: 100% !important;
        float: none !important;
    }
    
    /* リンク自体のレイアウト調整 */
    .l-articleBottom .p-pnLinks__link {
        display: flex !important;
        align-items: center !important;
        padding: 10px 12px !important;
        box-sizing: border-box !important;
    }

    /* タイトルが長い場合に綺麗に折り返すようにする */
    .l-articleBottom .p-pnLinks__title {
        display: inline-block !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
}

/*===================================================*/
/* カテゴリー・アーカイブページのサブタイトル（category）を非表示 */
/*===================================================*/
/* カテゴリーページのサブタイトル（– category –）を非表示 */
.c-pageTitle__subTitle {
    display: none !important;
}

/*===================================================*/
/* 特定のカテゴリーページの日付を非表示にする */
/*===================================================*/
/* 礼拝  スラッグ設定２箇所*/
.category-worship .p-postList__times,
.category-worship .c-postThumb__date,
/* 教会物語  スラッグ設定２箇所 */
.category-story .p-postList__times,
.category-story .c-postThumb__date {
    display: none !important;
}

/*===================================================*/
/* 特定のカテゴリーページの投稿日を大きく・太字にする */
/*===================================================*/
.category-news .p-postList__item .c-postTimes {  /* お知らせ */
    font-size: 1.2em;   /* 文字の大きさ */
    font-weight: bold;   /* 太字にする */
    color: #333;         /* 文字色 */
}

/*===================================================*/
/* カテゴリーページ：ページタイトル下の余白を減らす */
/*===================================================*/
/* カテゴリーページ：タイトル下の外余白を小さく */
.l-mainContent .c-pageTitle {
    margin-bottom: 16px !important;
}

/* カテゴリーページ：説明文エリアの上下外余白・枠線をリセット */
.l-mainContent .p-termHead {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin-top: 5px !important;    /* タイトルと説明文の間の余白 */
    margin-bottom: 12px !important; /* 説明文と記事一覧の間の余白 */
}

/* 説明文内の文章の余白をゼロに */
.l-mainContent .p-termHead__desc {
    margin: 0 !important;
    padding: 0 !important;
}

/*===================================================*/
/* PC表示時：教会物語（story）カテゴリーを強制的に2カラムにする */
/*===================================================*/
@media screen and (min-width: 960px) {
    .category-story .p-postList.-type-card {
        display: flex;
        flex-wrap: wrap;
    }
    .category-story .p-postList.-type-card > .p-postList__item {
        width: calc(50% - 15px) !important; /* 2カラム幅（余白考慮） */
    }
}

/*===================================================*/
/* 前後記事リンクのテキストサイズを大きくする */
/*===================================================*/
/* --- 前後記事リンク全体の基本設定 (PC基準) --- */
.p-pnLinks__title {
    font-size: 1.05rem !important;
    font-weight: bold;
}

/* --- スマホ表示時の調整 (767px以下) --- */
@media (max-width: 767px) {
    .p-pnLinks__title {
        font-size: 1.0rem !important;
        word-break: keep-all;
        overflow-wrap: break-word;
    }
}

/* --- 右側（次の記事）リンクの矢印と文字の隙間を詰める --- */
.p-pnLinks__item.-next .p-pnLinks__link {
    justify-content: flex-end;
}

.p-pnLinks__item.-next .p-pnLinks__title {
    text-align: right;
    display: inline-block;
}

/*===================================================*/
/** ファイルへのリンクカスタマイズ **/
/*===================================================*/
.wp-block-file {
    display: flex;
    align-items: center;
    gap: 0.8em;
    padding: 0.5em 0;
}
/* ファイル名リンク */
.wp-block-file > a:first-child {
    display: inline-flex;
    align-items: center;
}
/* ダウンロードボタン */
.wp-block-file .wp-block-file__button {
    margin-left: 0;
    display: inline-flex;
    align-items: center;
    background-color: #664e1e;
    color: #fff;
    padding: 0.5em 1em;
    font-size: 1em;
    line-height: 1.4;
    border-radius: 4px;
    text-decoration: none;
}
.wp-block-file .wp-block-file__button:hover {
    background-color: #4f3d18;
    color: #fff;
}

/* PDFファイルへのリンクにPDFアイコンを表示 */
.wp-block-file > a:not(.wp-block-file__button)[href$=".pdf"]::before {
    content: "";
    display: inline-block;
    width: 38px;
    height: 48px;
    margin-right: 8px;
    vertical-align: middle;
    background: url("https://test.uccj.jp/i-eikou/wp-content/uploads/2026/08/icon-pdf.png") no-repeat center / contain;
}

/*===================================================*/
/* 本文直下の最初のH2の上の塗りつぶし領域を正常化 */
/*===================================================*/
.post_content {
    display: flow-root !important;
}

.post_content > h2:first-child,
.post_content > h2.wp-block-heading:first-of-type {
    padding-top: 0.6em !important; /* 上の塗りつぶし範囲を確保 */
    margin-top: 1.5em !important;  /* 上の要素（アイキャッチ等）との距離 */
}

/*===================================================*/
/* カテゴリ「礼拝」の投稿ページのペンアイコンを十字架（Font Awesome）に変更 */
/*===================================================*/
/* カテゴリ「礼拝」のペンアイコン（十字架）段落を自動で太字にする */
.category-worship p.is-style-icon_pen {
    font-weight: bold; /* テキスト全体を太字に指定 */
}

/* アイコン自体の設定（既存のコード） */
.category-worship p.is-style-icon_pen::before {
    content: "\f654" !important;
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
}


/*===================================================*/
/** 投稿ページでアイキャッチ画像にタイトルを重ねる（礼拝カテゴリー） **/
/*===================================================*/
.category-worship .l-mainContent__inner > .p-articleHead.c-postTitle {
    position: relative !important;
    z-index: 10 !important;
    top: 100px !important;
    margin-bottom: -100px !important;
    padding: 20px 50px !important;
}

/* タイトル */
.category-worship .l-mainContent__inner > .p-articleHead.c-postTitle .c-postTitle__ttl {
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-size: 4rem !important;
    font-weight: 700;
    line-height: 1.5;
    text-align: left;
    text-shadow:
        0 2px 5px rgba(0,0,0,.8),
        0 1px 10px rgba(0,0,0,.6);
}

/* 日付を非表示 */
.category-worship .l-mainContent__inner > .p-articleHead.c-postTitle .c-postTitle__date {
    display: none !important;
}

/* スマホ */
@media (max-width: 767px) {
    .category-worship .l-mainContent__inner > .p-articleHead.c-postTitle {
        top: 60px !important;
        margin-bottom: -60px !important;
        padding: 15px 20px !important;
    }
    .category-worship .l-mainContent__inner > .p-articleHead.c-postTitle .c-postTitle__ttl {
        font-size: 2.0rem !important;
    }
}


/*===================================================*/
/** 投稿リストブロック「礼拝の動画・週報」のサムネイルにタイトルを重ねる **/
/*===================================================*/
.worship-post-list .p-postList__link {
    position: relative !important;
    display: block;
}

.worship-post-list .p-postList__body {
    position: absolute !important;
    z-index: 10 !important;
    top: 0 !important;
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 15px 12px !important;
    background: none !important;
}

.worship-post-list .p-postList__title {
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-size: 1.6rem !important;
    font-weight: 700;
    line-height: 1.5;
    text-align: left;
    text-shadow:
        0 2px 5px rgba(0, 0, 0, 0.85),
        0 1px 10px rgba(0, 0, 0, 0.7);
}

.worship-post-list .p-postList__meta {
    display: none !important;
}

/* スマホ（2.0remで指定） */
@media (max-width: 767px) {
    .worship-post-list .p-postList__body {
        padding: 12px 15px !important;
    }
    .worship-post-list .p-postList__title {
        font-size: 2.0rem !important;
    }
}

/*===================================================*/
/** 礼拝カテゴリー一覧サムネイルにタイトルを重ねる **/
/*===================================================*/

.category-worship .p-postList__item {
    position: relative !important;
}

.category-worship .p-postList__body {
    position: absolute !important;
    z-index: 10 !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 18px 25px !important;
    background: none !important;
}

.category-worship .p-postList__title {
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-size: 1.5rem !important;
    font-weight: 700;
    line-height: 1.5;
    text-align: left;
    text-shadow:
        0 2px 5px rgba(0, 0, 0, .85),
        0 1px 10px rgba(0, 0, 0, .7);
}

/* スマホ用の文字サイズ調整 */
@media (max-width: 767px) {
    .category-worship .p-postList__body {
        padding: 12px 15px !important;
    }
    .category-worship .p-postList__title {
        font-size: 1.8rem !important;
    }
}

/*===================================================*/
/** SWELLアコーディオンカスタマイズ **/
/*===================================================*/
.accordion-brown .swell-block-accordion__title {
    background: #f9f0e2;
}
.swell-block-accordion__title {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

/*===================================================*/
/** 投稿ページ下部のコメント欄カスタマイズ **/
/*===================================================*/
.p-commentArea {
    padding: 25px 30px;
}

#comments > .l-articleBottom__title {
    display: none;
}

.comment-respond,
.comment-form {
    width: 100%;
    max-width: none;
    margin-top: 0;
}

.comment-form p {
    margin-bottom: 12px;
}

.comment-form label {
    margin-bottom: 4px;
}

.comment-form-comment {
    margin-top: 0;
}

.p-commentArea__title.-for-write {
    margin-bottom: 15px;
}

.p-commentArea__title.-for-write .my-comment-title {
    font-weight: 700;
}

.p-commentArea__title.-for-write .my-comment-description {
    font-weight: 400;
}

.comment-form-comment textarea {
    width: 100%;
    max-width: 100%;
    height: 120px;
    min-height: 120px;
    box-sizing: border-box;
}

.comment-form-author input {
    width: 100%;
    max-width: 100%;
    padding: 8px 10px;
    box-sizing: border-box;
}

#submit {
    border-radius: 6px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    padding: 10px 28px;
    transition: 0.2s ease;
}

#submit:hover {
    box-shadow: 0 5px 10px rgba(0,0,0,0.25);
    transform: translateY(-1px);
}

/*===================================================*/
/** コメント送信完了ポップアップ（モーダル） **/
/*===================================================*/
.my-comment-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 99999;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;
    transition: opacity 0.25s ease;
}

.my-comment-modal-overlay.-fade-out {
    opacity: 0;
}

.my-comment-modal {
    background: #fff;
    width: 90%;
    max-width: 440px;
    padding: 32px 24px 28px;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    text-align: center;
    box-sizing: border-box;
    animation: myModalScale 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@keyframes myModalScale {
    0% { transform: scale(0.85); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

.my-comment-modal__title {
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0 0 12px 0;
    color: #333;
}

.my-comment-modal__message {
    font-size: 0.95rem;
    line-height: 1.65;
    color: #555;
    margin-bottom: 24px;
    text-align: left;
}

.my-comment-modal__btn {
    background-color: #664e1e; /* サイトのメインカラーに合わせて調整可 */
    color: #fff;
    border: none;
    padding: 10px 32px;
    font-size: 0.95rem;
    font-weight: 700;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.my-comment-modal__btn:hover {
    background-color: #4f3d18;
}

/* ページ内に出力されるデフォルトの承認待ちプレビュー・案内を非表示化 */
.comment-awaiting-moderation,
.p-commentList__item.-unapproved {
    display: none !important;
}

/*===================================================*/
/* 投稿リストページのタイトルカスタマイズ */
/*===================================================*/
/* 「お知らせ」カテゴリーページのみサブタイトル（– category –）を非表示 */
.category-news .c-pageTitle__subTitle {
    display: none !important;
}

/*===================================================*/
/* 記事下部のカテゴリーメタエリア全体を非表示 */
/*===================================================*/
.p-articleFoot .p-articleMetas.-bottom {
    display: none !important;
}

/*===================================================*/
/* テキスト型リストで日付とタイトルの配置を調整 */
/*===================================================*/
/* お知らせ一覧のテキスト型リストで日付とタイトルの配置を調整 */
.category-news .p-postList.-type-simple .p-postList__body {
    display: flex;
    align-items: center;
    gap: 1em;
}

.category-news .p-postList.-type-simple .p-postList__meta {
    margin-bottom: 0;
    flex-shrink: 0;
}

.category-news .p-postList.-type-simple .p-postList__date {
    font-size: 0.85em;
    color: #666;
}

/* スマホ表示で日付とタイトルを改行したい場合はこちら（お好みで） */
@media screen and (max-width: 600px) {
    .category-news .p-postList.-type-simple .p-postList__body {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.3em;
    }
}

/*===================================================*/
/** スライダーのキャプションの高さ **/
/*===================================================*/
.n2-ss-widget.nextend-bar .n2-style-c371bed12e94c3d9e638bf8bdeb281dd-simple {
    padding: 3px 10px !important;
}