@charset "utf-8";
/* CSS Document */

/*
///////////////////////////////////////////////////////////////////
▼仕分け前
///////////////////////////////////////////////////////////////////
*/


/* ハンバーガーメニュー最下部のECバナー */
.kakou-menu-banners {
  width: 100%;
  max-width: 600px;      /* ここで最大幅を調整（大きくすると広がる） */
  margin: 1.5rem auto 2.5rem;
  padding: 0 16px;
  box-sizing: border-box;
}
.kakou-menu-banner {
  display: block;
  width: 100%;
  margin-bottom: 1rem;   /* バナー同士の間隔 */
}
.kakou-menu-banner:last-child {
  margin-bottom: 0;
}
.kakou-menu-banner img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
}


/* ===== ハンバーガーメニュー（開いた状態）の修正 ===== */

/* 1) 全幅・左右対称・縦スクロール可＋実表示高さに */
.wp-block-navigation__responsive-container.is-menu-open {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: 100dvh !important;      /* バーの分を除いた実際の高さ */
  max-height: 100dvh !important;
  margin: 0 !important;
  overflow-y: auto !important;
  box-sizing: border-box;
}

/* 2) 上下センタリング解除＋最下部がバーに隠れない余白 */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-bottom: 5rem;           /* 3rem → 5rem。最後の1行がバーに隠れない */
  width: 100%;
}


/* 作品詳細ページの著者情報（書家カードとは別物） */
.kakou-work-author {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    background: #f8f8f8;
    border-radius: 8px;
}
.kakou-work-author-avatar {
    flex-shrink: 0;
    line-height: 0;
}
.kakou-work-author-avatar img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
}
.kakou-work-author-info {
    flex: 1;
    min-width: 0;
    text-align: left;
}
.kakou-work-author-name {
    display: block;
    font-weight: bold;
    text-decoration: none;
    color: #1a1a1a;
}
.kakou-work-author-count {
    color: #888;
    font-size: 0.85rem;
    font-weight: normal;
}
.kakou-work-author-meta {
    font-size: 0.85rem;
    color: #666;
    margin-top: 0.2rem;
}
.kakou-work-author-follow {
    flex-shrink: 0;
    margin-left: auto;
}

/* 空のpタグ対策（保険） */
.kakou-work-author > p:empty,
.kakou-work-author-info > p:empty {
    display: none;
}

/*
/////////////////////////////
TOP　VEGAS風
/////////////////////////////
*/
/* カバーの背景スライダー */
.kakou-hero-cover {
    position: relative;
    overflow: hidden;
}

/* 元の背景画像とオーバーレイを隠す */
.kakou-hero-cover > .wp-block-cover__image-background,
.kakou-hero-cover > .wp-block-cover__background {
    display: none;
}

/* Swiperを背面に敷く */
.kakou-hero-cover .kakou-hero-swiper {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}
.kakou-hero-cover .kakou-hero-swiper .swiper-slide {
    overflow: hidden;
}

/* 背景画像＋Ken Burns */
.kakou-hero-image {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
}
/* アクティブだけでなく、全スライドでアニメーション */
.kakou-hero-cover .kakou-hero-image {
    animation: kakouKenBurns 18s ease-in-out infinite alternate;
}

@keyframes kakouKenBurns {
    from { transform: scale(1); }
to { transform: scale(1.1) translateX(-30px); }
}



/* ドットオーバーレイ */
.kakou-hero-cover .kakou-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background-image: radial-gradient(rgba(0,0,0,0.35) 1px, transparent 1px);
    background-size: 3px 3px;
}

/* テキストを最前面に */
.kakou-hero-cover .wp-block-cover__inner-container {
    position: relative;
    z-index: 2;
}

/* ===== HEROテキスト スマホ調整 ===== */
@media (max-width: 600px) {
  /* 大見出し（あなたの一筆が物語になる） */
  .hero-text-box h3.has-literata-font-family {
    font-size: 4rem !important;
    line-height: 1.25;
  }
  /* 小見出し（KAKOUで自分の作品を…） */
  .hero-text-box h3:not(.has-literata-font-family) {
    font-size: 1.15rem !important;
  }
	
	.hero-text-box{
		max-width:100% !important;
	}	
	
}















/*よくある質問ページのカテゴリボタン*/
.kakou-faq-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin: 1.5rem 0 2.5rem;
}
.kakou-faq-nav-btn {
    display: inline-block;
    padding: 0.5rem 1.1rem;
    background: #fff;
    color: #0f3a52;
    border: 1px solid #0f3a52;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.9rem;
    transition: all 0.15s;
}
.kakou-faq-nav-btn:hover {
    background: #0f3a52;
    color: #fff;
}

/*ボタン用の .kakou-feed-btn　レイアウト*/
.kakou-timeline-preview-footer {
    text-align: center;
    margin-top: 1.5rem;
}
.kakou-timeline-preview-empty {
    text-align: center;
    padding: 2rem 1.5rem;
    color: #555;
    line-height: 1.8;
}


.kakou-follow-list-heading-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    border-bottom: 2px solid #0f3a52;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
}
.kakou-follow-list-heading-row .kakou-follow-list-heading {
    border: none;
    padding: 0;
    margin: 0;
}
.kakou-follow-feed-link {
    font-size: 0.85rem;
    color: #0f3a52;
    text-decoration: none;
    white-space: nowrap;
}
.kakou-follow-feed-link:hover {
    text-decoration: underline;
}


/* フィードの案内メッセージ */
.kakou-feed-notice {
    text-align: center;
    padding: 3rem 1.5rem;
    color: #555;
    line-height: 1.8;
}
.kakou-feed-btn {
    display: inline-block;
    text-decoration: none;
    background: #0f3a52;
    color: #fff;
    border: none;
    padding: 12px 48px;
    border-radius: 6px;
    font-size: 1rem;
    letter-spacing: 0.08em;
    cursor: pointer;
    transition: background 0.2s;	
	font-weight: 400;
	
}

.kakou-feed-btn:hover {
    background: #1f4d68;
}



/* 通知アイテム */
.kakou-notif-item {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.7rem 1rem;
    text-decoration: none;
    color: #333;
    border-bottom: 1px solid #f0f0f0;
    transition: background 0.15s;
}
.kakou-notif-item:hover {
    background: #f8f8f8;
}
.kakou-notif-item.is-unread {
    background: #eef4f8;
}
.kakou-notif-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}
.kakou-notif-text {
    font-size: 0.88rem;
    line-height: 1.4;
}
.kakou-notif-text strong {
    color: #0f3a52;
    margin-right: 0.2rem;
}
.kakou-notif-time {
    display: block;
    font-size: 0.75rem;
    color: #999;
    margin-top: 0.2rem;
}



/* ヘッダー内のベル位置調整 */
.wp-block-navigation + .kakou-notif-bell-wrap,
.kakou-notif-bell-wrap {
    margin-left: auto;
}


/* 通知ベル */
.kakou-notif-bell-wrap {
    position: relative;
    display: inline-block;

    top: 10px;	
	
}
.kakou-notif-bell {
    background: none;
    border: none;
    cursor: pointer;
    color: #0f3a52;
    padding: 0.3rem;
    display: inline-flex;
    align-items: center;
}
.kakou-notif-badge {
    position: absolute;
    top: 0;
    right: 0;
    background: #d33;
    color: #fff;
    font-size: 0.65rem;
    font-weight: bold;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.kakou-notif-dropdown {
    position: absolute;
    top: 100%;
    right: 0;
    width: 320px;
    max-height: 400px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    z-index: 9999;
}
.kakou-notif-dropdown-header {
    padding: 0.75rem 1rem;
    font-weight: bold;
    border-bottom: 1px solid #eee;
    color: #0f3a52;
}
.kakou-notif-list {
    padding: 0.25rem 0;
}
.kakou-notif-loading,
.kakou-notif-empty {
    padding: 1.5rem 1rem;
    text-align: center;
    color: #888;
    font-size: 0.9rem;
}

/* フォロー中・フォロワー一覧 */
.kakou-follow-lists {
    margin-top: 2rem;
}
.kakou-follow-list-block {
    margin-bottom: 2rem;
}
.kakou-follow-list-heading {
    font-size: 1.1rem;
    color: #0f3a52;
    border-bottom: 2px solid #0f3a52;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}
.kakou-follow-empty {
    padding: 1.5rem 1rem;
    text-align: center;
    color: #888;
}

.kakou-follow-empty {
    padding: 2rem 1rem;
    text-align: center;
    color: #888;
}

/* 書家カードのアバターを丸型に */
.kakou-author-card .kakou-author-card-avatar-link .kakou-author-card-avatar {
    border-radius: 50% !important;
    object-fit: cover;
    aspect-ratio: 1 / 1;
	border: 2px solid #f0f0f0;
    transition: border-color 0.25s ease;
}

/*// 投稿数・書道歴*/
.kakou-author-card-sep {
    color: #ccc;
    margin: 0 0.2rem;
}


/* プロフィールのフォローUI */
.kakou-profile-follow {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin: .5rem 0 0 0;
    flex-wrap: wrap;
}
.kakou-profile-follow-stats {
    display: flex;
    gap: 1.5rem;
    font-size: 0.95rem;
    color: #555;
}
.kakou-follow-stat strong {
    color: #0f3a52;
    font-size: 1.1rem;
    margin-right: 0.2rem;
}


/* カード内フォローボタン */
.kakou-card-header {
    position: relative;
}
.kakou-card-follow {
    margin-left: auto;
}
.kakou-follow-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem 0.85rem;
    border: 1px solid #0f3a52;
    border-radius: 4px;
    background: #0f3a52;
    color: #fff;
    font-size: 0.8rem;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}
.kakou-follow-btn:hover {
    background: #1f4d68;
    border-color: #1f4d68;
}
.kakou-follow-btn.is-following {
    background: #fff;
    color: #0f3a52;
}
.kakou-follow-btn.is-following:hover {
    background: #f5f5f5;
}
.kakou-follow-btn.is-processing {
    opacity: 0.6;
    pointer-events: none;
}


/* 検索結果 絞り込みバー */
.kakou-search-filter {
    margin: 1.5rem 0 2rem;
}
.kakou-sf-row {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
    flex-wrap: wrap;
}
.kakou-sf-row:last-child {
    margin-bottom: 0;
}
.kakou-sf-label {
    font-weight: bold;
    color: #333;
    white-space: nowrap;
    flex-shrink: 0;
}
.kakou-sf-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.kakou-sf-btn {
    display: inline-block;
    padding: 0.4rem 0.9rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
    color: #555;
    text-decoration: none;
    font-size: 0.9rem;
    transition: all 0.15s;
}
.kakou-sf-btn:hover {
    border-color: #0f3a52;
    color: #0f3a52;
}
.kakou-sf-btn.is-active {
    background: #0f3a52;
    color: #fff;
    border-color: #0f3a52;
    font-weight: bold;
}



/*結果発表済みページ　結果発表ボタン*/
.kakou-category-recruitment-cta {
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}
.kakou-category-results-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.85rem 1.75rem;
    background: #0f3a52;
    color: #fff;
    text-decoration: none;
    border-radius: 6px;
    font-weight: bold;
    transition: background 0.2s;
}
.kakou-category-results-btn:hover {
    background: #1f4d68;
}



/* 受賞作品 結果発表一覧ボタン */
.kakou-award-footer {
    display: flex;
    justify-content: center;
    margin-top: 32px;
}
.kakou-award-see-all {
    display: inline-block;
    background: #fff;
    color: #0f3a52;
    padding: 14px 40px;
    border-radius: 6px;
    text-decoration: none;
    font-weight: 500;
    letter-spacing: 0.05em;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.kakou-award-see-all:hover {
    background: #f5f5f5;
    color: #0f3a52;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.25);
}



/* 受賞作品のご紹介 [kakou_award_works] */
.kakou-award-section {
    background: #0f3a52;
    padding: 3rem 5%;
    margin: 3rem 0;
}



.kakou-award-swiper .swiper-slide.kakou-award-slide {
    display: flex;
    gap: 3rem;
    align-items: center;
    color: #fff;
}
.kakou-award-image {
    flex: 1 1 55%;
    min-width: 0;
}
.kakou-award-image img {
    width: 100%;
    height: auto;
    display: block;
    background: #fff;
}
.kakou-award-body {
    flex: 1 1 45%;
    min-width: 0;
}
.kakou-award-rank {
    display: inline-block;
    background: #fff;
    color: #0f3a52;
    font-weight: bold;
    padding: 4px 20px;
    border-radius: 4px;
    margin-bottom: 1rem;
}
.kakou-award-theme,
.kakou-award-title {
    font-size: clamp(1.2rem, 2.5vw, 1.6rem);
    font-weight: bold;
    margin: 0.3rem 0;
    line-height: 1.4;
}
.kakou-award-author {
    font-size: 0.9rem;
    opacity: 0.85;
    margin: 0.5rem 0 1rem;
}
.kakou-award-desc {
    font-size: 0.9rem;
    line-height: 1.8;
    opacity: 0.9;
    margin-bottom: 1.5rem;
}
.kakou-award-button {
    display: inline-block;
    border: 1px solid #fff;
    color: #fff;
    text-decoration: none;
    padding: 12px 32px;
    letter-spacing: 0.05em;
    transition: background 0.2s, color 0.2s;
}
.kakou-award-button:hover {
    background: #fff;
    color: #0f3a52;
}
/* スマホ：縦積み */
@media (max-width: 768px) {
    .kakou-award-swiper .swiper-slide.kakou-award-slide {
        flex-direction: column;
        gap: 1.5rem;
    }
}



/* PC表示：画像の高さを制限 */
@media (min-width: 769px) {
    .kakou-award-swiper .swiper-slide.kakou-award-slide .kakou-award-image img {
        max-height: 640px;      /* 高さの上限。お好みで調整 */
        width: auto;            /* 高さに合わせて幅を自動調整 */
        max-width: 100%;        /* はみ出さない */
        margin: 0 auto;         /* 中央寄せ */
    }
}















/* 最新の書作品「もっと見る」ボタン */
.kakou-cards-more-wrap {
    text-align: center;
    margin-top: 2rem;
}
.kakou-cards-more {
    background: #0f3a52;
    color: #fff;
    border: none;
    padding: 12px 48px;
    border-radius: 6px;
    font-size: 1rem;
    letter-spacing: 0.08em;
    cursor: pointer;
    transition: background 0.2s;
}
.kakou-cards-more:hover {
    background: #1f4d68;
}
.kakou-cards-more:disabled {
    opacity: 0.6;
    cursor: default;
}





/* お勧め商品 [kakou_recommend] */
.kakou-recommend-section {
    margin: 3rem 0;
}
.kakou-recommend-heading {
    margin-bottom: 1.5rem;
}
.kakou-recommend-h2 {
    font-size: clamp(1.8rem, 4vw, 2.4rem);
    margin: 0;
}
.kakou-recommend-sub {
    color: #1f4d68;
    font-size: 0.9rem;
    letter-spacing: 0.1em;
    margin: 0.2rem 0 0;
}
.kakou-recommend-inner {
    display: flex;
    gap: 2.5rem;
    align-items: center;
}
.kakou-recommend-image {
    flex: 1 1 50%;
    min-width: 0;
}
.kakou-recommend-image img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 6px;
}
.kakou-recommend-body {
    flex: 1 1 50%;
    min-width: 0;
}
.kakou-recommend-title {
    font-size: clamp(1.5rem, 3vw, 2rem);
    margin: 0;
}
.kakou-recommend-title-sub {
    color: #1f4d68;
    font-size: 0.85rem;
    letter-spacing: 0.08em;
    margin: 0.2rem 0 1.2rem;
}
.kakou-recommend-text {
    font-size: 0.95rem;
    line-height: 1.8;
    margin: 0 0 1rem;
}
.kakou-recommend-button-wrap {
    margin-top: 1.5rem;
    text-align: right;
}
.kakou-recommend-button {
    display: inline-block;
    background: #0f3a52;
    color: #fff;
    text-decoration: none;
    padding: 14px 48px;
    border-radius: 6px;
    letter-spacing: 0.08em;
    transition: background 0.2s;
}
.kakou-recommend-button:hover {
    background: #1f4d68;
}
/* スマホ：縦積み */
@media (max-width: 768px) {
    .kakou-recommend-inner {
        flex-direction: column;
        gap: 1.5rem;
    }
    .kakou-recommend-button-wrap {
        text-align: center;
    }
}






/* ===== KAKOU PV スライダー ===== */
.kakou-pv{
  --pv-accent:#1f4d68;
  --pv-ink:#111014;
  position:relative;
  width:100%;
  max-width:960px;
  margin:0 auto;
  aspect-ratio:16/9;
  background:var(--pv-ink);
  overflow:hidden;
  border-radius:8px;
  font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  color:#fff;
  user-select:none;
}
.pv-stage{position:absolute;inset:0;}

/* 各シーンは重ねて、再生中のものだけ表示 */
.pv-scene{position:absolute;inset:0;opacity:0;visibility:hidden;}
.pv-scene.is-active{opacity:1;visibility:visible;}

/* 背景画像：ゆっくりズーム（Ken Burns） */
.pv-bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.05);}
.pv-scene.is-active .pv-bg{animation:pvKen 5s ease-out forwards;}
.pv-bg--ink{background:radial-gradient(circle at 50% 40%, #1d1b22, #0a0a0c);}
@keyframes pvKen{from{transform:scale(1.05);}to{transform:scale(1.18);}}

/* 暗幕 */
.pv-dim{position:absolute;inset:0;background:rgba(0,0,0,.42);}

/* テロップ配置 */
.pv-text{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:0 8%;z-index:2;}
.pv-text--center{align-items:center;text-align:center;}
.pv-text--left{align-items:flex-start;text-align:left;}
.pv-text--right{align-items:flex-end;text-align:right;}

/* テロップのフェードイン（再生中シーンのみ） */
.pv-scene .pv-eyebrow,
.pv-scene .pv-title,
.pv-scene .pv-sub,
.pv-scene .pv-copy,
.pv-scene .pv-line,
.pv-scene .pv-cta{opacity:0;transform:translateY(16px);}
.pv-scene.is-active .pv-eyebrow{animation:pvUp .9s .2s ease forwards;}
.pv-scene.is-active .pv-title{animation:pvUp 1.1s .5s ease forwards;}
.pv-scene.is-active .pv-sub{animation:pvUp 1s 1.1s ease forwards;}
.pv-scene.is-active .pv-copy{animation:pvUp 1.2s .4s ease forwards;}
.pv-scene.is-active .pv-line:nth-child(1){animation:pvUp 1s .4s ease forwards;}
.pv-scene.is-active .pv-line:nth-child(2){animation:pvUp 1s 1s ease forwards;}
.pv-scene.is-active .pv-cta{animation:pvUp 1s 1.4s ease forwards;}
@keyframes pvUp{to{opacity:1;transform:translateY(0);}}

/* タイポ */
.pv-eyebrow{font-size:clamp(.7rem,1.6vw,1rem);letter-spacing:.3em;margin:0 0 1rem;}
.pv-title{font-family:"Literata",Georgia,serif;font-weight:400;letter-spacing:.35em;text-indent:.35em;
  font-size:clamp(2.6rem,9vw,6rem);margin:0;line-height:1;}
.pv-title--end{letter-spacing:.4em;}
.pv-sub{font-size:clamp(.9rem,2.2vw,1.4rem);letter-spacing:.25em;margin:1.2rem 0 0;}
.pv-copy{font-weight:400;line-height:1.5;font-size:clamp(1.6rem,5vw,3.2rem);margin:0;letter-spacing:.06em;}
.pv-line{font-size:clamp(1.4rem,4.5vw,2.8rem);margin:.2rem 0;letter-spacing:.05em;}
.pv-line--accent{color:#cfe3ee;}

/* CTAボタン */
.pv-cta{display:inline-block;margin-top:1.6rem;background:var(--pv-accent);color:#fff;
  text-decoration:none;padding:12px 36px;border-radius:6px;font-size:clamp(.9rem,2vw,1.1rem);
  letter-spacing:.08em;font-family:"Yu Gothic","Noto Sans JP",sans-serif;}

/* 再生ボタン */
.pv-play{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:.8rem;width:100%;height:100%;
  background:rgba(10,10,12,.55);border:0;color:#fff;cursor:pointer;}
.pv-play.is-hidden{display:none;}
.pv-play__icon{width:84px;height:84px;border:2px solid #fff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:1.8rem;padding-left:6px;
  transition:transform .2s, background .2s;}
.pv-play:hover .pv-play__icon{transform:scale(1.08);background:rgba(255,255,255,.12);}
.pv-play__label{font-size:1rem;letter-spacing:.2em;}

/* 進行バー */
.pv-progress{position:absolute;left:0;bottom:0;width:100%;height:4px;background:rgba(255,255,255,.18);z-index:6;}
.pv-progress__bar{display:block;height:100%;width:0;background:var(--pv-accent);}

/* 動きを減らす設定の人へ配慮 */
@media (prefers-reduced-motion: reduce){
  .pv-scene .pv-bg, .pv-scene.is-active .pv-bg{animation:none;transform:none;}
  .pv-scene .pv-eyebrow,.pv-scene .pv-title,.pv-scene .pv-sub,
  .pv-scene .pv-copy,.pv-scene .pv-line,.pv-scene .pv-cta{opacity:1;transform:none;animation:none;}
}













/* WPUFダッシュボードの編集・削除ボタンのhover円を消す */
/* 編集・削除ボタンの背景円を消す（PC・スマホ共通）
   ※アコーディオン開閉アイコン .toggle-icon / .post-edit-icon には触れない */
body .wpuf-posts-edit,
body .wpuf-posts-delete,
body .wpuf-posts-edit:hover,
body .wpuf-posts-delete:hover {
    background-color: transparent !important;
    border-radius: 0 !important;
}

/* AIプロンプト コピーボタン */
.ai-prompt-copy-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background-color: #0f3a52;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 10px 20px;
    font-size: 14px;
    cursor: pointer;
    margin-bottom: 12px;
    transition: background-color 0.2s ease;
}

.ai-prompt-copy-btn:hover {
    background-color: #0c2f43;
}

.ai-prompt-copy-btn.is-copied {
    background-color: #2e7d32; /* コピー成功時は緑 */
}



/* スピナーを常に非表示にする（送信中も含め完全に消す場合） */
.wpcf7-spinner {
    display: none !important;
}

/* ===== お問い合わせフォーム（Contact Form 7）===== */

/* フォーム全体を中央寄せ・幅制限 */
.wpcf7 {
    max-width: 600px;
    margin: 0 auto;
}

/* 各項目の間隔 */
.wpcf7 p {
    margin-bottom: 1.5rem;
}

/* ラベル文字 */
.wpcf7 label {
    display: block;
    font-weight: 500;
    margin-bottom: 0.5rem;
    color: #333;
}

/* 入力欄・テキストエリア共通 */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #d0d0d0;
    border-radius: 6px;
    font-size: 16px;
    box-sizing: border-box;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    background-color: #fff;
}

/* フォーカス時：アクセントカラーで縁取り */
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 textarea:focus {
    outline: none;
    border-color: #0f3a52;
    box-shadow: 0 0 0 3px rgba(15, 58, 82, 0.1);
}

/* テキストエリアの高さ */
.wpcf7 textarea {
    min-height: 160px;
    resize: vertical;
}

/* 送信ボタン */
.wpcf7 input[type="submit"] {
    background-color: #0f3a52;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 12px 32px;
    font-size: 16px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.wpcf7 input[type="submit"]:hover {
    background-color: #0c2f43;
}

/* 送信中のスピナー位置調整 */
.wpcf7 .wpcf7-spinner {
    margin-left: 12px;
}


/* ============================================
   投稿クーポン機能
============================================ */

.kakou-coupon-box {
    margin: 20px 0;
    padding: 20px;
    background: #f5f7f9;
    border: 1px solid #d5dde3;
    border-radius: 6px;
}

.kakou-coupon-count {
    margin: 0 0 12px;
    font-size: 0.95rem;
    color: #333;
}

.kakou-coupon-count strong {
    color: #0f3a52;
    font-size: 1.1rem;
}

.kakou-coupon-rule{
	font-weight:bold;
}


/* 達成済み */
.kakou-coupon-rank,
.kakou-coupon-rank-max {
    margin: 0 0 16px;
    font-size: 1rem;
    color: #0f3a52;
    font-weight: 500;
}

.kakou-coupon-rank-max {
    padding: 8px 12px;
    background: #fff8e1;
    border-radius: 4px;
}

/* クーポンコード表示部分 */
.kakou-coupon-code-wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 12px 0;
    padding: 12px;
    background: #fff;
    border: 1px dashed #0f3a52;
    border-radius: 4px;
}

.kakou-coupon-code-label {
    font-size: 0.9rem;
    color: #555;
}

.kakou-coupon-code {
    flex-grow: 1;
    padding: 6px 12px;
    background: #f0f0f0;
    color: #0f3a52;
    font-family: 'Courier New', monospace;
    font-size: 1rem;
    font-weight: bold;
    border-radius: 4px;
}

.kakou-coupon-copy-btn {
    padding: 6px 14px;
    background: #0f3a52;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 0.85rem;
    cursor: pointer;
    transition: background 0.2s ease;
}

.kakou-coupon-copy-btn:hover {
    background: #1a5478;
}

.kakou-coupon-copy-msg {
    display: none !important;
    color: #0f3a52;
    font-size: 0.85rem;
    font-weight: 500;
}

.kakou-coupon-copy-msg.is-visible {
    display: inline-block !important;
    animation: kakou-coupon-msg-fade 2s ease-out forwards;
}

@keyframes kakou-coupon-msg-fade {
    0% { opacity: 0; }
    15% { opacity: 1; }
    85% { opacity: 1; }
    100% { opacity: 0; }
}

/* 期限・条件 */
.kakou-coupon-expiry,
.kakou-coupon-condition {
    margin: 6px 0;
    font-size: 0.85rem;
    color: #555;
}

/* 次のランクへのカウントダウン */
.kakou-coupon-next {
    margin: 12px 0 0;
    font-size: 0.9rem;
    color: #0f3a52;
    font-weight: 500;
}

/* 未達成 */
.kakou-coupon-next-pending {
    margin: 0 0 16px;
    font-size: 1rem;
    padding: 8px 12px;
    background: #fff;
    border-left: 3px solid #0f3a52;
}

.kakou-coupon-next-pending strong {
    color: #0f3a52;
    font-size: 1.1rem;
}

.kakou-coupon-rank-list {
    margin-top: 12px;
    padding: 12px;
    background: #fff;
    border-radius: 4px;
}

.kakou-coupon-rank-list-title {
    margin: 0 0 8px;
    font-size: 0.9rem;
    color: #555;
    font-weight: 500;
}

.kakou-coupon-rank-list ul {
    margin: 0;
    padding-left: 20px;
    list-style: none;
}

.kakou-coupon-rank-list li {
    margin: 4px 0;
    font-size: 0.9rem;
    color: #333;
}

/* ============================================
   プロフィールボタン横並びレイアウト
   ============================================ */

/* 編集ボタンとコピーボタンを横並びにする */
.um-profile-body > .kakou-profile-edit-button-wrap {
    display: inline-block;
    margin: 12px 5px 12px 0;
    vertical-align: middle;
}

.um-profile-body > .kakou-share-profile {
    display: inline-flex;
    margin: 12px 0;
    vertical-align: middle;
}

/* スマホでは縦並びに戻す（横幅が足りないため） */
@media (max-width: 600px) {
    .um-profile-body > .kakou-profile-edit-button-wrap {
        display: block;
        margin: 8px 0;
        text-align: center;
    }
    
    .um-profile-body > .kakou-share-profile {
        display: flex;
        justify-content: center;
        margin: 8px 0;
    }
}


/* ============================================
   プロフィールURLコピーボタン
   ============================================ */
.kakou-share-profile {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 12px 0;
    flex-wrap: wrap;
}

.kakou-copy-url-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: #0f523a;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background 0.2s ease;
}

.kakou-copy-url-btn:hover {
    background: #1a785a;
}

/* コピーしましたメッセージ：初期は完全に非表示 */
.kakou-copy-msg {
    display: none !important;
    font-size: 0.85rem;
    color: #0f3a52;
    pointer-events: none;
}

/* JSで .is-visible が付くと表示 */
.kakou-copy-msg.is-visible {
    display: inline-block !important;
    animation: kakou-copy-msg-fade 2s ease-out forwards;
}

@keyframes kakou-copy-msg-fade {
    0% { opacity: 0; }
    15% { opacity: 1; }
    85% { opacity: 1; }
    100% { opacity: 0; }
}

/* wow.jsの効果を打ち消す */
.kakou-copy-msg.wow {
    visibility: visible !important;
    animation-name: none !important;
}

/* ============================================
   プロフィール編集ボタン
   ============================================ */
.kakou-profile-edit-button-wrap {
    text-align: center;
    margin: 20px 0;
}

.kakou-profile-edit-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background-color: #0f3a52;
    color: #fff !important;
    text-decoration: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    transition: background-color 0.15s, transform 0.1s;
}

.kakou-profile-edit-button:hover {
    background-color: #1a5a7e;
    color: #fff !important;
    text-decoration: none;
}

.kakou-profile-edit-button:active {
    transform: scale(0.97);
}

.kakou-profile-edit-button svg {
    flex-shrink: 0;
}


/* ==================================================
   プロフィール編集ボタン
================================================== */

.kakou-profile-edit-button-wrap {
    text-align: center;
    margin: 20px 0;
}

.kakou-profile-edit-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background-color: #0f3a52;
    color: #fff !important;
    text-decoration: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    transition: background-color 0.15s, transform 0.1s;
}

.kakou-profile-edit-button:hover {
    background-color: #1a5a7e;
    color: #fff !important;
    text-decoration: none;
}

.kakou-profile-edit-button:active {
    transform: scale(0.97);
}

.kakou-profile-edit-button svg {
    flex-shrink: 0;
}

/* ==================================================
   シェアボタン
================================================== */

/* シェアボタンのSVGアイコン色（他のボタンに合わせる） */
.kakou-share-btn svg {
    /* 既存の .kakou-work-action SVGスタイルを継承 */
}

/* シェアポップオーバー（JSで動的に body に追加される） */
.kakou-share-popover {
    position: absolute;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    padding: 16px;
    min-width: 280px;
    z-index: 10000;
    animation: kakou-share-popover-fadein 0.15s ease-out;
}

@keyframes kakou-share-popover-fadein {
    from {
        opacity: 0;
        transform: translateY(4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ポップオーバーヘッダー */
.kakou-share-popover-header {
    font-size: 13px;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
    text-align: center;
}

/* シェアボタンのグリッド */
.kakou-share-buttons {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

/* 各シェア項目 */
.kakou-share-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 4px;
    background: transparent;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    cursor: pointer;
    text-decoration: none;
    color: #333;
    transition: background 0.15s, border-color 0.15s, transform 0.1s;
    font-family: inherit;
    font-size: inherit;
}

.kakou-share-item:hover {
    background: #f5f5f5;
    border-color: #0f3a52;
}

.kakou-share-item:active {
    transform: scale(0.97);
}

/* シェアアイコン */
.kakou-share-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    color: #0f3a52;
}

/* 各SNSごとのブランドカラー（hover時） */
.kakou-share-item.kakou-share-x:hover .kakou-share-icon { color: #000; }
.kakou-share-item.kakou-share-line:hover .kakou-share-icon { color: #06C755; }
.kakou-share-item.kakou-share-facebook:hover .kakou-share-icon { color: #1877F2; }
.kakou-share-item.kakou-share-pinterest:hover .kakou-share-icon { color: #E60023; }
.kakou-share-item.kakou-share-mail:hover .kakou-share-icon { color: #555; }
.kakou-share-item.kakou-share-copy:hover .kakou-share-icon { color: #0f3a52; }

/* シェアラベル */
.kakou-share-label {
    font-size: 11px;
    color: #555;
    line-height: 1;
}

/* リンクコピー成功時のトースト */
.kakou-share-toast {
    position: fixed;
    bottom: 32px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(15, 58, 82, 0.95);
    color: #fff;
    padding: 12px 24px;
    border-radius: 6px;
    font-size: 14px;
    z-index: 10000;
    pointer-events: none;
    animation: kakou-share-toast-fade 2s ease-out forwards;
}

@keyframes kakou-share-toast-fade {
    0% { opacity: 0; transform: translateX(-50%) translateY(10px); }
    15% { opacity: 1; transform: translateX(-50%) translateY(0); }
    85% { opacity: 1; transform: translateX(-50%) translateY(0); }
    100% { opacity: 0; transform: translateX(-50%) translateY(-10px); }
}

/* レスポンシブ（スマホ用） */
@media (max-width: 600px) {
    .kakou-share-popover {
        min-width: 260px;
        padding: 12px;
    }
    
    .kakou-share-item {
        padding: 8px 4px;
    }
    
    .kakou-share-icon {
        width: 28px;
        height: 28px;
    }
}

/* FancyBox拡大画像の保護（ドラッグ・選択防止） */
.fancybox__content img,
.fancybox__container img,
.fancybox-image,
.fancybox-content img {
    -webkit-user-drag: none;
    user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

/* 参加作品一覧の見出し */
.kakou-theme-works-heading {
    font-size: 1.5rem;
    font-weight: 600;
    color: #0f3a52;
    margin: 32px 0 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid #0f3a52;
}

/* ============================================
   お題情報セクション（カテゴリページ・募集要項共通）
   ============================================ */
.kakou-theme-info {
    background-color: #fafafa;
    border: 1px solid #e0e0e0;
    border-radius: 0px;
    padding: 24px;
    margin: 24px 0;
}

.kakou-theme-info-title {
    font-size: 1.3rem;
    font-weight: 600;
    /*color: #0f3a52;*/
    margin: 0 0 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid #0f3a52;
}

.kakou-theme-info-section {
    margin-bottom: 20px;
}
.kakou-theme-info-section:last-child {
    margin-bottom: 0;
}

.kakou-theme-info-heading {
    font-size: 1.05rem;
    font-weight: 600;
    color: #333;
    margin: 0 0 10px;
}

/* 日程の dl 表示 */
.kakou-theme-info-dates {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 8px 16px;
    margin: 0;
}
.kakou-theme-info-dates dt {
    font-weight: 600;
    color: #555;
}
.kakou-theme-info-dates dd {
    margin: 0;
    color: #333;
}

.kakou-theme-info-description,
.kakou-theme-info-prize {
    color: #444;
    line-height: 1.7;
}

@media (max-width: 600px) {
    .kakou-theme-info {
        padding: 16px;
    }
    .kakou-theme-info-dates {
        grid-template-columns: 1fr;
        gap: 4px 0;
    }
    .kakou-theme-info-dates dt {
        margin-top: 8px;
    }
    .kakou-theme-info-dates dt:first-child {
        margin-top: 0;
    }
}


/* お題終了メッセージ */
.kakou-theme-ended-notice {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 20px;
    background-color: #f5f5f5;
    border-left: 4px solid #999;
    border-radius: 6px;
    color: #555;
    font-size: 0.95rem;
    margin: 16px 0;
}
.kakou-theme-ended-notice svg {
    flex-shrink: 0;
    color: #888;
}


/* プライバシータブのデータダウンロード・削除機能を隠す */
.um-account-tab-privacy .um-field-export_data {
    display: none !important;
}

/* ============================================
   ヘッダー：スクロールで隠れる・上スクロールで表示
   ============================================ */
header.wp-block-template-part {
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    background-color: #fff !important;
    transition: transform 0.3s ease !important;
    will-change: transform;
	opacity: .95;
}

/* 管理バー表示時は、ヘッダーを管理バーの下に */
body.admin-bar header.wp-block-template-part {
    top: 32px !important;
}

/* 管理バー（スマホ表示時は46px） */
@media (max-width: 782px) {
    body.admin-bar header.wp-block-template-part {
        top: 46px !important;
    }
}

/* スクロールで隠れた状態 */
body.kakou-header-hidden header.wp-block-template-part {
    transform: translateY(-100%) !important;
}





















/* コメント送信ボタン（サイトのアクセント色・角丸6pxに統一） */
.comment-form #submit,
.comment-form input[type="submit"].wp-block-button__link {
    background-color: #0f3a52 !important;
    color: #fff !important;
    border: none;
    border-radius: 6px !important;
    padding: 10px 24px;
    font-size: 1rem;
    cursor: pointer;
    transition: background-color 0.2s ease;
}
.comment-form #submit:hover,
.comment-form input[type="submit"].wp-block-button__link:hover {
    background-color: #1a5478 !important;
    color: #fff !important;
}


/* 自分のコメントの削除リンク（返信リンクの隣に並ぶ） */
.wp-block-comment-reply-link {
    display: inline-flex;
    align-items: center;
    gap: 24px;
}
.kakou-comment-delete-link {
    color: #c33;
    font-size: 0.95rem;
    text-decoration: none;
}
.kakou-comment-delete-link:hover {
    text-decoration: underline;
    color: #a22;
}

/* ============================================
   .wrap_article_contents 内の見出しに縦線アイコン
   ============================================ */
.wrap_article_contents h1,
.wrap_article_contents h2,
.wrap_article_contents h3,
.wrap_article_contents h4,
.wrap_article_contents h5,
.wrap_article_contents h6 {
    position: relative;
    padding-left: 16px;
}

.wrap_article_contents h1::before,
.wrap_article_contents h2::before,
.wrap_article_contents h3::before,
.wrap_article_contents h4::before,
.wrap_article_contents h5::before,
.wrap_article_contents h6::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.15em;
    bottom: 0.15em;
    width: 5px;
    background-color: #0f3a52;   /* サイトのアクセントカラー（紺） */
    border-radius: 0px;          /* 角を少し丸める（お好みで0でも可） */
}




/* 画像パクリ対策：作品画像のドラッグ・選択・長押し保存を防ぐ */
.kakou-work-image,
.kakou-card img,
.kakou-card-image-wrapper img,
.entry-content img {
    -webkit-user-drag: none;          /* ドラッグ禁止（Chrome系） */
    user-select: none;                /* 選択禁止 */
    -webkit-user-select: none;
    -webkit-touch-callout: none;      /* スマホ長押しメニュー禁止 */
    pointer-events: auto;             /* クリックは効くように */
}


/* ============================================
   WOW.js 用アニメーション（Animate.css不要・自前定義）
   ============================================ */

/* wow を付けた要素は最初は非表示 */
.wow {
    visibility: hidden;
}
/* WOW.jsが animated を付けたら表示 */
.wow.animated {
    visibility: visible;
}

/* fadeInUp */
.fadeInUp.animated {
    animation: kakouFadeInUp 1s ease both;
}
@keyframes kakouFadeInUp {
    from { opacity: 0; transform: translateY(40px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* fadeInDown */
.fadeInDown.animated {
    animation: kakouFadeInDown 1s ease-in-out both;
}
@keyframes kakouFadeInDown {
    from { opacity: 0; transform: translateY(-40px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* fadeIn */
.fadeIn.animated {
    animation: kakouFadeIn 1s ease both;
}
@keyframes kakouFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* fadeInLeft */
.fadeInLeft.animated {
    animation: kakouFadeInLeft 1s ease both;
}
@keyframes kakouFadeInLeft {
    from { opacity: 0; transform: translateX(-40px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* fadeInRight */
.fadeInRight.animated {
    animation: kakouFadeInRight 1s ease both;
}
@keyframes kakouFadeInRight {
    from { opacity: 0; transform: translateX(40px); }
    to   { opacity: 1; transform: translateX(0); }
}














/* WOW.js が動かない場合でも要素が見えるようにする保険 */
.no-js .wow,
.wow {
    visibility: visible;
}
/* ただしJSが動く場合はWOWが制御するので、これは最低限の保険 */


/* Aboutページ 流れる画像（マーキー・CSS版） */
.kakou-marquee {
    width: 100%;
    overflow: hidden;
    margin: 2rem 0;
}
.kakou-marquee-track {
    display: flex;
    width: max-content;
    animation: kakou-marquee-scroll 50s linear infinite;
	margin-bottom: 2rem;
}
.kakou-marquee-item {
    flex: 0 0 auto;
    margin-right: 16px;
}
.kakou-marquee-item img {
    height: 400px;
    width: auto;
    display: block;
    border-radius: 6px;
    object-fit: cover;
}

/* 右から左へ流れる */
@keyframes kakou-marquee-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }  /* 画像リスト1周分ぶん移動 */
}

/* マウスを乗せたら一時停止（任意・上品な演出） */
.kakou-marquee:hover .kakou-marquee-track {
    /*animation-play-state: paused;*/
}



















/* グローバルメニュー（常時表示・横並び）をスマホで非表示 */
@media (max-width: 1320px) {
    .kakou-global-nav {
        display: none !important;
    }
}




/* ============================================
   オーバーレイメニューの下線
   ============================================ */

/* まず全項目の下線をリセット */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
    border-bottom: none !important;
}

/* (1) 子を持つ親項目のラベル部分に線（作品を見る・お題に参加する 等） */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item.has-child > .wp-block-navigation-item__content {
    border-bottom: 1px solid #ccc !important;
    display: block !important;
}

/* (2) サブメニュー内の子項目に線（新着作品・人気の作品 等） */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__submenu-container .wp-block-navigation-item {
    border-bottom: 1px solid #ccc !important;
}

/* (3) 一つ目の親（メニュー最上部の項目＝投稿する）に線 */
.wp-block-navigation__responsive-container.is-menu-open
  ul.wp-block-navigation__container
  > .wp-block-navigation-item:first-child {
    border-bottom: 1px solid #ccc !important;
}








/* 作品詳細ページのアイキャッチ画像（ショートコード版）を元の比率で表示 */
.kakou-work-image-wrap {
    width: 100%;
}
.kakou-work-image-link {
    display: block;
}
.kakou-work-image {
    display: block;
    width: 100%;
    height: auto !important;       /* 高さ固定を解除し、元の比率を保つ */
    aspect-ratio: auto !important; /* 比率の固定を解除 */
    object-fit: contain;
    border-radius: 6px;            /* サイト共通の角丸に合わせる（任意） */
}


/* ECバナースライダー */
.kakou-ec-banner-section {
    margin: 40px auto;
    /*max-width: 1000px;*/
}
.kakou-ec-banner-swiper {
    border-radius: 6px;
    overflow: hidden;
}
.kakou-ec-banner-image {
    width: 100%;
    aspect-ratio: 960 / 500;  /* 約1.92:1 に固定 */
    object-fit: cover;         /* 比率違いの画像はトリミング */
    object-position: center;   /* 中央を基準にトリミング */
    display: block;
}


.kakou-ec-banner-swiper .swiper-pagination-bullet-active {
    background: #0f3a52;
}

.swiper-wrapper{
	margin-bottom: 2rem;
}



.kakou-ec-banner-title {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0.75rem 0 0.25rem;
    color: #1a1a1a;
}
.kakou-ec-banner-text {
    font-size: 0.85rem;
    line-height: 1.6;
    color: #555;
    margin: 0;
}
.kakou-ec-banner-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

/* ==========================================================================
   管理画面
   ========================================================================== */

/* UMプロフィールの本文・メタ情報・自己紹介を読みやすく #333 に */
/* UMプロフィール全体の文字色を読みやすく #333 に */

.um-profile-meta, .um-meta-text, .um-meta, .um-dropdown a{
    color: #333 !important;
}

.um-faicon-check::before, .um-faicon-cog::before{
    color: #0f3a52 !important;
}

.um-faicon-check:hover::before,
.um-faicon-cog:hover::before {
    color: #999 !important;
}

.um-field-value{
    color: #333 !important;
}

.um-dropdown{
	/*border:1px solid #333 !important;*/
}

.um-dropdown-arr{
	/*color:#333 !important;*/
}

/* ==========================================================================
   ヘッダーメニュー アイコン（lucide風SVG・トップレベル項目）
   ========================================================================== */

/* アイコン共通スタイル（先頭部分）に .mi-guide を追加 */
.wp-block-navigation-item.mi-post > .wp-block-navigation-item__content,
.wp-block-navigation-item.mi-works > .wp-block-navigation-item__content,
.wp-block-navigation-item.mi-theme > .wp-block-navigation-item__content,
.wp-block-navigation-item.mi-members > .wp-block-navigation-item__content,
.wp-block-navigation-item.mi-mypage > .wp-block-navigation-item__content,
.wp-block-navigation-item.mi-login > .wp-block-navigation-item__content,
.wp-block-navigation-item.mi-register > .wp-block-navigation-item__content,
.wp-block-navigation-item.mi-news > .wp-block-navigation-item__content,
.wp-block-navigation-item.mi-shop > .wp-block-navigation-item__content,
.wp-block-navigation-item.mi-about > .wp-block-navigation-item__content,
.wp-block-navigation-item.mi-guide > .wp-block-navigation-item__content {  /* ← 追加 */
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* ::before にSVGを差し込む共通設定 */
.wp-block-navigation-item[class*="mi-"] > .wp-block-navigation-item__content::before {
    content: "";
    display: inline-block;
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    background-color: currentColor;       /* リンク色に追従（紺など） */
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

/* 投稿する：筆（brush） */
.mi-post > .wp-block-navigation-item__content::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9.06 11.9 8.07-8.06a2.85 2.85 0 1 1 4.03 4.03l-8.06 8.08'/%3E%3Cpath d='M7.07 14.94c-1.66 0-3 1.35-3 3.02 0 1.33-2.5 1.52-2 2.02 1.08 1.1 2.49 2.02 4 2.02 2.2 0 4-1.8 4-4.04a3.01 3.01 0 0 0-3-3.02z'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9.06 11.9 8.07-8.06a2.85 2.85 0 1 1 4.03 4.03l-8.06 8.08'/%3E%3Cpath d='M7.07 14.94c-1.66 0-3 1.35-3 3.02 0 1.33-2.5 1.52-2 2.02 1.08 1.1 2.49 2.02 4 2.02 2.2 0 4-1.8 4-4.04a3.01 3.01 0 0 0-3-3.02z'/%3E%3C/svg%3E");
}

/* 作品を見る：画像 */
.mi-works > .wp-block-navigation-item__content::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2' ry='2'/%3E%3Ccircle cx='9' cy='9' r='2'/%3E%3Cpath d='m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2' ry='2'/%3E%3Ccircle cx='9' cy='9' r='2'/%3E%3Cpath d='m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21'/%3E%3C/svg%3E");
}

/* お題に参加する：ターゲット */
.mi-theme > .wp-block-navigation-item__content::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='12' r='6'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='12' r='6'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E");
}

/* メンバー一覧：人々 */
.mi-members > .wp-block-navigation-item__content::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
}

/* マイページ：ユーザー */
.mi-mypage > .wp-block-navigation-item__content::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");
}

/* ログイン：ログインアイコン */
.mi-login > .wp-block-navigation-item__content::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4'/%3E%3Cpolyline points='10 17 15 12 10 7'/%3E%3Cline x1='15' y1='12' x2='3' y2='12'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4'/%3E%3Cpolyline points='10 17 15 12 10 7'/%3E%3Cline x1='15' y1='12' x2='3' y2='12'/%3E%3C/svg%3E");
}

/* 新規会員登録：ユーザー追加 */
.mi-register > .wp-block-navigation-item__content::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cline x1='19' y1='8' x2='19' y2='14'/%3E%3Cline x1='22' y1='11' x2='16' y2='11'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cline x1='19' y1='8' x2='19' y2='14'/%3E%3Cline x1='22' y1='11' x2='16' y2='11'/%3E%3C/svg%3E");
}

/* お知らせ：クリップボード */
.mi-news > .wp-block-navigation-item__content::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='8' height='4' x='8' y='2' rx='1' ry='1'/%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Cpath d='M12 11h4'/%3E%3Cpath d='M12 16h4'/%3E%3Cpath d='M8 11h.01'/%3E%3Cpath d='M8 16h.01'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='8' height='4' x='8' y='2' rx='1' ry='1'/%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Cpath d='M12 11h4'/%3E%3Cpath d='M12 16h4'/%3E%3Cpath d='M8 11h.01'/%3E%3Cpath d='M8 16h.01'/%3E%3C/svg%3E");
}

/* 書道用品を探す：お店（store） */
.mi-shop > .wp-block-navigation-item__content::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 7 4.41-4.41A2 2 0 0 1 7.83 2h8.34a2 2 0 0 1 1.42.59L22 7'/%3E%3Cpath d='M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8'/%3E%3Cpath d='M15 22v-4a2 2 0 0 0-2-2h-2a2 2 0 0 0-2 2v4'/%3E%3Cpath d='M2 7h20'/%3E%3Cpath d='M22 7v3a2 2 0 0 1-2 2a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 16 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 12 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 8 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 4 12a2 2 0 0 1-2-2V7'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 7 4.41-4.41A2 2 0 0 1 7.83 2h8.34a2 2 0 0 1 1.42.59L22 7'/%3E%3Cpath d='M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8'/%3E%3Cpath d='M15 22v-4a2 2 0 0 0-2-2h-2a2 2 0 0 0-2 2v4'/%3E%3Cpath d='M2 7h20'/%3E%3Cpath d='M22 7v3a2 2 0 0 1-2 2a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 16 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 12 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 8 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 4 12a2 2 0 0 1-2-2V7'/%3E%3C/svg%3E");
}



/* KAKOUについて：情報（info）アイコン */
.mi-about > .wp-block-navigation-item__content::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E");
}



/* ご利用ガイド：開いた本（book-open）アイコン */
.mi-guide > .wp-block-navigation-item__content::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E");
}




/* カード内の受賞バッジ位置（画像内の左上）*/
.kakou-card-image-wrapper .kakou-award-badge {
/*    top: 8px;
    left: 8px;*/
}




/* ============================================
   メニュー上部のロゴ＋検索（PC・スマホ共通で表示）
   ============================================ */
.kakou-mobile-menu-header {
    display: block;
    padding: 0 0 20px;
    margin-bottom: 10px;
    border-bottom: 1px solid #e0e0e0;
}

.kakou-mobile-menu-logo {
    display: block;
    font-size: 1.8rem;
    font-weight: 700;
    color: #0f3a52;
    text-decoration: none;
    margin-bottom: 16px;
    letter-spacing: 0.05em;
    font-family: serif;   /* 明朝体 */
}

/* メニュー上部ヘッダー（ロゴ・検索）のフォーカス枠 */
.kakou-mobile-menu-header a:focus,
.kakou-mobile-menu-header a:focus-visible {
    outline: none;
}

/* ハンバーガーボタンのフォーカス枠 */
.wp-block-navigation__responsive-container-open:focus,
.wp-block-navigation__responsive-container-open:focus-visible,
.wp-block-navigation__responsive-container-close:focus,
.wp-block-navigation__responsive-container-close:focus-visible {
    outline: none;
}

.kakou-mobile-menu-search {
    display: flex;
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    max-width: 400px;
}

.kakou-mobile-menu-search input {
    flex: 1;
    border: none;
    padding: 10px 12px;
    font-size: 0.95rem;
    outline: none;
    background: transparent;
    min-width: 0;
}

.kakou-mobile-menu-search button {
    border: none;
    background: #0f3a52;
    color: #fff;
    padding: 10px 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.kakou-mobile-menu-search button:hover {
    background: #1a5478;
}



/* bodyは overflow を制限しない（stickyのため） */
body {
    max-width: 100%;
}

/* モーダルが開いた時、bodyのスクロールを止める（:has使用） */
body:has(.wp-block-navigation__responsive-container.has-modal-open) {
    overflow: hidden;
}

/* モーダル本体を画面全体に固定 */
.wp-block-navigation__responsive-container.has-modal-open,
.wp-block-navigation__responsive-container.is-menu-open {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    overflow-y: auto !important;
    z-index: 100000 !important;
}




.wp-site-blocks {
    max-width: 100%;
}

/* main要素やコンテンツエリアで横スクロール防止 */
main,
.wp-block-post-content,
.entry-content {
    overflow-x: hidden;
    max-width: 100%;
}


/*トップページのお知らせ*/
.news_list li{
border-bottom: 1px dotted #999;
    padding: 1rem 0;
    margin: 0 !important;
}





/* ============================================
   お知らせリスト（シンプル）
   ============================================ */

.kakou-news-list {
    margin: 2rem 0 3rem 0 !important;
    /*border-top: 1px solid #eee;*/
}

.kakou-news-item {
    display: flex;
    align-items: baseline;
    gap: 1.5rem;
    padding: 1.25rem 0.5rem;
    border-bottom: 1px solid #ccc;
    text-decoration: none;
    color: #1a1a1a;
    transition: background 0.2s ease;
}

.kakou-news-item:hover {
    background: #f9f9f9;
}

.kakou-news-date {
    flex-shrink: 0;
    font-size: 0.85rem;
    color: #888;
    min-width: 7em;
}

.kakou-news-title {
    font-size: 1rem;
    color: #1a1a1a;
    transition: color 0.2s ease;
}

.kakou-news-item:hover .kakou-news-title {
    color: #0f3a52;
}

/* モバイル対応 */
@media (max-width: 600px) {
    .kakou-news-item {
        flex-direction: column;
        gap: 0.25rem;
    }
    
    .kakou-news-date {
        min-width: auto;
        font-size: 0.8rem;
    }
}


@media (max-width: 640px) {
    .kakou-news-button {
        width: 85% !important;
		text-align: center;
    }
    .kakou-news-button .wp-block-button__link {
        width: 85%;
    }
}



/* ============================================
   お題カテゴリ配下の個別投稿（募集要項）
   ============================================ */

/* 作品メタ情報を非表示 */
.kakou-theme-post .kakou-work-meta,
.kakou-theme-post .kakou-work-categories,
.kakou-theme-post .kakou-work-author-card,
.kakou-theme-post .kakou-work-actions {
    display: none;
}


/* お題ページ: 投稿タイトルの直前にある区切り線を非表示 */
.kakou-theme-post .wp-block-post-title {
    /* h1直前の hr を打ち消す */
}

.kakou-theme-post .wp-block-separator:has(+ .wp-block-post-title) {
    display: none;
}

/*
///////////////////////////////////////////////////////////////////
▼投稿作品の画像
///////////////////////////////////////////////////////////////////
*/

/* アイキャッチ画像の切り抜きを無効化し、全体を表示させる */
.attachment-post-thumbnail {
    object-fit: contain !important;
    height: auto !important;
}


/* 投稿一覧の各アイテムに余白を作る */
.wp-block-post {
    margin-bottom: 40px !important; /* 下の作品との間隔 */
}

/* 画像の下に強制的にスペースを作る */
.wp-block-post-featured-image {
    margin-bottom: 20px !important;
    display: block !important;
    line-height: 0; /* 下の隙間調整 */
}

/* 画像本体のサイズを担保する */
.wp-block-post-featured-image img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    position: relative !important; /* 他の要素を押し退けるようにする */
}


/* 1. 投稿ブロック全体に余裕を持たせる */
.wp-block-post {
    display: flex !important;
    flex-direction: column !important;
    margin-bottom: 50px !important;
}

/* 2. 画像エリアが下の要素を押し下げるようにする */
.wp-block-post-featured-image {
    display: block !important;
    margin-bottom: 25px !important; /* 画像とテキストの間の距離 */
    height: auto !important;
    overflow: visible !important;
}

/* 3. 画像自体の重なり設定を解除 */
.wp-block-post-featured-image img {
    position: relative !important; /* 浮かないようにする */
    display: block !important;
    width: 100% !important;
    height: auto !important;
}

/* 4. テキスト部分が勝手に上がってこないようにする */
.wp-block-post-title, 
.wp-block-post-excerpt,
.wp-block-post-content {
    clear: both !important;
    margin-top: 10px !important;
}




/* ============================================
   お題カテゴリページ - ボタン群
   ============================================ */

.kakou-category-recruitment-cta {
    margin: 1.5rem 0 3rem 0;
    text-align: center;
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* 募集要項ボタン（白系・サブ）*/
.kakou-category-recruitment-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 12px 28px;
    background: #fff;
    color: #0f3a52;
    text-decoration: none;
    border-radius: 6px;
    border: 1px solid #0f3a52;
    font-size: 0.95rem;
    font-weight: 500;
    transition: all 0.25s ease;
    letter-spacing: 0.02em;
}

.kakou-category-recruitment-btn:hover {
    background: #f5f9fb;
    color: #0f3a52;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 58, 82, 0.15);
}

/* 参加するボタン（紺色・メイン）*/
.kakou-category-join-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 12px 28px;
    background: #0f3a52;
    color: #fff;
    text-decoration: none;
    border-radius: 6px;
    border: 1px solid #0f3a52;
    font-size: 0.95rem;
    font-weight: 500;
    box-shadow: 0 2px 8px rgba(15, 58, 82, 0.25);
    transition: all 0.25s ease;
    letter-spacing: 0.02em;
}

.kakou-category-join-btn:hover {
    background: #1a5478;
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 58, 82, 0.35);
}

/* 矢印アイコン共通 */
.kakou-category-recruitment-btn .kakou-recruitment-arrow,
.kakou-category-join-btn .kakou-recruitment-arrow {
    transition: transform 0.25s ease;
}

.kakou-category-recruitment-btn:hover .kakou-recruitment-arrow,
.kakou-category-join-btn:hover .kakou-recruitment-arrow {
    transform: translateX(3px);
}

.kakou-category-recruitment-btn svg,
.kakou-category-join-btn svg {
    flex-shrink: 0;
}

/* モバイル対応 */
@media (max-width: 600px) {
    .kakou-category-recruitment-cta {
        flex-direction: column;
        align-items: stretch;
        padding: 0 1rem;
    }
    
    .kakou-category-recruitment-btn,
    .kakou-category-join-btn {
        justify-content: center;
    }
}






/* ============================================
   募集要項記事の参加ボタン（自動挿入）
   ============================================ */

.kakou-theme-join-cta {
    margin: 3rem 0 1rem;
    padding: 2rem;
    text-align: center;
    /*background: linear-gradient(135deg, #f5f9fb 0%, #e8eff3 100%);*/
    border-radius: 8px;
}

.kakou-theme-join-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 16px 36px;
    background: #0f3a52;
    color: #fff;
    text-decoration: none;
    border-radius: 6px;
    font-size: 1.05rem;
    font-weight: 600;
    box-shadow: 0 4px 16px rgba(15, 58, 82, 0.3);
    transition: all 0.25s ease;
    letter-spacing: 0.02em;
}

.kakou-theme-join-btn:hover {
    background: #1a5478;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(15, 58, 82, 0.4);
}

.kakou-theme-join-btn .kakou-join-arrow {
    transition: transform 0.25s ease;
}

.kakou-theme-join-btn:hover .kakou-join-arrow {
    transform: translateX(4px);
}

.kakou-theme-join-btn svg {
    flex-shrink: 0;
}

/* モバイル対応 */
@media (max-width: 600px) {
    .kakou-theme-join-cta {
        padding: 1.5rem 1rem;
    }
    
    .kakou-theme-join-btn {
        padding: 14px 28px;
        font-size: 1rem;
    }
}








/*
////////////////////////////////////////////////////////
会員一覧
////////////////////////////////////////////////////////
*/

/* 書体フィルター */
.kakou-authors-style-filter {
    margin-bottom: 1.25rem;
}

.kakou-authors-style-filter .kakou-authors-filter-label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    color: #555;
    font-size: 0.9rem;
}

.kakou-authors-style-buttons {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.kakou-authors-style-btn {
    display: inline-block;
    padding: 5px 14px;
    background: #fff;
    color: #666;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.82rem;
    transition: all 0.2s ease;
}

.kakou-authors-style-btn:hover {
    background: #f5f9fb;
    border-color: #0f3a52;
    color: #0f3a52;
}

.kakou-authors-style-btn.is-active {
    background: #0f3a52;
    color: #fff;
    border-color: #0f3a52;
    font-weight: 500;
}




/* ============================================
   書家一覧（[kakou_authors_list]）
   ============================================ */

.kakou-authors-list-section {
    margin: 2rem 0;
}

/* 書体フィルター */
.kakou-authors-style-filter {
    margin-bottom: 1.25rem;
}

.kakou-authors-style-filter .kakou-authors-filter-label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    color: #555;
    font-size: 0.9rem;
}

.kakou-authors-style-buttons {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.kakou-authors-style-btn {
    display: inline-block;
    padding: 5px 14px;
    background: #fff;
    color: #666;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.82rem;
    transition: all 0.2s ease;
}

.kakou-authors-style-btn:hover {
    background: #f5f9fb;
    border-color: #0f3a52;
    color: #0f3a52;
}

.kakou-authors-style-btn.is-active {
    background: #0f3a52;
    color: #fff;
    border-color: #0f3a52;
    font-weight: 500;
}

/* 並び順フィルター */
.kakou-authors-filter {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.kakou-authors-filter-label {
    font-weight: 600;
    color: #555;
    font-size: 0.9rem;
}

.kakou-authors-sort-buttons {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.kakou-authors-sort-btn {
    display: inline-block;
    padding: 6px 16px;
    background: #fff;
    color: #555;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.85rem;
    transition: all 0.2s ease;
}

.kakou-authors-sort-btn:hover {
    background: #f5f9fb;
    border-color: #0f3a52;
    color: #0f3a52;
}

.kakou-authors-sort-btn.is-active {
    background: #0f3a52;
    color: #fff;
    border-color: #0f3a52;
}

/* 結果数 */
.kakou-authors-count {
    margin-bottom: 1.5rem;
    color: #888;
    font-size: 0.85rem;
}

/* 書家グリッド */
.kakou-authors-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

@media (max-width: 968px) {
    .kakou-authors-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 640px) {
    .kakou-authors-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
}

@media (max-width: 400px) {
    .kakou-authors-grid {
        grid-template-columns: 1fr;
    }
}

/* 書家カード */
.kakou-author-card {
    background: #fafafa;
    border: 1px solid #f0f0f0;
    border-radius: 6px;
    padding: 1.5rem 1rem;
    text-align: center;
    transition: all 0.25s ease;
}

.kakou-author-card:hover {
   /* border-color: #0f3a52;*/
    box-shadow: 0 4px 2px rgba(15, 58, 82, 0.1);
    transform: translateY(-2px);
}

.kakou-author-card-avatar-link {
    display: inline-block;
}

.kakou-author-card-avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #f0f0f0;
    transition: border-color 0.25s ease;
}

.kakou-author-card:hover .kakou-author-card-avatar {
    /*border-color: #0f3a52;*/
}

.kakou-author-card-name-link {
    text-decoration: none;
}

.kakou-author-card-name {
    font-size: 1rem;
    font-weight: 600;
    margin: 0.75rem 0 0.25rem;
    color: #1a1a1a;
    transition: color 0.2s ease;
}

.kakou-author-card-name-link:hover .kakou-author-card-name {
    color: #0f3a52;
}

.kakou-author-card-count {
    color: #888;
    font-size: 0.8rem;
    margin: 0 0 0.5rem;
}

/* 書体タグ */
.kakou-author-card-styles {
    display: flex;
    justify-content: center;
    gap: 4px;
    margin: 0 0 0.75rem;
    flex-wrap: wrap;
}

.kakou-author-card-style-tag {
    display: inline-block;
    padding: 2px 8px;
    background: #f5f9fb;
    color: #0f3a52;
    font-size: 0.7rem;
    border-radius: 3px;
}

.kakou-author-card-style-more {
    display: inline-block;
    padding: 2px 8px;
    color: #999;
    font-size: 0.7rem;
}

.kakou-author-card-bio {
    color: #666;
    font-size: 0.8rem;
    line-height: 1.5;
    margin: 0 0 1rem;
    min-height: 2.4em;
}

.kakou-author-card-link {
    display: inline-block;
    padding: 6px 14px;
	background: #0f3a52;
    color: #fff;
    text-decoration: none;
    font-size: 0.8rem;
    border-radius: 6px;
    transition: all 0.2s ease;
}

.kakou-author-card-link:hover {
    background: #fff;
    color: #0f3a52;
}
























/* ページネーション */
.kakou-authors-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
    margin-top: 3rem;
    flex-wrap: wrap;
}

.kakou-authors-page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    background: #fff;
    color: #555;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.9rem;
    transition: all 0.2s ease;
}

.kakou-authors-page-link:hover {
    background: #f5f9fb;
    color: #0f3a52;
    border-color: #0f3a52;
}

.kakou-authors-page-link.is-current {
    background: #0f3a52;
    color: #fff;
    border-color: #0f3a52;
    font-weight: 600;
}

/* 空状態 */
.kakou-authors-empty {
    text-align: center;
    color: #999;
    padding: 3rem 1rem;
}









/*
///////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////
共通
///////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////
*/


/* 固定ページ・投稿のタイトル下に共通の余白を入れる */
.wp-block-post-title {
    margin-bottom: 2rem !important;
}


/* ============================================
   モバイル オーバーレイメニューの整形
   ============================================ */

/* オーバーレイメニュー全体 */
.wp-block-navigation__responsive-container.is-menu-open {
    background: #fff;
	overflow-x: hidden;
}

/* メニューコンテナ */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
    padding-top: 5rem;
}

/* メニュー項目を左寄せ＆幅を持たせる */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
    align-items: stretch;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* 各メニュー項目 */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
    width: 100%;
    border-bottom: 1px solid #eee;
}

/* リンク本体 */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
    display: block;
    width: 100%;
    padding: 14px 0;
    text-align: left;
    font-size: 1.05rem;
    color: #1a1a1a;
}

/* トップレベル項目（親）を太字に */
.wp-block-navigation__responsive-container.is-menu-open > .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
    font-weight: 600;
}

/* サブメニュー（子）のスタイル */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
    padding-left: 1rem;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    font-size: 0.95rem;
    color: #666;
    font-weight: 400;
    padding: 12px 0;
}

/* サブメニュー項目の頭に「└」風の装飾（任意）*/
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content::before {
    content: "− ";
    color: #ccc;
    margin-right: 4px;
}

/* HOMEの現在ページ枠を控えめに */
.wp-block-navigation__responsive-container.is-menu-open .current-menu-item .wp-block-navigation-item__content {
    border: none;
    color: #0f3a52;
    font-weight: 700;
}

/* 閉じるボタンの位置・色 */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
    color: #1a1a1a;
    top: 1rem;
    right: 3.15rem;
}









/* 投稿者アバターを丸くする */
.wp-block-avatar img,
.wp-block-post-author__avatar img,
.avatar {
    border-radius: 50% !important;
}

/* 投稿者ブロックを横並び・中央揃えにする */
.wp-block-post-author {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
}

/* 名前の段落に余計な余白があれば消す */
.wp-block-post-author__name {
    margin: 0 !important;
}




/*
///////////////////////////////////////////////////////////////////
コンポーネント
///////////////////////////////////////////////////////////////////
*/

/*
////////////////////////////////////
作品詳細ページのコメント
////////////////////////////////////
*/

/* コメントのアバター・名前リンク */
.kakou-comment-avatar-link {
    display: inline-block;
    transition: opacity 0.2s ease;
}

.kakou-comment-avatar-link:hover {
    opacity: 0.8;
}

.kakou-comment-author-link {
    color: inherit;
    text-decoration: none;
    font-weight: 600;
    transition: color 0.2s ease;
}

.kakou-comment-author-link:hover {
    color: #0f3a52;
    text-decoration: underline;
}


/*
////////////////////////////////////
カードからのコメント機能
////////////////////////////////////
*/


/* コメントリンク */
.kakou-comment-link {
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #666;
    transition: color 0.2s ease;
    font-size: 13px;
    text-decoration: none;
}

.kakou-comment-link:hover {
    color: #3498db;
}

.kakou-comment-count {
    font-size: 12px;
    font-weight: 500;
    min-width: 16px;
    text-align: left;
}





/* 
//////////////////////////////
いいねボタン
//////////////////////////////
*/
.kakou-like-btn {
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #666;
    transition: color 0.2s ease, transform 0.2s ease;
    font-size: 13px;
}

.kakou-like-btn:hover {
    color: steelblue;
}

.kakou-like-btn.is-liked {
    color: steelblue;
}

.kakou-like-btn.is-liked svg {
    fill: steelblue;
}

.kakou-like-btn.is-processing {
    opacity: 0.5;
    pointer-events: none;
}

.kakou-like-btn.is-animating {
    animation: kakou-like-pop 0.6s ease;
}

@keyframes kakou-like-pop {
    0%   { transform: scale(1); }
    30%  { transform: scale(1.3); }
    60%  { transform: scale(0.9); }
    100% { transform: scale(1); }
}

.kakou-like-count {
    font-size: 12px;
    font-weight: 500;
    min-width: 16px;
    text-align: left;
}


/* 
//////////////////////////////
お気に入りボタン
//////////////////////////////
*/


.kakou-favorite-btn {
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #666;
    transition: color 0.2s ease, transform 0.2s ease;
    font-size: 13px;
}

.kakou-favorite-btn:hover {
    color: #f39c12;
}

.kakou-favorite-btn.is-favorited {
    color: #f39c12;
}

.kakou-favorite-btn.is-favorited svg {
    fill: #f39c12;
}

.kakou-favorite-btn.is-processing {
    opacity: 0.5;
    pointer-events: none;
}

.kakou-favorite-btn.is-animating {
    animation: kakou-favorite-pop 0.6s ease;
}

@keyframes kakou-favorite-pop {
    0%   { transform: scale(1) rotate(0); }
    30%  { transform: scale(1.3) rotate(-15deg); }
    60%  { transform: scale(0.9) rotate(10deg); }
    100% { transform: scale(1) rotate(0); }
}

.kakou-favorite-count {
    font-size: 12px;
    font-weight: 500;
    min-width: 16px;
    text-align: left;
}





/* 
//////////////////////////////
ランキングバッジ
//////////////////////////////
*/


/* タイトル内の余計な<p>タグ対策（wpautop回避） */
.kakou-card-title p {
    display: inline;
    margin: 0;
    padding: 0;
}

/* タイトルをインライン調整 */
.kakou-card-title {
    display: flex !important;
    align-items: center;
    gap: 6px;
}

/* ランキングバッジは縮まないように */
.kakou-card-title .kakou-card-rank {
    display: inline-flex !important;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}

/* タイトルテキストは溢れたら省略 */
.kakou-card-title .kakou-card-title-text {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}







/* 
//////////////////////////////
アーカイブのページネーション
//////////////////////////////
*/
	.kakou-pagination {
		display: flex;
		justify-content: center;
		gap: 8px;
		padding: 40px 0;
		flex-wrap: wrap;
	}

	.kakou-pagination .page-numbers {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 40px;
		height: 40px;
		padding: 0 12px;
		background: #f5f5f5;
		color: #333;
		text-decoration: none;
		border-radius: 20px;
		font-size: 14px;
		transition: background 0.2s ease;
	}

	.kakou-pagination .page-numbers:hover {
		background: #333;
		color: #fff;
	}

	.kakou-pagination .page-numbers.current {
		background: #333;
		color: #fff;
	}

	.kakou-pagination .page-numbers.dots {
		background: transparent;
		cursor: default;
	}


/*
///////////////////////////////////////////////////////////////////
テンプレート
///////////////////////////////////////////////////////////////////
*/

/*検索ページ*/

/* 検索結果ページの余白を調整 */
.search .wp-block-group {
    max-width: 100% !important;
    padding-left: 20px;
    padding-right: 20px;
}

/* もしくはクエリループに直接指定 */
.search .wp-block-query {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
}





/*
///////////////////////////////////////////////////////////////////
トップページ
///////////////////////////////////////////////////////////////////
*/


/*
////////////////////////////////////
人気書家ピックアップ
////////////////////////////////////
*/


/* 人気の書家セクション */
.kakou-authors-pickup {
  background: #f8f8f8;
  border-radius: 0;          /* 画面端まで広げるので角丸は削除 */
  padding: 40px 20px;
  margin: 40px 0;
}

/* alignfull 内部の WordPress 自動 max-width 制約を解除 */
.kakou-authors-pickup > *,
.kakou-authors-pickup .kakou-authors-main,
.kakou-authors-pickup .kakou-author-works-container {
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* メインスライダー（書家プロフィール） */
.kakou-authors-main {
    margin-bottom: 30px;
}

.kakou-author-slide {
    padding: 0 20px;
	box-sizing: border-box;   /* ← これを追加 */
}

.kakou-author-profile {
    display: flex;
    align-items: center;
    gap: 30px;
    max-width: 900px;
    margin: 0 auto;
}

.kakou-author-big-avatar {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    border: 6px solid #fff;
    /*box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);*/
    object-fit: cover;
    flex-shrink: 0;
}

.kakou-author-info {
    flex: 1;
}

.kakou-author-big-name {
    font-size: 3rem;
    font-weight: 400;
    margin: 0 0 12px 0;
    color: #333;
}

.kakou-author-big-name a {
    color: inherit;
    text-decoration: none;
}

.kakou-author-big-name a:hover {
    color: #0f3a52;
}

.kakou-author-bio {
    font-size: 14px;
    line-height: 1.7;
    color: #333;
    margin: 0 0 16px 0;
}

.kakou-author-stats-inline {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
    font-size: 14px;
    color: #333;
}

.kakou-author-stats-inline strong {
    color: #333;
    font-weight: 700;
    font-size: 16px;
}

.kakou-author-stat-hot {
    color: firebrick;
}

.kakou-author-stat-hot strong {
    color: firebrick;
}

.kakou-author-profile-link {
    display: inline-block;
    padding: 10px 24px;
    background: #0f3a52;
    color: #fff;
    text-decoration: none;
    border-radius: 6px;
    font-size: 14px;
    transition: background 0.2s ease;
}

.kakou-author-profile-link:hover {
    background: #gray;
    color: #fff;
}

/* ナビゲーション */
.kakou-authors-navigation {
    display: flex;
    align-items: center;
    justify-content: space-between;  /* ← center から変更 */
    /* gap: 16px; ← 削除（不要） */
    margin-bottom: 30px;
}
.kakou-authors-prev,
.kakou-authors-next {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #333;
    transition: all 0.2s ease;
    padding: 0;
    flex-shrink: 0;  /* ← 追加：矢印が縮まないように */
}
.kakou-authors-prev:hover,
.kakou-authors-next:hover {
    background: #333;
    color: #fff;
    border-color: #333;
}
.kakou-authors-prev:disabled,
.kakou-authors-next:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}
.kakou-authors-pagination {
    flex: 1;                    /* ← 追加：余白を全部もらう */
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;    /* ← 追加：ドットを中央へ */
}
.kakou-authors-pagination .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: #ccc;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.2s ease;
    opacity: 1;
    display: inline-block;
    border: none;
}
.kakou-authors-pagination .swiper-pagination-bullet-active {
    background: #333;
    width: 30px;
    border-radius: 5px;
}

/* 作品エリア */
.kakou-author-works-container {
    position: relative;
    min-height: 300px;
}

.kakou-author-works {
    display: none;
}

.kakou-author-works.is-active {
    display: block;
}

.kakou-works-scroll {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    padding: 10px 20px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #ccc transparent;
}

.kakou-works-scroll::-webkit-scrollbar {
    height: 8px;
}

.kakou-works-scroll::-webkit-scrollbar-track {
    background: transparent;
}

.kakou-works-scroll::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 4px;
}

.kakou-work-card {
    flex: 0 0 240px;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    scroll-snap-align: start;
    transition: transform 0.2s ease;
}

.kakou-work-card:hover {
    transform: translateY(-2px);
}

.kakou-work-image {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #f5f5f5;
    overflow: hidden;
}

.kakou-work-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    margin: 0;
}

.kakou-work-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px;
    gap: 8px;
}

.kakou-work-title {
    font-size: 14px;
    font-weight: 500;
    margin: 0;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}

.kakou-no-works {
    text-align: center;
    padding: 40px 20px;
    color: #999;
}

/* モバイル対応 */
@media (max-width: 768px) {
    .kakou-author-profile {
        flex-direction: column;
        text-align: center;
    }
    
    .kakou-author-big-avatar {
        width: 120px;
        height: 120px;
    }
    
    .kakou-author-stats-inline {
        justify-content: center;
    }
    
    .kakou-work-card {
        flex: 0 0 200px;
    }
}




/*
////////////////////////////////////
タグクラウド共通 
////////////////////////////////////
*/

.kakou-style-cloud,
.kakou-tag-cloud {
    margin: 32px 0;
}

.kakou-cloud-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 16px;
    color: #333;
}

.kakou-cloud-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.kakou-cloud-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 20px;
    text-decoration: none;
    font-size: 14px;
    transition: all 0.2s ease;
    border: 1px solid transparent;
}

.kakou-cloud-tag-name {
    font-weight: 500;
}

.kakou-cloud-tag-count {
    font-size: 12px;
    opacity: 0.7;
    background: rgba(255, 255, 255, 0.3);
    padding: 2px 8px;
    border-radius: 10px;
}

/* 書体タグ */
.kakou-style-tag {
    background: #62A2B9;
    color: #fff;
}

.kakou-style-tag:hover {
    background: #4a8aa3;
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(98, 162, 185, 0.3);
}

/* 通常タグ */
.kakou-tag-item {
    background: #f5f5f5;
    color: #333;
    border-color: #e0e0e0;
}

.kakou-tag-item:hover {
    background: #e8e8e8;
    color: #62A2B9;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.kakou-tag-item .kakou-cloud-tag-count {
    background: rgba(0, 0, 0, 0.05);
}



/* ==========================================================================
	作品一覧表示   
	Kakou Post Cards Grid (グリッド・高さ揃え版) - 最終版
	========================================================================== */
	/* リスト全体 */
	.kakou-cards-grid {
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		gap: 20px;
		padding: 20px 0;
	}

	/* グリッドアイテムをセル幅に収める（全幅で常に効かせる・重要）*/
	.kakou-cards-grid .kakou-card {
		min-width: 0;
		max-width: 100%;
		box-sizing: border-box;
	}
	.kakou-cards-grid .kakou-card-title {
		min-width: 0;
	}

	@media (max-width: 1800px) {
		.kakou-cards-grid {
			grid-template-columns: repeat(4, 1fr);
		}
	}
	@media (max-width: 1440px) {
		.kakou-cards-grid {
			grid-template-columns: repeat(3, 1fr);
		}
	}
	@media (max-width: 1024px) {
		.kakou-cards-grid {
			grid-template-columns: repeat(2, 1fr);
		}
	}
	@media (max-width: 600px) {
		.kakou-cards-grid {
			grid-template-columns: 1fr;
		}
	}



	/* カード */
	.kakou-card {
		background: #f5f5f5;
		border-radius: 8px;
		display: flex;
		flex-direction: column;
		transition: transform 0.3s ease;
		padding: 1.5rem 1rem 1rem 1rem;
		position: relative;  /* ← これが無ければ追加 */
	}

	.kakou-card:hover {
		transform: translateY(-10px);
	}

	/* ヘッダー（アバター + 名前 + 時刻） */
	.kakou-card-header {
		display: flex;
		align-items: center;
		padding: 12px;
		gap: 7px;
		flex-shrink: 0;
	}

	.kakou-card-avatar {
		width: 48px;
		height: 48px;
		border-radius: 50%;
		object-fit: cover;
		flex-shrink: 0;
		margin: 0;
	}

	.kakou-card-meta {
		display: flex;
		flex-direction: column;
		line-height: 1.3;
		gap: 2px;
	}

	.kakou-card-author {
		font-size: 14px;
		font-weight: 600;
		color: #333;
	}

	.kakou-card-time {
		font-size: 12px;
		color: #888;
	}

	/* 画像エリアのラッパー（書体タグの位置基準） */
	.kakou-card-image-wrapper {
		position: relative;
		width: 100%;
		aspect-ratio: 1 / 1;
		background: #fff;
	}

	.kakou-card-image-link {
		display: block;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}

	.kakou-card-image {
		width: 100%;
		height: 100%;
		object-fit: cover;
		margin: 0;
		display: block;
	}


.kakou-card > .kakou-award-badge {
    position: absolute;
    top: 15px;
    right: 13px;
    z-index: 5;
}



/* カードヘッダーのリンクスタイル */
.kakou-card-avatar-link,
.kakou-card-author-link {
    text-decoration: none;
    color: inherit;
    display: inline-block;
    transition: opacity 0.2s ease;
}

.kakou-card-avatar-link {
    flex-shrink: 0;
}

.kakou-card-avatar-link:hover {
    opacity: 0.8;
}

.kakou-card-author-link:hover .kakou-card-author {
    color: #0f3a52;
}

.kakou-card-author {
    transition: color 0.2s ease;
}




/* 書体タグ（画像の上端からはみ出して表示） */
.kakou-card-styles {
    position: absolute;
    top: -85px;
    right: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    max-width: calc(100% - 16px);
    justify-content: flex-end;
    z-index: 3;
    pointer-events: none;  /* 親は無効化のまま */
}

.kakou-card-style-tag {
    display: inline-block;
    padding: 3px 10px;
    background: rgba(0, 0, 0, 0.7);
    color: #fff;
    font-size: 11px;
    font-weight: 500;
    border-radius: 6px;
    line-height: 1.4;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    white-space: nowrap;
    pointer-events: auto;  /* ← 追加：タグ自体はクリック可能に */
    cursor: pointer;       /* ← 追加：マウスカーソル変更 */
}

	/* フッター（タイトル + アクション） */
	.kakou-card-footer {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 10px 12px 12px;
		gap: 8px;
		flex-shrink: 0;
		margin-top: auto;
	}

	.kakou-card-title {
		font-size: 1.35rem;
		font-weight: 500;
		color: #333;
		margin: 0;
		line-height: 1.4;
		flex: 1;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.kakou-card-actions {
		display: flex;
		gap: 10px;
		flex-shrink: 0;
	}

	.kakou-card-action {
		color: #666;
		display: inline-flex;
		align-items: center;
		cursor: default;
		transition: color 0.2s ease;
	}

	.kakou-card-action:hover {
		color: #333;
	}



/* ============================================
   スマホ カードはみ出し防止
   ============================================ */

@media (max-width: 600px) {
    .kakou-cards-grid {
        grid-template-columns: 1fr;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        overflow: hidden;
    }
    
    .kakou-cards-grid .kakou-card {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    
    /* ↓ この全要素指定を削除またはグリッド限定に */
    .kakou-cards-grid .kakou-card * {
        box-sizing: border-box;
    }
}




/* ============================================
   書体タグ 色分け（和色ベース）
   ============================================ */

/* 楷書 - 藍鉄 */
.style-kaisho { background: #e8eef3 !important; color: #1a5478 !important; }

/* 行書 - 紺青 */
.style-gyosho { background: #e9ecf5 !important; color: #1f3e7e !important; }

/* 草書 - 群青 */
.style-sosho { background: #ecedf6 !important; color: #4d5aaf !important; }

/* 隷書 - 媚茶 */
.style-reisho { background: #f2efe9 !important; color: #705b3e !important; }

/* 篆書 - 朽葉 */
.style-tensho { background: #f5f1ea !important; color: #917347 !important; }

/* かな - 桜鼠 */
.style-kana { background: #f9eff0 !important; color: #a67d7a !important; }

/* 変体かな - 桔梗 */
.style-hentai-kana { background: #efebf5 !important; color: #6a4c93 !important; }

/* 前衛書 - 朱 */
.style-zenei { background: #fbeae3 !important; color: #cc5a3c !important; }

/* 近代詩文書 - 紅 */
.style-kindai-shibun { background: #fae5e9 !important; color: #b5304b !important; }

/* 少字数書 - 鶯 */
.style-shojisu { background: #eef0e6 !important; color: #6a7741 !important; }

/* 臨書 - 藍 */
.style-rinsho { background: #e6eef3 !important; color: #165e83 !important; }

/* 甲骨文字 - 墨 */
.style-kokotsu { background: #ebeae9 !important; color: #33302e !important; }

/* 篆刻 - 蘇芳 */
.style-tenkoku { background: #f7e6e8 !important; color: #973542 !important; }

/* 創作 - 黄丹 */
.style-sosaku { background: #fbeee0 !important; color: #d4861c !important; }



/* ==========================================================================
   個別作品ページ（single）
   ========================================================================== */

/* ----- 作品メタ情報（書体、サイズなど） ----- */
.kakou-work-meta {
    margin: 16px 0;
}

.kakou-work-meta-row {
    display: flex;
    align-items: baseline;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid #e0e0e0;
    font-size: 1.15rem;
}

.kakou-work-meta-row:last-child {
    border-bottom: none;
}

.kakou-work-meta-label {
    font-size: 1.15rem;
    min-width: 90px;
    flex-shrink: 0;
}

.kakou-work-meta-value {
    color: #333;
    flex: 1;
}

.kakou-work-meta-link {
    color: #333;
    text-decoration: none;
    transition: color 0.2s ease;
}

.kakou-work-meta-link:hover {
    color: #0f3a52;
    text-decoration: underline;
}

/* ----- カテゴリタグ ----- */
.kakou-work-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 16px 0;
}

.kakou-work-category-tag {
    display: inline-block;
    padding: .5rem 1rem;
    background: #62A2B9;
    color: #fff;
    text-decoration: none;
    border-radius: 0;
    font-size: 1rem;
    line-height: 1.4;
    min-width: 100px;
    text-align: center;
    transition: background 0.3s ease;
}

.kakou-work-category-tag:hover {
    background: #666;
    color: #fff;
}

/* ----- 投稿者カード ----- */
.kakou-work-author-card {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid #e0e0e0;
}

/* wpautopで挿入される空の<p>タグを非表示 */
.kakou-work-author-card > p:empty {
    display: none;
}

.kakou-work-author-avatar-link {
    display: inline-block;
    flex-shrink: 0;
    transition: opacity 0.2s ease;
}

.kakou-work-author-avatar-link:hover {
    opacity: 0.85;
}

.kakou-work-author-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
}

.kakou-work-author-info {
    flex: 1;
    min-width: 0;
}

.kakou-work-author-name-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 4px;
}

.kakou-work-author-name-link {
    text-decoration: none;
    color: inherit;
}

.kakou-work-author-name {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    transition: color 0.2s ease;
}

.kakou-work-author-name-link:hover .kakou-work-author-name {
    color: #0f3a52;
}

.kakou-work-author-post-count {
    font-size: 13px;
}

.kakou-work-author-details {
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}

.kakou-work-author-sns-list {
    display: flex;
    gap: 10px;
    flex-shrink: 0;
}

.kakou-work-author-sns {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    color: #666;
    text-decoration: none;
    border-radius: 50%;
    transition: all 0.2s ease;
}

.kakou-work-author-sns:hover {
    color: #fff;
    background: #333;
}

/* ----- アクションパネル ----- */
.kakou-work-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
}

.kakou-work-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: transparent;
    border: none;
    padding: 8px 12px;
    cursor: pointer;
    color: #666;
    font-size: 14px;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.kakou-work-action:hover {
    background: rgba(0, 0, 0, 0.05);
}

/* いいねの選択時 */
.kakou-work-action.kakou-like-btn.is-liked {
    color: #3b82f6;
}

.kakou-work-action.kakou-like-btn.is-liked svg {
    fill: #3b82f6;
}

/* お気に入りの選択時 */
.kakou-work-action.kakou-favorite-btn.is-favorited {
    color: #f39c12;
}

.kakou-work-action.kakou-favorite-btn.is-favorited svg {
    fill: #f39c12;
}

/* 数値表示 */
.kakou-work-action .kakou-like-count,
.kakou-work-action .kakou-comment-count,
.kakou-work-action .kakou-favorite-count {
    font-size: 14px;
    font-weight: 500;
    min-width: 16px;
}

/* ----- ページ全体のレイアウト調整 ----- */

/* 作品エリアの背景色（アイキャッチ画像を含むカラム） */
.wp-block-columns:has(.wp-block-post-featured-image) {
    background: #f5f5f5;
    padding: 40px;
    border-radius: 8px;
    margin-bottom: 40px;
}

/* タイトル */
.wp-block-post-title {
    font-size: 2.5rem;
    text-align: center;
    margin-bottom: 8px;
}

/* 投稿日 */
.wp-block-post-date {
    text-align: center;
    font-size: 14px;
    margin-bottom: 32px;
}

/* 作品の説明文 */
.kakou-work-description {
    padding: 0;
    font-size: 1rem;
}



/* ----- 同じ書家の作品一覧セクション ----- */
.kakou-same-author-section {
    margin-top: 60px;
    padding-top: 40px;
    border-top: 1px solid #e0e0e0;
}

.kakou-section-title {
    font-size: 1.75rem;
    text-align: center;
    margin-bottom: 32px;
    color: #333;
    font-weight: 700;
}



	/* ==========================================================================
	お題（テーマ）管理
	開催中のお題
	https://syoyu-e.com/kakou/theme-ongoing/
	========================================================================== */


/* ============================================
   カテゴリページ バナー画像
   ============================================ */
.kakou-category-banner {
    margin-top: 0;
    margin-bottom: 2rem;
    max-height: 400px;
    overflow: hidden;
    border-radius: 0;
    
    /* 親のグローバルパディングを相殺して画面端まで広げる */
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    max-width: 100vw !important;
}

.kakou-category-banner img {
    width: 100%;
    height: 100%;
    max-height: 400px;
    object-fit: cover;
    display: block;
}


/* お題リスト - レスポンシブグリッド */
.kakou-theme-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);  /* PC: 3列 */
    gap: 24px;
    margin: 24px 0;
}

/* タブレット: 2列 */
@media (max-width: 1024px) {
    .kakou-theme-list {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* スマホ: 1列 */
@media (max-width: 600px) {
    .kakou-theme-list {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

.kakou-theme-card {
    position: relative;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 24px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    display: flex;
    flex-direction: column;
}

.kakou-theme-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* タイトル */
.kakou-theme-title {
    font-size: 1.25rem;  /* 1.5rem → 1.25rem に少し小さく */
    margin: 0 0 12px;
    padding-right: 80px;
}

/* スマホでは少し戻す */
@media (max-width: 600px) {
    .kakou-theme-title {
        font-size: 1.4rem;
        padding-right: 70px;
    }
}

/* ボタンを下に揃える */
.kakou-theme-button {
    margin-top: auto;  /* カードの一番下に配置 */
}

/* ステータスバッジ */
.kakou-theme-status {
    position: absolute;
    top: 16px;
    right: 16px;
    padding: 4px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
}

.kakou-theme-status-ongoing .kakou-theme-status {
    background: #62A2B9;
    color: #fff;
}

.kakou-theme-status-preparing .kakou-theme-status {
    background: #999;
    color: #fff;
}

.kakou-theme-status-closed .kakou-theme-status {
    background: #999;
    color: #fff;
}

.kakou-theme-status-announced .kakou-theme-status {
    background: #f39c12;
    color: #fff;
}



/* 締切間近のカード */
.kakou-theme-urgent {
    border-color: #e74c3c;
    background: linear-gradient(to bottom, #fff5f5, #fff);
}

.kakou-theme-urgent .kakou-theme-status {
    background: #e74c3c;
}

/* タイトル */
.kakou-theme-title {
    font-size: 1.5rem;
    margin: 0 0 12px;
    padding-right: 80px;
}

.kakou-theme-title a {
    color: #333;
    text-decoration: none;
}

.kakou-theme-title a:hover {
    color: #62A2B9;
}

/* 日付 */
.kakou-theme-dates {
    color: #999;
    font-size: 14px;
    margin-bottom: 12px;
}

/* カウントダウン */
.kakou-theme-countdown {
    margin-bottom: 12px;
    font-size: 14px;
    font-weight: 600;
    color: #62A2B9;
}


.kakou-countdown-urgent {
    color: #e74c3c;
    animation: kakou-pulse 1.5s ease-in-out infinite;
}

@keyframes kakou-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* 説明 */
.kakou-theme-description {
    color: #333;
    line-height: 1.6;
    font-size: 13px;
    margin-bottom: 16px;
}

/* 投稿数 */
.kakou-theme-count {
    color: #999;
    font-size: 13px;
    margin-bottom: 16px;
}

/* ボタン */
/*.kakou-theme-button {
    display: inline-block;
    background: #333;
    color: #fff;
    padding: 10px 24px;
    border-radius: 4px;
    text-decoration: none;
    transition: background 0.2s;
}

.kakou-theme-button:hover {
    background: #62A2B9;
    color: #fff;
}*/

/* ============================================
   お題カードのボタン（作品を見る・参加する など）
   ============================================ */
.kakou-theme-button {
    display: inline-block;
    background-color: #0f3a52;
    color: #fff !important;
    text-decoration: none;
    padding: 10px 24px;
    border-radius: 6px;
    font-size: 0.95rem;
    font-weight: 500;
    text-align: center;
    transition: background-color 0.2s ease, transform 0.2s ease;
    border: none;
    cursor: pointer;
    line-height: 1.5;
}

.kakou-theme-button:hover {
    background-color: #1a5478;
    color: #fff !important;
    text-decoration: none;
    transform: translateY(-1px);
}


/* お題バナー画像 */
.kakou-theme-banner {
    margin: -24px -24px 16px -24px;
    border-radius: 8px 8px 0 0;
    overflow: hidden;
    line-height: 0;
    aspect-ratio: 16 / 9;  /* 横長のまま */
}

.kakou-theme-banner a {
    display: block;
    width: 100%;
    height: 100%;
}

.kakou-theme-banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.kakou-theme-banner a:hover img {
    transform: scale(1.02);
}








/* 大賞 - グラデーションゴールド */

/* 受賞作品 */
.kakou-award-card {
    position: relative;
}

/* 共通のバッジ基本スタイル */
.kakou-award-badge {
    position: absolute;
    top: 12px;
    right: 12px;
    color: #fff;
    padding: 6px 14px;
    border-radius: 4px;
    font-weight: 700;
    font-size: 13px;
    z-index: 10;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    letter-spacing: 0.05em;
}

/* 大賞 */
.kakou-award-grand {
    background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
    color: #fff;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

/* 金賞 */
.kakou-award-gold {
    background: #DAA520;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

/* 銀賞 */
.kakou-award-silver {
    background: #808080;
    color: #fff;
}

/* 銅賞 */
.kakou-award-bronze {
    background: #CD7F32;
    color: #fff;
}

/* 入選 */
.kakou-award-selected {
    background: #62A2B9;
    color: #fff;
}

/* 特別賞 */
.kakou-award-special {
    background: #9B59B6;
    color: #fff;
}

/* 結果発表前メッセージ */
.kakou-no-themes,
.kakou-no-awards {
    text-align: center;
    color: #999;
    padding: 40px;
}


/* 詳細ページ：カテゴリタグ隣の受賞バッジを通常配置にする */
.kakou-work-categories {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.kakou-work-categories .kakou-award-badge {
    position: static;      /* カード用のabsoluteを解除 */
    top: auto;
    left: auto;
    right: auto;
    display: inline-block;
    box-shadow: none;      /* カード用の影を消す（任意） */
    vertical-align: middle;
}


/* 詳細ページ：受賞バッジを「書作品」タグと同じ形に揃える */
.kakou-work-categories {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

/* バッジをタグ風に（形・サイズはタグと統一、色だけ賞ごと） */
.kakou-work-categories .kakou-award-badge {
    position: static;       /* カード用のabsoluteを解除 */
    top: auto; left: auto; right: auto;
    display: inline-block;
    padding: .5rem 1rem;    /* ← .kakou-work-category-tag と同じ */
    font-size: 1rem;        /* ← タグと同じ */
    line-height: 1.4;       /* ← タグと同じ */
    min-width: 100px;       /* ← タグと同じ */
    text-align: center;     /* ← タグと同じ */
    border-radius: 0;       /* ← タグと同じ（角丸なし） */
    box-shadow: none;       /* カード用の影を消す */
    font-weight: 700;
}




/* 詳細画面
カテゴリタグを包む<p>（wpautop由来）にも横並び＋gapを効かせる */
.kakou-work-categories p {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
}




/* 受賞作品グループ */
.kakou-award-groups {
    margin: 24px 0;
}

.kakou-award-group {
    margin-bottom: 60px;
}

.kakou-award-group:last-child {
    margin-bottom: 0;
}

.kakou-award-group-title {
    font-size: 1.75rem;
    font-weight: 700;
    margin-bottom: 24px;
    padding-bottom: 12px;
    border-bottom: 3px solid #0f3a52;
    text-align: center;
}

.kakou-award-group-title a {
    color: #333;
    text-decoration: none;
}

.kakou-award-group-title a:hover {
    color: #62A2B9;
}








/*
////////////////////////////////////////////////////////
人気の作品　カルーセル
漢字判定: 楷書、行書、草書、隷書、篆書、創作、その他
かな判定: かな、変体かな
////////////////////////////////////////////////////////
*/

.kakou-popular-carousel-wrapper{
	padding:0 1.5rem;
}

/* レスポンシブ */
@media (max-width: 768px) {
.kakou-popular-carousel-wrapper{
	padding:0 0;
}
}


/* ==========================================================================
   人気の作品セクション
   ========================================================================== */

.kakou-popular-section {
    background: #0f3a52;
    padding: 60px 0;
    margin: 40px 0 60px 0;
    
    /* 親のパディングを打ち消す */
    margin-left: calc(-1 * var(--wp--style--root--padding-right, 24px));
    margin-right: calc(-1 * var(--wp--style--root--padding-left, 24px));
}

/* タブ */
.kakou-popular-tabs {
    display: flex;
    gap: 12px;
    margin-bottom: 32px;
    padding: 0 16px;
}

.kakou-popular-tab {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    border: none;
    padding: 10px 24px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    transition: all 0.2s ease;
}

.kakou-popular-tab:hover {
    background: rgba(255, 255, 255, 0.25);
}

.kakou-popular-tab.is-active {
    background: #2596be;
    color: #fff;
}

/* パネル */
.kakou-popular-panel {
    display: none;
}

.kakou-popular-panel.is-active {
    display: block;
}

/* Swiper */
.kakou-popular-swiper {
    padding: 0 16px 50px;
    position: relative;
}

/* カード */
.kakou-popular-card {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    height: auto;
}

.kakou-popular-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.2);
}

/* 画像 */
.kakou-popular-image-link {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #f5f5f5;
}

.kakou-popular-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.kakou-popular-image-link:hover .kakou-popular-image {
    transform: scale(1.05);
}

/* 情報エリア */
.kakou-popular-info {
    padding: 16px;
}

.kakou-popular-title {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 12px;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 作者 */
.kakou-popular-author {
    margin-bottom: 12px;
}

.kakou-popular-author-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    color: #333;
    transition: color 0.2s ease;
}

.kakou-popular-author-link:hover {
    color: #2596be;
}

.kakou-popular-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.kakou-popular-author-name {
    font-size: 13px;
    font-weight: 500;
}

/* アクション */
.kakou-popular-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 12px;
    border-top: 1px solid #f0f0f0;
}

.kakou-popular-action {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: transparent;
    border: none;
    padding: 4px 6px;
    cursor: pointer;
    color: #666;
    font-size: 13px;
    text-decoration: none;
    transition: color 0.2s ease;
    border-radius: 4px;
}

.kakou-popular-action:hover {
    color: #2596be;
}

.kakou-popular-action.kakou-like-btn.is-liked {
    color: #3b82f6;
}

.kakou-popular-action.kakou-like-btn.is-liked svg {
    fill: #3b82f6;
}

.kakou-popular-action.kakou-favorite-btn.is-favorited {
    color: #f39c12;
}

.kakou-popular-action.kakou-favorite-btn.is-favorited svg {
    fill: #f39c12;
}






/* Swiperナビゲーション */
.kakou-popular-swiper .swiper-button-prev,
.kakou-popular-swiper .swiper-button-next {
    color: #0f3a52;  /* 紺色の文字（背景白とのコントラスト） */
    background: #fff;  /* 白背景 */
    width: 44px;
    height: 44px;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    transition: all 0.2s ease;
}

.kakou-popular-swiper .swiper-button-prev:hover,
.kakou-popular-swiper .swiper-button-next:hover {
    background: #2596be;  /* ホバー時はアクセントカラー */
    color: #fff;
    transform: scale(1.1);
}

.kakou-popular-swiper .swiper-button-prev::after,
.kakou-popular-swiper .swiper-button-next::after {
    font-size: 16px;
    font-weight: bold;
}

/* ページネーション */
.kakou-popular-swiper .swiper-pagination {
    bottom: 10px;
}

.kakou-popular-swiper .swiper-pagination-bullet {
    background: #fff;
    opacity: 0.5;
}

.kakou-popular-swiper .swiper-pagination-bullet-active {
    opacity: 1;
    background: #fff;
}

/* 空メッセージ */
.kakou-popular-empty {
    color: rgba(255, 255, 255, 0.7);
    text-align: center;
    padding: 40px;
}

/* レスポンシブ */
@media (max-width: 768px) {
    .kakou-popular-section {
        padding: 40px 16px;
    }
    
    .kakou-popular-tabs {
        padding: 0 8px;
    }
    
    .kakou-popular-tab {
        padding: 8px 18px;
        font-size: 13px;
    }
}



/* 「全て見る」ボタン */
.kakou-popular-footer {
    display: flex;
    justify-content: center;
    margin-top: 24px;
}

.kakou-popular-see-all {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    color: #333;
    padding: 14px 32px;
    border-radius: 6px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.kakou-popular-see-all:hover {
    background: #f5f5f5;
    color: #333;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

.kakou-popular-see-all svg {
    color: #2596be;
    flex-shrink: 0;
}

.kakou-popular-see-all-text {
    font-weight: 500;
}

.kakou-popular-see-all-count {
    color: #999;
    font-size: 13px;
    border-left: 1px solid #e0e0e0;
    padding-left: 12px;
}



/* Swiperページネーション */
.kakou-popular-swiper .swiper-pagination {
    bottom: 0;  /* 一番下に */
    position: relative;
    margin-top: 16px;
}

.kakou-popular-swiper .swiper-pagination-bullet {
    background: #fff;
    opacity: 0.5;
    width: 8px;
    height: 8px;
}

.kakou-popular-swiper .swiper-pagination-bullet-active {
    opacity: 1;
    background: #fff;
}










/*
///////////////////////////////////////////////////////////////////
プラグイン
///////////////////////////////////////////////////////////////////
*/


/* Ultimate Member 投稿タブの画像を小さく */
.um-posts .um-post-image img {
    max-height: 200px;
    width: auto;
    object-fit: cover;
}

/* カード風に */
.um-posts .um-post {
    background: #f5f5f5;
    padding: 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}



/* Ultimate Memberのデフォルト投稿リストを非表示にしてカスタムカードだけ表示 */
.um .um-profile-body.posts .um-item {
    display: none;
}

/* ただしカスタムカードグリッドは表示する */
.um .um-profile-body.posts .kakou-cards-grid,
.um .um-profile-body.posts .kakou-cards-grid .kakou-card {
    display: block;
}

.um .um-profile-body.posts .kakou-cards-grid {
    display: grid !important;
}


/* Ultimate Member内でのカード表示を正しくする */
.um .kakou-cards-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px;
    padding: 20px 0;
}

@media (max-width: 1024px) {
    .um .kakou-cards-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 600px) {
    .um .kakou-cards-grid {
        grid-template-columns: 1fr !important;
    }
}

/* カード自体のスタイル */
.um .kakou-card {
    background: #f5f5f5;
    border-radius: 8px;
    padding: 1rem;
    overflow: hidden;
}

/* カード内の画像 */
.um .kakou-card-image-wrapper {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 4px;
    background: #fff;
}

.um .kakou-card-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    max-width: none !important;
    margin: 0 !important;
}

/* タイトルを小さく */
.um .kakou-card-title {
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #333 !important;
}

/* ヘッダー */
.um .kakou-card-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.um .kakou-card-avatar {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    margin: 0 !important;
}

.um .kakou-card-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
}

.um .kakou-card-author {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #333 !important;
}

.um .kakou-card-time {
    font-size: 11px !important;
    color: #999 !important;
}

/* フッター */
.um .kakou-card-footer {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    margin-top: 8px;
    padding: 0 !important;


}
	
	
	
/* ============================================
   ▼　コンポーネント
   ============================================ */
	/* ============================================
   ページネーション
   ============================================ */

/* ナビ全体を中央寄せ（複数クラスで確実に上書き） */
.wp-block-query-pagination.is-content-justification-space-between,
.wp-block-query-pagination[class*="wp-container-core-query-pagination"],
.wp-block-query-pagination {
    justify-content: center !important;
    gap: 8px !important;
    align-items: center;
    margin-top: 3rem;
    flex-wrap: wrap;
}

/* 数字部分のラッパー */
.wp-block-query-pagination-numbers {
    display: flex;
    gap: 8px;
    align-items: center;
}

/* 数字ボタン（共通） */
.wp-block-query-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    background: #fff;
    color: #333;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.wp-block-query-pagination .page-numbers:hover {
    background: #f5f5f5;
    border-color: #0f3a52;
    color: #0f3a52;
}

/* 現在のページ（強調） */
.wp-block-query-pagination .page-numbers.current {
    background: #0f3a52;
    border-color: #0f3a52;
    color: #fff;
    cursor: default;
}

/* next/prev リンク */
.wp-block-query-pagination-next,
.wp-block-query-pagination-previous {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0 16px;
    height: 40px;
    border: 1px solid #ddd;
    border-radius: 6px;
    background: #fff;
    color: #333;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.wp-block-query-pagination-next:hover,
.wp-block-query-pagination-previous:hover {
    background: #0f3a52;
    border-color: #0f3a52;
    color: #fff;
}

/* "..."（省略表示） */
.wp-block-query-pagination .page-numbers.dots {
    border: none;
    background: transparent;
    color: #999;
}
	
	


































/* ============================================
   お題セクション（本番デザイン）
   ============================================ */

.kakou-themes-section {
    margin: 3rem 0;
}

/* ============================================
   ヒーロースライダー
   ============================================ */

.kakou-themes-hero {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    height: 50vh;
    min-height: 400px;
    max-height: 700px;
}

.kakou-themes-hero-slide {
    position: relative;
    height: 100%;
    background: #1a1a1a;
}

/* バナー画像 */
.kakou-themes-hero-banner {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transform: scale(1.02);
    transition: transform 8s ease-out;
}

.swiper-slide-active .kakou-themes-hero-banner {
    transform: scale(1.08);
}

/* オーバーレイ */
.kakou-themes-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.2) 40%,
        rgba(0, 0, 0, 0.75) 100%
    );
    color: #fff;
    padding: 3rem 5.5rem;
    display: flex;
    align-items: flex-end;
}






.kakou-themes-hero-info {
    width: 100%;
    max-width: 700px;
}

/* 開催中バッジ */
.kakou-themes-hero-status {
    display: inline-block;
    background: forestgreen;
    color: #fff;
    padding: 4px 14px;
    border-radius: 2px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    margin-bottom: 1rem;
    text-transform: uppercase;
}

/* タイトル */
.kakou-themes-hero-title {
    font-size: 2rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
    color: #fff;
    letter-spacing: 0.02em;
    line-height: 1.3;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* 説明文 */
.kakou-themes-hero-description {
    font-size: 0.95rem;
    line-height: 1.7;
    margin: 0 0 1.5rem;
    opacity: 0.95;
    max-width: 600px;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

/* メタ情報 */
.kakou-themes-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin-bottom: 1.75rem;
    font-size: 0.875rem;
}

.kakou-themes-hero-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    opacity: 0.95;
}

.kakou-themes-hero-meta-item svg {
    opacity: 0.85;
    flex-shrink: 0;
}

.kakou-themes-hero-meta-item strong {
    font-weight: 600;
    font-size: 1rem;
}

.kakou-themes-hero-meta-sub {
    opacity: 0.7;
    font-size: 0.85em;
}

/* ボタン群 */
.kakou-themes-hero-actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.kakou-themes-hero-btn-primary,
.kakou-themes-hero-btn-secondary {
    display: inline-block;
    padding: 12px 28px;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    transition: all 0.25s ease;
    letter-spacing: 0.02em;
}

.kakou-themes-hero-btn-primary {
    background: #0f3a52;
    color: #fff;
    box-shadow: 0 2px 8px rgba(15, 58, 82, 0.3);
}

.kakou-themes-hero-btn-primary:hover {
    background: #1a5478;
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 58, 82, 0.4);
}

.kakou-themes-hero-btn-secondary {
    background: rgba(255, 255, 255, 0.95);
    color: #0f3a52;
    border: 1px solid rgba(255, 255, 255, 0.5);
}

.kakou-themes-hero-btn-secondary:hover {
    background: #fff;
    color: #0f3a52;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* ============================================
   ナビゲーション（前後ボタン）
   ============================================ */

.kakou-themes-hero .kakou-themes-prev,
.kakou-themes-hero .kakou-themes-next,
.kakou-themes-hero .swiper-button-prev,
.kakou-themes-hero .swiper-button-next {
    width: 48px !important;
    height: 48px !important;
    background: rgba(255, 255, 255, 0.9);
    border: none;
    border-radius: 50%;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transition: all 0.2s ease;
    z-index: 10;
    margin-top: -24px;
}

.kakou-themes-hero .kakou-themes-prev:hover,
.kakou-themes-hero .kakou-themes-next:hover {
    background: #fff;
    transform: scale(1.05);
}

.kakou-themes-hero .swiper-button-prev::after,
.kakou-themes-hero .swiper-button-next::after {
    font-size: 1rem !important;
    font-weight: 700;
    color: #0f3a52 !important;
}

.kakou-themes-prev {
    left: 1.5rem;
}

.kakou-themes-next {
    right: 1.5rem;
}

/* ページネーション（ドット） */
.kakou-themes-pagination .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: rgba(255, 255, 255, 0.5);
    opacity: 1;
    transition: all 0.2s ease;
}

.kakou-themes-pagination .swiper-pagination-bullet-active {
    background: #fff;
    width: 30px;
    border-radius: 5px;
}

/* ============================================
   参加作品エリア（横スクロール）
   ============================================ */

.kakou-theme-works-container {
    margin-top: 2rem;
}

.kakou-theme-works {
    display: none;
}

.kakou-theme-works.is-active {
    display: block;
    animation: kakouFadeIn 0.4s ease-out;
}

@keyframes kakouFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.kakou-theme-works-grid {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0.5rem 0 1rem;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}

.kakou-theme-work-card {
    flex: 0 0 auto;
    width: 160px;
    text-decoration: none;
    color: inherit;
    scroll-snap-align: start;
    transition: transform 0.25s ease;
}

.kakou-theme-work-card:hover {
    transform: translateY(-4px);
}

.kakou-theme-work-card > p:empty {
    display: none;
}

.kakou-theme-work-image {
    width: 160px;
    height: 160px;
    background-size: cover;
    background-position: center;
    border-radius: 6px;
    background-color: #f5f5f5;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.25s ease;
}

.kakou-theme-work-card:hover .kakou-theme-work-image {
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}

.kakou-theme-work-title {
    font-size: 0.85rem;
    margin-top: 0.75rem;
    text-align: center;
    color: #333;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 160px;
}

.kakou-theme-no-works {
    text-align: center;
    color: #999;
    padding: 2rem;
    font-size: 0.9rem;
}

.kakou-theme-works-grid::-webkit-scrollbar {
    height: 4px;
}

.kakou-theme-works-grid::-webkit-scrollbar-track {
    background: transparent;
}

.kakou-theme-works-grid::-webkit-scrollbar-thumb {
    background: #ddd;
    border-radius: 2px;
}

.kakou-theme-works-grid::-webkit-scrollbar-thumb:hover {
    background: #0f3a52;
}

/* ============================================
   フッター（お題を全て見る）
   ============================================ */

.kakou-themes-footer {
    margin-top: 2.5rem;
    text-align: center;
}

.kakou-themes-see-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    color: #333;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
    transition: all 0.2s ease;
}

.kakou-themes-see-all:hover {
    background: #0f3a52;
    color: #fff;
    border-color: #0f3a52;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 58, 82, 0.25);
}

.kakou-themes-see-all svg {
    flex-shrink: 0;
}

.kakou-themes-see-all-count {
    background: #0f3a52;
    color: #fff;
    padding: 2px 10px;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    margin-left: 4px;
    transition: all 0.2s ease;
}

.kakou-themes-see-all:hover .kakou-themes-see-all-count {
    background: #fff;
    color: #0f3a52;
}

/* ============================================
   空状態
   ============================================ */

.kakou-themes-empty {
    text-align: center;
    color: #999;
    padding: 3rem 1rem;
    font-size: 1rem;
}

/* ============================================
   レスポンシブ（お題スライダー）
   ============================================ */

@media (max-width: 768px) {
	
	
    /* 参加作品エリアをスマホでは非表示 */
    .kakou-theme-works-container {
        display: none;
    }	
	
	    /* 参加作品サムネ */
/*    .kakou-theme-work-card,
    .kakou-theme-work-image {
        width: 130px;
    }
    
    .kakou-theme-work-image {
        height: 130px;
    }*/
	
	
	
    /* 高さを内容に合わせる（被り解消）*/
    .kakou-themes-hero {
        height: auto;
        min-height: 0;
        max-height: none;
    }
    
    .kakou-themes-hero-slide {
        height: auto;
        min-height: 420px;
    }
    
    /* オーバーレイのpadding適正化 */
    .kakou-themes-hero-overlay {
        padding: 1.5rem;
    }
    
    /* タイトル */
    .kakou-themes-hero-title {
        font-size: 1.5rem;
    }
    
    .kakou-themes-hero-description {
        font-size: 0.85rem;
        line-height: 1.5;
        
        /* 2行で省略（確実に効かせる版）*/
        display: -webkit-box !important;
        -webkit-line-clamp: 1 !important;
        line-clamp: 1;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        
        /* 保険: 高さ制限 */
        max-height: 3em;
    }
    
    /* メタ情報 */
    .kakou-themes-hero-meta {
        gap: 1rem;
        font-size: 0.8rem;
    }
    
    /* ボタン縦並び */
    .kakou-themes-hero-actions {
        flex-direction: column;
        gap: 0.5rem;
        width: 100%;
        margin-bottom: 1rem;
    }
    
    .kakou-themes-hero-btn-primary,
    .kakou-themes-hero-btn-secondary {
        text-align: center;
    }
    
    /* ナビボタン */
    .kakou-themes-hero .kakou-themes-prev,
    .kakou-themes-hero .kakou-themes-next,
    .kakou-themes-hero .swiper-button-prev,
    .kakou-themes-hero .swiper-button-next {
        width: 36px !important;
        height: 36px !important;
        margin-top: -18px;
    }
    
    .kakou-themes-hero .swiper-button-prev::after,
    .kakou-themes-hero .swiper-button-next::after {
        font-size: 0.8rem !important;
    }
    
    .kakou-themes-prev {
        left: 0.75rem;
    }
    
    .kakou-themes-next {
        right: 0.75rem;
    }
    
	
  /* バナー画像をスライド全体にフィット */
    .kakou-themes-hero-banner {
        position: absolute;
        inset: 0;
        height: 100%;
    }
    
    /* オーバーレイをスライド全体に確実に被せる */
    .kakou-themes-hero-overlay {
        position: absolute;
        inset: 0;
        height: 100%;
        padding: 1.5rem 3rem;
        
        /* 縦中央配置 */
        display: flex;
        align-items: center;   /* ← flex-end から center に */
        
        background: linear-gradient(
            to bottom,
            rgba(0, 0, 0, 0.3) 0%,
            rgba(0, 0, 0, 0.5) 40%,
            rgba(0, 0, 0, 0.85) 100%
        );
    }
	

}



@media (max-width: 480px) {
    .kakou-themes-hero-slide {
        height: auto;
        min-height: 400px;
    }
    
    .kakou-themes-hero-title {
        font-size: 1.25rem;
    }
}





























/* ============================================
   今日の見つけた一作
   ============================================ */

.kakou-discovery-section {
    margin: 3rem 0;
}

/* ===== セクションヘッダー ===== */

.kakou-discovery-header {
    margin-bottom: 1.5rem;
}

.kakou-discovery-label {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.5rem;
    font-weight: 600;
    color: #0f3a52;
    letter-spacing: 0.02em;
}

.kakou-discovery-label svg {
    stroke: #0f3a52;
}

.kakou-discovery-sub {
    margin: 0.5rem 0 0;
    font-size: 0.9rem;
    color: #777;
    line-height: 1.6;
}

/* ===== メインカード ===== */

.kakou-discovery-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
    background: #f5f5f5;
    border-radius: 6px;
    padding: 2rem;
    /*box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);*/
    /*border: 1px solid #f0f0f0;*/
}

/* 左: 画像 */

.kakou-discovery-image-wrap {
    position: relative;
    aspect-ratio: 1;
    background: #f5f5f5;
    border-radius: 6px;
    overflow: hidden;
}

.kakou-discovery-image-link {
    display: block;
    width: 100%;
    height: 100%;
}

.kakou-discovery-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform 0.4s ease;
}

.kakou-discovery-image-link:hover .kakou-discovery-image {
    transform: scale(1.03);
}

/* 右: 情報 */

.kakou-discovery-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.kakou-discovery-author {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.kakou-discovery-author-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
    color: #333;
    transition: color 0.2s ease;
}

.kakou-discovery-author-link:hover {
    color: #0f3a52;
}

.kakou-discovery-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
}

.kakou-discovery-author-name {
    font-weight: 500;
    font-size: 0.95rem;
}

.kakou-discovery-date {
    font-size: 0.8rem;
    color: #999;
    margin-left: auto;
}

.kakou-discovery-title {
    font-size: 1.75rem;
    font-weight: 600;
    margin: 0 0 1rem;
    line-height: 1.3;
    letter-spacing: 0.02em;
}

.kakou-discovery-title a {
    color: #1a1a1a;
    text-decoration: none;
    transition: color 0.2s ease;
}

.kakou-discovery-title a:hover {
    color: #0f3a52;
}

.kakou-discovery-styles {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.kakou-discovery-excerpt {
    font-size: 0.95rem;
    line-height: 1.7;
    color: #555;
    margin: 0 0 1.5rem;
}

/* アクション */

.kakou-discovery-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.kakou-discovery-like-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 10px 20px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    color: #555;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.kakou-discovery-like-btn:hover {
    border-color: forestgreen;
    color: forestgreen;
    transform: translateY(-1px);
}

.kakou-discovery-like-btn.is-liked {
    background: forestgreen;
    border-color: forestgreen;
    color: #fff;
}

.kakou-discovery-like-btn.is-liked svg {
    fill: #fff;
}

.kakou-discovery-like-btn.is-animating {
    animation: kakouLikePop 0.6s ease;
}

@keyframes kakouLikePop {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

.kakou-discovery-view-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 10px 20px;
    background: #0f3a52;
    color: #fff;
    text-decoration: none;
    border-radius: 6px;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.2s ease;
}

.kakou-discovery-view-link:hover {
    background: #1a5478;
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 58, 82, 0.25);
}

/* ===== 空状態 ===== */

.kakou-discovery-empty {
    text-align: center;
    color: #999;
    padding: 3rem 1rem;
    font-size: 1rem;
}

/* ============================================
   レスポンシブ
   ============================================ */

@media (max-width: 768px) {
    .kakou-discovery-card {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 1.5rem;
    }
    
    .kakou-discovery-title {
        font-size: 1.5rem;
    }
    
    .kakou-discovery-label {
        font-size: 1.25rem;
    }
    
    .kakou-discovery-actions {
        flex-direction: column;
        align-items: stretch;
    }
    
    .kakou-discovery-like-btn,
    .kakou-discovery-view-link {
        justify-content: center;
    }
}



/* ============================================
   いま応援したい書家
   ============================================ */

.kakou-spotlight-section {
    background: #0f3a52;
    padding: 60px 0;
    margin-top: 40px;
    margin-bottom: 60px;
    
    /* 親のパディングを打ち消して画面端まで */
    margin-left: calc(-1 * var(--wp--style--root--padding-right, 24px));
    margin-right: calc(-1 * var(--wp--style--root--padding-left, 24px));
}

/* ===== グリッド ===== */
.kakou-spotlight-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    padding: 0 1.5rem;
}

@media (max-width: 968px) {
    .kakou-spotlight-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .kakou-spotlight-grid {
        grid-template-columns: 1fr;
    }
}
/* ===== カード ===== */

.kakou-spotlight-card {
    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 6px;
    padding: 1.75rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    transition: all 0.25s ease;
    display: flex;
    flex-direction: column;
}

.kakou-spotlight-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
    border-color: #e0e0e0;
}

/* ヘッダー */

.kakou-spotlight-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.kakou-spotlight-avatar-link {
    display: block;
    flex-shrink: 0;
}

.kakou-spotlight-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #f5f5f5;
    transition: border-color 0.2s ease;
}

.kakou-spotlight-avatar-link:hover .kakou-spotlight-avatar {
    border-color: #0f3a52;
}

.kakou-spotlight-meta {
    flex: 1;
    min-width: 0;
}

.kakou-spotlight-name-link {
    text-decoration: none;
    color: inherit;
}

.kakou-spotlight-name {
    font-size: 1.75rem;
    font-weight: 600;
    margin: 0 0 0.25rem;
    color: #1a1a1a;
    line-height: 1.3;
    transition: color 0.2s ease;
    overflow-wrap: break-word;
    word-break: break-word;
}

.kakou-spotlight-name-link:hover .kakou-spotlight-name {
    color: #0f3a52;
}

.kakou-spotlight-count {
    margin: 0;
    font-size: 0.8rem;
    color: #888;
}

/* Bio */

.kakou-spotlight-bio {
    font-size: 0.85rem;
    line-height: 1.6;
    color: #666;
    margin: 0 0 1.25rem;
    min-height: 2.7em;
}

/* 代表作 */

.kakou-spotlight-works {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

/* 各作品を2列に（gap分を差し引いて半分幅） */
.kakou-spotlight-works .kakou-spotlight-work {
    flex: 0 0 calc(50% - 0.375rem);
    max-width: calc(50% - 0.375rem);
}

/* wpautopが挿入する空の<p>を無視（幅ゼロに） */
.kakou-spotlight-works > p {
    display: none;
}


/* wpautopが挿入した空の<p>を、カード内のどこにあっても非表示 */
.kakou-spotlight-card p:empty {
    display: none;
}



.kakou-spotlight-work {
    display: block;
    text-decoration: none;
    color: inherit;
}

.kakou-spotlight-work-image {
    width: 100%;
    aspect-ratio: 1;
    background-size: cover;
    background-position: center;
    background-color: #f5f5f5;
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
    transition: all 0.25s ease;
}

.kakou-spotlight-work:hover .kakou-spotlight-work-image {
    transform: scale(1.02);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.kakou-spotlight-work-title {
    display: block;
    margin-top: 0.5rem;
    font-size: 0.75rem;
    color: #666;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* プロフィールを見るボタン */

.kakou-spotlight-view-profile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 10px 16px;
    background: #0f3a52;
    color: #fff;
    border-color: #0f3a52;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: 500;
    transition: all 0.2s ease;
    margin-top: auto;
    align-self: flex-end !important;
}


/* ボタンを包んでしまう wpautop の <p> を、中身ごと右寄せに */
.kakou-spotlight-card > p:has(> .kakou-spotlight-view-profile) {
    margin: auto 0 0 auto;   /* 上を押し下げ、右寄せ */
    text-align: right;
    width: 100%;
}

.kakou-spotlight-view-profile:hover {

	
    color: #555;
    background: #fff;
    border: 1px solid #e0e0e0;	
    /*transform: translateY(-3px);*/
    /*box-shadow: 0 4px 12px rgba(15, 58, 82, 0.2);*/
}

/* ===== 空状態 ===== */

.kakou-spotlight-empty {
    text-align: center;
    color: #999;
    padding: 3rem 1rem;
    font-size: 1rem;
}

/* ============================================
   レスポンシブ
   ============================================ */

@media (max-width: 968px) {
    .kakou-spotlight-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .kakou-spotlight-grid {
        grid-template-columns: 1fr;
    }
    
    .kakou-spotlight-card {
        padding: 1.25rem;
    }
}



	
/* ==========================================================================
   Bootstrap風 Spacing Utilities (margin / padding)
   
   使い方: 
   .m-3 → margin: 1rem
   .mt-2 → margin-top: 0.5rem
   .mx-auto → 左右margin auto
   .p-4 → padding: 1.5rem
   .py-5 → padding-top/bottom: 3rem
   
   サイズ: 0, 1(0.25rem), 2(0.5rem), 3(1rem), 4(1.5rem), 5(3rem), auto
   方向: t(top) / b(bottom) / s(left) / e(right) / x(左右) / y(上下) / なし(全方向)
   ========================================================================== */

/* ============================================
   Spacing Utilities (0〜10)
   ============================================ */

/* === margin 全方向 === */
.m-0 { margin: 0 !important; }
.m-1 { margin: 0.25rem !important; }
.m-2 { margin: 0.5rem !important; }
.m-3 { margin: 1rem !important; }
.m-4 { margin: 1.5rem !important; }
.m-5 { margin: 3rem !important; }
.m-6 { margin: 4rem !important; }
.m-7 { margin: 5rem !important; }
.m-8 { margin: 6rem !important; }
.m-9 { margin: 8rem !important; }
.m-10 { margin: 10rem !important; }
.m-auto { margin: auto !important; }

/* === margin top === */
.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 0.25rem !important; }
.mt-2 { margin-top: 0.5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }
.mt-6 { margin-top: 4rem !important; }
.mt-7 { margin-top: 5rem !important; }
.mt-8 { margin-top: 6rem !important; }
.mt-9 { margin-top: 8rem !important; }
.mt-10 { margin-top: 10rem !important; }
.mt-auto { margin-top: auto !important; }

/* === margin bottom === */
.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 0.25rem !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mb-5 { margin-bottom: 3rem !important; }
.mb-6 { margin-bottom: 4rem !important; }
.mb-7 { margin-bottom: 5rem !important; }
.mb-8 { margin-bottom: 6rem !important; }
.mb-9 { margin-bottom: 8rem !important; }
.mb-10 { margin-bottom: 10rem !important; }
.mb-auto { margin-bottom: auto !important; }

/* === margin left (start) === */
.ms-0 { margin-left: 0 !important; }
.ms-1 { margin-left: 0.25rem !important; }
.ms-2 { margin-left: 0.5rem !important; }
.ms-3 { margin-left: 1rem !important; }
.ms-4 { margin-left: 1.5rem !important; }
.ms-5 { margin-left: 3rem !important; }
.ms-6 { margin-left: 4rem !important; }
.ms-7 { margin-left: 5rem !important; }
.ms-8 { margin-left: 6rem !important; }
.ms-9 { margin-left: 8rem !important; }
.ms-10 { margin-left: 10rem !important; }
.ms-auto { margin-left: auto !important; }

/* === margin right (end) === */
.me-0 { margin-right: 0 !important; }
.me-1 { margin-right: 0.25rem !important; }
.me-2 { margin-right: 0.5rem !important; }
.me-3 { margin-right: 1rem !important; }
.me-4 { margin-right: 1.5rem !important; }
.me-5 { margin-right: 3rem !important; }
.me-6 { margin-right: 4rem !important; }
.me-7 { margin-right: 5rem !important; }
.me-8 { margin-right: 6rem !important; }
.me-9 { margin-right: 8rem !important; }
.me-10 { margin-right: 10rem !important; }
.me-auto { margin-right: auto !important; }

/* === margin 左右 (x軸) === */
.mx-0 { margin-left: 0 !important; margin-right: 0 !important; }
.mx-1 { margin-left: 0.25rem !important; margin-right: 0.25rem !important; }
.mx-2 { margin-left: 0.5rem !important; margin-right: 0.5rem !important; }
.mx-3 { margin-left: 1rem !important; margin-right: 1rem !important; }
.mx-4 { margin-left: 1.5rem !important; margin-right: 1.5rem !important; }
.mx-5 { margin-left: 3rem !important; margin-right: 3rem !important; }
.mx-6 { margin-left: 4rem !important; margin-right: 4rem !important; }
.mx-7 { margin-left: 5rem !important; margin-right: 5rem !important; }
.mx-8 { margin-left: 6rem !important; margin-right: 6rem !important; }
.mx-9 { margin-left: 8rem !important; margin-right: 8rem !important; }
.mx-10 { margin-left: 10rem !important; margin-right: 10rem !important; }
.mx-auto { margin-left: auto !important; margin-right: auto !important; }

/* === margin 上下 (y軸) === */
.my-0 { margin-top: 0 !important; margin-bottom: 0 !important; }
.my-1 { margin-top: 0.25rem !important; margin-bottom: 0.25rem !important; }
.my-2 { margin-top: 0.5rem !important; margin-bottom: 0.5rem !important; }
.my-3 { margin-top: 1rem !important; margin-bottom: 1rem !important; }
.my-4 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; }
.my-5 { margin-top: 3rem !important; margin-bottom: 3rem !important; }
.my-6 { margin-top: 4rem !important; margin-bottom: 4rem !important; }
.my-7 { margin-top: 5rem !important; margin-bottom: 5rem !important; }
.my-8 { margin-top: 6rem !important; margin-bottom: 6rem !important; }
.my-9 { margin-top: 8rem !important; margin-bottom: 8rem !important; }
.my-10 { margin-top: 10rem !important; margin-bottom: 10rem !important; }
.my-auto { margin-top: auto !important; margin-bottom: auto !important; }

/* === padding 全方向 === */
.p-0 { padding: 0 !important; }
.p-1 { padding: 0.25rem !important; }
.p-2 { padding: 0.5rem !important; }
.p-3 { padding: 1rem !important; }
.p-4 { padding: 1.5rem !important; }
.p-5 { padding: 3rem !important; }
.p-6 { padding: 4rem !important; }
.p-7 { padding: 5rem !important; }
.p-8 { padding: 6rem !important; }
.p-9 { padding: 8rem !important; }
.p-10 { padding: 10rem !important; }

/* === padding top === */
.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: 0.25rem !important; }
.pt-2 { padding-top: 0.5rem !important; }
.pt-3 { padding-top: 1rem !important; }
.pt-4 { padding-top: 1.5rem !important; }
.pt-5 { padding-top: 3rem !important; }
.pt-6 { padding-top: 4rem !important; }
.pt-7 { padding-top: 5rem !important; }
.pt-8 { padding-top: 6rem !important; }
.pt-9 { padding-top: 8rem !important; }
.pt-10 { padding-top: 10rem !important; }

/* === padding bottom === */
.pb-0 { padding-bottom: 0 !important; }
.pb-1 { padding-bottom: 0.25rem !important; }
.pb-2 { padding-bottom: 0.5rem !important; }
.pb-3 { padding-bottom: 1rem !important; }
.pb-4 { padding-bottom: 1.5rem !important; }
.pb-5 { padding-bottom: 3rem !important; }
.pb-6 { padding-bottom: 4rem !important; }
.pb-7 { padding-bottom: 5rem !important; }
.pb-8 { padding-bottom: 6rem !important; }
.pb-9 { padding-bottom: 8rem !important; }
.pb-10 { padding-bottom: 10rem !important; }


/* ==========================================================================
   Flexbox Utilities (Bootstrap風)
   ========================================================================== */

/* display */
.d-flex { display: flex !important; }
.d-inline-flex { display: inline-flex !important; }
.d-block { display: block !important; }
.d-inline-block { display: inline-block !important; }
.d-none { display: none !important; }

/* flex-direction */
.flex-row { flex-direction: row !important; }
.flex-column { flex-direction: column !important; }
.flex-row-reverse { flex-direction: row-reverse !important; }
.flex-column-reverse { flex-direction: column-reverse !important; }

/* justify-content (水平方向の揃え) */
.justify-content-start { justify-content: flex-start !important; }
.justify-content-end { justify-content: flex-end !important; }
.justify-content-center { justify-content: center !important; }
.justify-content-between { justify-content: space-between !important; }
.justify-content-around { justify-content: space-around !important; }
.justify-content-evenly { justify-content: space-evenly !important; }

/* align-items (垂直方向の揃え) */
.align-items-start { align-items: flex-start !important; }
.align-items-end { align-items: flex-end !important; }
.align-items-center { align-items: center !important; }
.align-items-baseline { align-items: baseline !important; }
.align-items-stretch { align-items: stretch !important; }

/* flex-wrap */
.flex-wrap { flex-wrap: wrap !important; }
.flex-nowrap { flex-wrap: nowrap !important; }

/* gap */
.gap-0 { gap: 0 !important; }
.gap-1 { gap: 0.25rem !important; }
.gap-2 { gap: 0.5rem !important; }
.gap-3 { gap: 1rem !important; }
.gap-4 { gap: 1.5rem !important; }
.gap-5 { gap: 3rem !important; }

/* ==========================================================================
   Text Alignment Utilities (Bootstrap 5 風)
   
   使い方:
   .text-start   → 左揃え
   .text-center  → 中央揃え
   .text-end     → 右揃え
   
   レスポンシブ版:
   .text-sm-center  → sm(576px)以上で中央揃え
   .text-md-end     → md(768px)以上で右揃え
   .text-lg-start   → lg(992px)以上で左揃え
   .text-xl-center  → xl(1200px)以上で中央揃え
   .text-xxl-end    → xxl(1400px)以上で右揃え
   ========================================================================== */

/* === 基本（全画面サイズ） === */
.text-start   { text-align: left !important; }
.text-center  { text-align: center !important; }
.text-end     { text-align: right !important; }
.text-justify { text-align: justify !important; }

/* === sm: 576px以上 === */
@media (min-width: 576px) {
    .text-sm-start   { text-align: left !important; }
    .text-sm-center  { text-align: center !important; }
    .text-sm-end     { text-align: right !important; }
    .text-sm-justify { text-align: justify !important; }
}

/* === md: 768px以上 === */
@media (min-width: 768px) {
    .text-md-start   { text-align: left !important; }
    .text-md-center  { text-align: center !important; }
    .text-md-end     { text-align: right !important; }
    .text-md-justify { text-align: justify !important; }
}

/* === lg: 992px以上 === */
@media (min-width: 992px) {
    .text-lg-start   { text-align: left !important; }
    .text-lg-center  { text-align: center !important; }
    .text-lg-end     { text-align: right !important; }
    .text-lg-justify { text-align: justify !important; }
}

/* === xl: 1200px以上 === */
@media (min-width: 1200px) {
    .text-xl-start   { text-align: left !important; }
    .text-xl-center  { text-align: center !important; }
    .text-xl-end     { text-align: right !important; }
    .text-xl-justify { text-align: justify !important; }
}

/* === xxl: 1400px以上 === */
@media (min-width: 1400px) {
    .text-xxl-start   { text-align: left !important; }
    .text-xxl-center  { text-align: center !important; }
    .text-xxl-end     { text-align: right !important; }
    .text-xxl-justify { text-align: justify !important; }
}

/* ==========================================================================
   Text Transform Utilities (おまけ)
   ========================================================================== */
.text-lowercase  { text-transform: lowercase !important; }
.text-uppercase  { text-transform: uppercase !important; }
.text-capitalize { text-transform: capitalize !important; }

/* ==========================================================================
   Font Weight Utilities (おまけ)
   ========================================================================== */
.fw-light       { font-weight: 300 !important; }
.fw-lighter     { font-weight: lighter !important; }
.fw-normal      { font-weight: 400 !important; }
.fw-medium      { font-weight: 500 !important; }
.fw-semibold    { font-weight: 600 !important; }
.fw-bold        { font-weight: 700 !important; }
.fw-bolder      { font-weight: bolder !important; }

/* ==========================================================================
   Font Style Utilities (おまけ)
   ========================================================================== */
.fst-italic { font-style: italic !important; }
.fst-normal { font-style: normal !important; }

/* ==========================================================================
   Text Decoration Utilities (おまけ)
   ========================================================================== */
.text-decoration-none         { text-decoration: none !important; }
.text-decoration-underline    { text-decoration: underline !important; }
.text-decoration-line-through { text-decoration: line-through !important; }

/* ==========================================================================
   White Space & Word Break (おまけ)
   ========================================================================== */
.text-wrap     { white-space: normal !important; }
.text-nowrap   { white-space: nowrap !important; }
.text-break    { word-wrap: break-word !important; word-break: break-word !important; }

