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

/* =======================================

// Google Fonts - M PLUS Rounded 1c の読み込み

// ======================================= */

@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400;700;800&display=swap');

/* =======================================

// メインビジュアル オーバーレイカラーの不透明度設定

// ======================================= */

.p-mainVisual__overlay {
    background-color: rgba(0, 0, 0, 0.4) !important; /* 例: 黒の40%不透明度 */
}

/* =======================================

// ロゴ設定（見えやすさ、サイズ調整）

// ======================================= */

/* PCでのロゴのスタイル */
.c-header__logo img {
    max-width: 200px !important; /* PCでのロゴ画像の最大幅を設定 */
    height: auto !important;
    margin-left: auto !important; /* 中央揃え */
    margin-right: auto !important; /* 中央揃え */
    display: block !important;    /* 中央揃え */
}

/* スマホでのロゴのスタイル */
@media screen and (max-width: 767px) {
    .c-header__logo img {
        max-width: 150px !important; /* スマホでのロゴ画像の最大幅を設定 */
        height: auto !important;
    }
}

/* =======================================

// メインビジュアルのテキスト表示調整 & 視認性向上

// ======================================= */

/* PC表示時（768px以上）のテキスト調整 */

/* SWELLの提案に基づき、より詳細度を上げるセレクタを試行 */

@media screen and (min-width: 768px) {
    /* メインテキスト（タイトル） */
    .p-mainVisual__slideTitle.p-mainVisual__slideTitle {
        font-family: 'M PLUS Rounded 1c', sans-serif !important;
        font-weight: 800 !important;
        /* font-size: 40px !important; */ /* 必要であればコメントアウトを外して調整し、!importantを追加 */
        /* line-height: 1.3 !important; */ /* 必要であればコメントアウトを外して調整し、!importantを追加 */
        text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8) !important;
    }

    /* サブテキスト */
    .p-mainVisual__slideText.p-mainVisual__slideText {
        font-family: 'M PLUS Rounded 1c', sans-serif !important;
        font-weight: 400 !important;
        /* font-size: 18px !important; */ /* 必要であればコメントアウトを外して調整し、!importantを追加 */
        /* line-height: 1.6 !important; */ /* 必要であればコメントアウトを外して調整し、!importantを追加 */
        text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.7) !important;
    }
}

/* スマホ表示時（767px以下）のテキスト調整 - SWELLの提案に基づき詳細度を上げる */
@media screen and (max-width: 767px) {
    /* メインテキスト（タイトル） */
    .p-mainVisual__slideTitle.p-mainVisual__slideTitle {
        font-family: 'M PLUS Rounded 1c', sans-serif !important;
        font-weight: 800 !important;
        font-size: 26px !important; /* スマホでのフォントサイズ。この値を調整してください */
        line-height: 1.4 !important; /* スマホでの行間。必要であれば調整 */
        text-shadow: 2px 2px 6px rgba(0, 0, 0, 1) !important;
        color: #ffffff !important;
    }

    /* サブテキスト */
    .p-mainVisual__slideText.p-mainVisual__slideText {
        font-family: 'M PLUS Rounded 1c', sans-serif !important;
        font-weight: 400 !important;
        font-size: 14px !important; /* スマホでのフォントサイズ。この値を調整してください */
        line-height: 1.6 !important; /* スマホでの行間。必要であれば調整 */
        text-shadow: 1px 1px 5px rgba(0, 0, 0, 1) !important;
        color: #f0f0f0 !important;
    }
}

/* 記事リストのカスタマイズ */
.p-postList.-type-card .p-postList__link {
    display: flex;
    flex-direction: column;
}

.p-postList.-type-card .p-postList__meta,
.p-postList.-type-card .p-postList__body {
    display: contents;
}

.p-postList.-type-card .p-postList__excerpt {
    display: none;
}

.p-postList.-type-card .p-postList__cat {
    order: -3; /* カテゴリを最上部 */
    font-size: 1.5em;
    font-weight: bold;
    color: #dd3333;
}

.p-postList.-type-card .p-postList__times {
    order: -2; /* 日付を2番目 */
    font-size: 1.2em;
    color: #666;
    margin-bottom: 12px;
}

.p-postList.-type-card .p-postList__thumb {
    order: -1; /* サムネイルを3番目 */
    margin-bottom: 12px;
}

/* タイトルを最下部 */
.p-postList.-type-card .p-postList__title {
    order: 0;
    font-size: 1.2em;
    color: #333;
}

/* リストの行間調整 */
.post_content li {
    line-height: 1.5;
    margin: 0.20em 0;
    position: relative;
}

/* アイコン非表示 */
.icon-folder:before,
.icon-posted:before {
    content: none;
}

/* 画像の角に丸み */
.photo img {
    border-radius: 30px; /* 4つの角を一括指定 */
}

/* ホバー時の拡大をオフ */
.p-postList__link:hover .c-postThumb__img {
    transform: none;
}

/* 特定の投稿リストブロックのアイキャッチを正方形 */
.p-postListWrap.custom-square .c-postThumb__figure {
    aspect-ratio: 1/1;
}

/* 特定の投稿リストブロックのアイキャッチを正方形 */
.p-postListWrap.custom-square2 .c-postThumb__figure {
    --card_posts_thumb_ratio: 120%;
}