/*H3見出し*/
main h3.wp-block-heading {
	color: #000;
/*文字色（黒）*/
	font-size: 30px;
/*文字サイズ*/
	padding: 15px 10px;
/*文字回りの余白（上下 左右）*/
	display: block;
	position: relative;
}

main h3.wp-block-heading:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 2.5%;
	transform: translate(-50%, -50%);
	width: 3.5em;
/*円の幅*/
	height: 3.5em;
/*円の高さ*/
	background-color: /*円の色（グレー）*/
#00eeee;
	border-radius: 50%;
	z-index: -1;
}

/*H2見出し*/
main h2.wp-block-heading {
	color: #6d5353;
/*文字色*/
	font-size: 30px;
/*文字サイズ*/
	display: block;
	border: 2px dashed #816930;
/*吹き出し線（太さ 破線 色）*/
	position: relative;
	padding: 1em;
/*文字回りの余白（上下左右）*/
	border-radius: 30px;
/*吹き出し角丸サイズ（四隅）*/
	display: block;
}

main h2.wp-block-heading:before {
	content: "";
	position: absolute;
	bottom: -7px;
	left: 20%;
/*吹き出しの矢印部の左右位置*/
	transform: translateX(-50%) rotate(-45deg);
	width: 10px;
	height: 10px;
	border: 2px dashed #816930;
/*吹き出しの矢印部の線（太さ 破線 色）*/
	border-top: none;
	border-right: none;
	background-color: #efece0;
/*吹き出しの矢印部の内側背景*/
}

main h2.wp-block-heading:after {
	content: '';
	background: #efece0;
/*背景色*/
	left: 4px;
/*背景左右ずれ*/
	top: 10px;
/*背景上下ずれ*/
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: -1;
	border-radius: 30px;
/*背景角丸サイズ（四隅）*/
}

/*H4見出し*/
main h4.wp-block-heading {
	color: #576965;
/*文字色*/
	font-size: 20px;
	padding: 30px 20px 15px;
/*文字回りの余白（上 左右 下）*/
	display: block;
	position: relative;
}

main h4.wp-block-heading:before {
	content: '';
	background: #6fd8dd;
/*背景色*/
	width: calc(100% + 3px);
	height: calc(100% + 3px);
	position: absolute;
	top: 0;
	left: 6px;
	z-index: -1;
	transform: rotate(1.5deg);
/*背景影部の回転*/
}

main h4.wp-block-heading:after {
	content: '';
	background: #fff;
/*背景色（白）*/
	border: 3px solid #6fd8dd;
/*背景白部の囲み線（太さ 実線 色*/
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: -5px;
	z-index: -1;
	transform: rotate(-.5deg);
/*背景白部の回転*/
}

/*H6見出し*/
main h6.wp-block-heading {
	background-color: #eaf6fd;
/*背景色*/
	border-right: 23px solid #9fd9f6;
/*右線（太さ 実線 色）*/
	color: #000;
/*文字色（黒）*/
	display: block;
	font-size: 20px;
/*文字サイズ*/
	padding: .5em .8em;
/*文字回りの余白（上下 左右）*/
	position: relative;
}

main h6.wp-block-heading:before {
	background-color: #e8e8e8;
/*影の色（グレー）*/
	bottom: 2px;
/*影の上下位置*/
	content: "";
	filter: blur(3px);
/*影のぼかし度合い*/
	height: 50%;
	position: absolute;
	right: -10px;
	transform: rotate(2deg);
/*影の回転*/
	width: 100%;
	z-index: -1;
}

/* 右上に逃げた文字をカレンダーの枠内に強制収容する魔法 */
.mc-main {
    display: block !important;
    position: static !important;
    float: none !important;
    clear: both !important;
    text-align: left !important;
    width: 100% !important;
}

/* 逃げた文字たちがバラバラにならないように整列させる */
.mc-main * {
    position: static !important;
}

/* カレンダーのヘッダー（月やボタン）を上に戻す */
.my-calendar-header {
    margin-top: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
}

/* イベント名の斜体を直して、読みやすくする */
.mc-main .calendar-event .event-title, 
.mc-main .calendar-event i, 
.mc-main .calendar-event em {
    font-style: normal !important; /* 斜体を解除 */
    font-weight: bold !important;  /* 太字にして見やすくする */
    display: block !important;    /* 1行でしっかり表示 */
}

/* 日曜日の色（赤） */
.mc-main .sun .mc-date {
    color: #d9534f !important; /* 文字を赤に */
    font-weight: bold !important;
}
.mc-main .sun {
    background-color: #ffb5b5 !important; /* 背景をほんのり薄赤に */
}

/* 土曜日の色（青） */
.mc-main .sat .mc-date {
    color: #428bca !important; /* 文字を青に */
    font-weight: bold !important;
}
.mc-main .sat {
    background-color: #b5b5ff !important; /* 背景をほんのり薄青に */
}

/* 曜日の見出し（月火水...）の部分も色を変える場合 */
thead .sun { color: #d9534f !important; }
thead .sat { color: #428bca !important; }

/* --- スマホ用：リスト表示をコンパクトに整える --- */
@media (max-width: 768px) {
    /* ① 枠の隙間をかなり減らす */
    .mc-main.list {
        padding: 0 !important;
        margin: 0 !important;
    }
    .mc-main.list li {
        background: #ffffff !important;
        border-left: 4px solid #d9534f !important;
        margin-bottom: 5px !important; /* 15pxから5pxに大幅短縮 */
        padding: 8px 12px !important; /* 中の余白もキュッと凝縮 */
        box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
        border-radius: 3px !important;
    }

    /* ② 日付とイベント名の文字を小さくする（14px） */
    /* 日付部分 */
    .mc-main.list .event-date {
        font-size: 14px !important;
        font-weight: bold !important;
        color: #666 !important;
    }
    /* イベント名部分 */
    .mc-main.list .event-title {
        font-size: 14px !important;
        font-weight: bold !important;
        color: #333 !important;
        display: block !important;
        margin-top: 2px !important;
    }
    /* ついでに時間などの補足も小さく */
    .mc-main.list .time-block, 
    .mc-main.list .description {
        font-size: 13px !important;
    }
}

/* 「購読」「Googleで」「iCalで」などのフィードリンクをすべて隠す */
.mc-export, 
.calendar-feeds, 
.rssproxy {
    display: none !important;
}

@media (max-width: 768px) {
    /* 1. カレンダー全体の外枠の制限を解除する */
    .mc-main {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* 2. リスト本体（ulタグ）の余白を完全になくす */
    .mc-main.list {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* 3. 各イベントカード（liタグ）を横幅いっぱいに広げる */
    .mc-main.list li {
        width: 100% !important;
        box-sizing: border-box !important; /* 枠線を含めて100%にする */
        margin-left: 0 !important;
        margin-right: 0 !important;
        border-radius: 0 !important; /* 端まで広げるなら角丸はない方がスッキリします */
    }

    /* 4. もしページ全体の左右に余白がある場合、それを強制的に埋める */
.mc-main .entry-content, .post-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
	@media (max-width: 768px) {
    /* 1. 日曜日のカード（左端を赤く、背景をほんのりピンクに） */
    .mc-main.list li.sunday {
        border-left: 6px solid #d9534f !important; /* 濃い赤 */
        background-color: #fff5f5 !important; /* ごく薄い赤 */
    }

    /* 2. 土曜日のカード（左端を青く、背景をほんのり水色に） */
    .mc-main.list li.saturday {
        border-left: 6px solid #428bca !important; /* 濃い青 */
        background-color: #f5faff !important; /* ごく薄い青 */
    }
    
    /* 3. 日付の数字の横に、曜日（日）（土）を自動で付け足す魔法の命令 */
    .mc-main.list li.sunday .event-date::after {
        content: "（日）";
        color: #d9534f;
    }
    .mc-main.list li.saturday .event-date::after {
        content: "（土）";
        color: #428bca;
    }
    
}
	
/* --- カレンダーのリスト表示だけをスリムにする（他には影響させない） --- */

/* 「.my-calendar-list」というカレンダー専用のクラスを先頭につけます */
.mc-main .my-calendar-list li,
.mc-main .mc-list-details {
    background: #ffffff !important;
    border: 1px solid #ccc !important;   /* 枠線を少し細く */
    border-left: 5px solid #666 !important; /* 左のアクセント線 */
    margin-bottom: 8px !important;       /* 枠同士の隙間 */
    padding: 6px 10px !important;        /* 枠内の余白：ここをお好みの狭さに */
    border-radius: 4px !important;
    list-style: none !important;
}

/* カレンダー以外のページにある「グループ」や「リスト」の余白を強制的に守る（念のため） */
body:not(.post-type-archive-my-calendar) .wp-block-group {
    /* ここには何も書かなくてOKですが、カレンダー以外を指定するお守りです */
}

/* 2. イベントタイトルの文字サイズを14pxに */
.mc-main.list .event-title {
    font-size: 14px !important;          /* ご希望のサイズに固定 */
    font-weight: bold !important;
    line-height: 1.3 !important;         /* 行間を詰める */
    margin: 0 !important;                /* タイトル周りの余白をゼロに */
    display: block !important;
}

/* 3. 日付・時間などの補足情報も小さくスリムに */
.mc-main.list .event-time, 
.mc-main.list .event-date,
.mc-main.list .event-details {
    font-size: 12px !important;          /* タイトルより一回り小さく */
    color: #666 !important;
    margin: 0 5px 0 0 !important;
}

/* 4. もしリンクに下線が出ていたら消す */
.mc-main.list .event-title a {
    text-decoration: none !important;
}
	
	/* --- スマホ・リスト表示：再調整版 --- */

/* 1. 日付を16pxにして目立たせる */
.mc-main.list .event-date,
.mc-main.list .event-time {
    font-size: 16px !important;    /* ご希望のサイズにアップ */
    font-weight: bold !important;  /* 日付は重要な情報なので少し太めに */
    color: #333 !important;        /* 文字色も少し濃くして視認性をアップ */
    display: inline-block !important;
    margin-bottom: 2px !important;
}

/* 2. 「カテゴリー別に絞り込む」という表記（フォーム）を消す */
/* My Calendarの標準的なセレクタを複数指定して確実に消します */
.mc-main .mc_filters, 
.mc-main .category-key,
.mc-main form.mc-filters {
    display: none !important;
}

/* 3. タイトル（14px）と日付（16px）のバランス調整 */
.mc-main.list .event-title {
    font-size: 14px !important;
    font-weight: normal !important; /* 日付を主役にするためタイトルは標準の太さに */
    display: block !important;
}
	
	/* カレンダー（PC）とリスト（スマホ）共通：イベントタイトルのフォントサイズ設定 */
.mc-main .event-title, 
.mc-main .event-title a,
.mc-main .calendar-event a {
    font-size: 18px !important;
    line-height: 1.4 !important; /* 行間を適切に保ち、読みやすくします */
    text-decoration: none !important;
}

/* PC版のマス目内で文字が大きすぎてはみ出るのを防ぐ設定 */
.mc-main .mcalendar .event-title {
    word-break: break-all; /* 長い単語でも枠内で折り返すようにします */
}
	
	/* リスト表示のタイトルを強制修正 */
.mc-main.list .event-title, 
.mc-main.list .event-title a {
    font-size: 18px !important;    /* ご希望の18pxに強制 */
    text-align: left !important;   /* 中央揃えを解除して左揃えに */
    display: block !important;
    width: 100% !important;        /* 横幅いっぱい使う */
    line-height: 1.4 !important;   /* 行間を少し広げて読みやすく */
    margin: 0 !important;
    padding: 0 !important;
}

/* もし18pxでもまだ2文字で折り返される場合は、ここを14px〜16pxに調整してください */
	
	/* --- タイトルサイズを18pxに強制変更する全方位コード --- */

/* My Calendarのあらゆる階層のタイトルを狙い撃ち */
.mc-main .event-title,
.mc-main .event-title a,
.mc-main h3.event-title,
.mc-main h2.event-title,
.mc-main .calendar-event a,
.mc-main .vevent .event-title,
.mc-main .mcalendar .event-title {
    font-size: 18px !important;
    text-align: left !important; /* 中央揃えを左揃えに矯正 */
    display: block !important;
    width: 100% !important;
    line-height: 1.3 !important;
}

/* WordPressテーマがよく使う「タイトル用」のクラスもMy Calendar内なら18pxにする */
.mc-main h1, .mc-main h2, .mc-main h3, .mc-main h4,
.mc-main .wp-block-post-title,
.mc-main .entry-title {
    font-size: 18px !important;
    text-align: left !important;
    margin: 0 !important;
}
	
/* カレンダーの中にある「詳細」ブロックだけ、余白をなくして横幅を広げる */
.mc-main .wp-block-details {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* カレンダーの中にある詳細ブロックの中身だけを広げる */
.mc-main .wp-block-details > *:not(summary) {
    width: 100% !important;
    max-width: 100% !important;
}
	
	/* 詳細ブロックのタイトル（summary）のフォントサイズを変更 */
.wp-block-details summary {
    font-size: 20px;
    font-weight: bold; /* 太字にしたい場合はこの行を残してください */
    cursor: pointer;   /* マウスを乗せた時に指のマークにする */
}
	
	/* 「詳細」ブロックのタイトル部分を強制的に20pxにする */
.mc-main .wp-block-details summary {
    font-size: 20px !important;
}
	
	/* 詳細ブロック展開時の挙動を安定させる */
.mc-main .wp-block-details summary:focus {
    outline: none; /* フォーカス時の枠線を消す */
}
	
	/* スマホの横揺れ・ハミ出し防止 */
.mc-main .wp-block-details {
    overflow-wrap: break-word; /* 長い英単語などを改行させる */
    word-break: break-all;
    overflow: hidden;         /* 枠からはみ出た部分を隠す */
    max-width: 100%;          /* 親要素の幅を超えない */
    box-sizing: border-box;   /* 余白を幅に含める */
}

/* 中身の要素も強制的に幅に収める */
.mc-main .wp-block-details > * {
    max-width: 100% !important;
    box-sizing: border-box !important;
}
	
@media screen and (max-width: 767px) {
    /* 画像を無理やり画面の一番手前に持ってくる */
    .single-mc-events .post-thumbnail img,
    .single-mc-events .wp-block-post-featured-image img {
        height: auto !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        width: 100% !important;
        position: relative !important;
        z-index: 9999 !important; /* 矢印より上に表示させる */
    }

    /* 画面全体に出ているかもしれない余計な要素を透明にする */
    .single-mc-events a svg,
    .single-mc-events .wp-block-navigation-item__content svg {
        display: none !important;
    }
}
	
	/* --- ここから：カレンダーボタンの色の修正（2026/01/22追加） --- */
.mc-main .my-calendar-nav a, 
.mc-main .my-calendar-nav button {
    background-color: #0073aa !important; /* ボタンの背景を青に */
    color: #ffffff !important;           /* 文字を白に */
    padding: 8px 15px !important;       /* 押しやすい大きさに */
    text-decoration: none !important;    /* 下線を消す */
    border-radius: 4px !important;       /* 角を少し丸く */
    display: inline-block !important;
    margin: 2px !important;
}

/* 「当月」ボタンだけ色を変える場合（例：グレー） */
.mc-main .my-calendar-nav .my-calendar-today a,
.mc-main .my-calendar-nav .my-calendar-today button {
    background-color: #666666 !important; 
}
/* --- ここまで --- */
	
	/* ボタンを 左・中・右 に分散させる */
.mc-main .my-calendar-nav ul {
    display: flex !important;
    justify-content: space-between !important; /* 両端と中央に広げる */
    align-items: center !important;
    padding: 0 !important;
    margin: 10px 0 !important;
    list-style: none !important;
}

/* 各ボタンが重ならないように調整 */
.mc-main .my-calendar-nav li {
    flex: 1 !important; /* 幅を均等にする */
    text-align: center !important;
}

.mc-main .my-calendar-nav li.my-calendar-prev { text-align: left !important; }   /* 前へは左 */
.mc-main .my-calendar-nav li.my-calendar-next { text-align: right !important; }  /* 次へは右 */
	
	/* 最終月などでAJAXが止まっても、リンクを確実に機能させるためのおまじない */
.mc-main .my-calendar-nav a {
    pointer-events: auto !important;
    cursor: pointer !important;
}

/* カレンダーのナビゲーション全体を、ページを跨いでも安定させる設定 */
.mc-main .my-calendar-nav {
    overflow: hidden;
    clear: both;
}
	
/* サイト全体の詳細ブロック（Details）の内側余白をリセットして幅を広げる */
details.wp-block-details {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* 詳細ブロックの中身のコンテンツ幅を100%にする */
.wp-block-details__content {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
}

/* もし枠線内のテキストが端に寄りすぎる場合は、
   以下の数値を「0」から「1em」などに調整してください */
.wp-block-details__content > * {
    max-width: 100% !important;
}
	
	/* すべての投稿一覧（アーカイブ）を強制的に箇条書き風にする */
.archive article, .blog article {
    display: list-item !important; /* 箇条書き形式を強制 */
    list-style-type: none !important;
    width: 100% !important;
    float: none !important;
    margin-bottom: 20px !important;
    border-bottom: 1px solid #ddd !important;
    padding-bottom: 10px !important;
    box-shadow: none !important;
}

/* 記事タイトルの文字を小さくする（強制） */
.archive .entry-title, .blog .entry-title {
    font-size: 1.2rem !important; /* ほどよく小さく */
    margin: 0 0 10px 0 !important;
}

/* タイトル内のリンクの色や装飾 */
.archive .entry-title a, .blog .entry-title a {
    text-decoration: none !important;
    color: #333 !important;
}

/* 不要な「枠」や「カード」の装飾を剥がす */
.archive-card, .post-card {
    border: none !important;
    background: transparent !important;
}