.in-contents {
	display:block;
	max-width:1000px;
	margin:0 auto;
}

/*----------------------
　　固定メニュー
------------------------*/
.koteimenu {
	display:block;
	position:fixed;
	top:15%;
	right:0;
	padding:1%;
	border-radius: 10px 0 0 10px;
	background:hsla(119,28%,41%,1.00);
	z-index:999;
}
.koteimenu a {
	display:block;
	width:60px;
	margin-bottom:8px;
	background:hsla(119,28%,41%,1.00);
	text-align:center;
}

.koteimenu a img {
	width:80%;
}
.koteimenu a span {
	display:block;
	width:100%;
	text-align:center;
	font-size:0.6em;
	color:#fff;
	
}
/*モバイル用下部メニュー*/
.mbmenu {
	display:none;
}
.mbmenuspace {
	display:none;
}

/*----------------------
　　　　　　おしらせ
------------------------*/
.oshirase {
	width:100%;
	text-align:center;
	font-size:0.9em;
	color:#FFF;
}
.oshisection {
	width:100%;
	padding:30px 0;
}
.oshigrid {
	display:block;
	width:100%;
	margin:0;
	padding:0;
}
.oshigrid .news {
	padding:10px;
}
.oshigrid .news ul {
	list-style:none;
}
.oshigrid .news ul li {
	margin:0;
	padding:0;
}
.oshigrid .news ul li a {
	display:block;
	padding:4px 10px;
	width:100%;
	border-bottom:2px dotted #C6C6C6;
	margin-bottom:8px;
}
.oshigrid .news ul li a span {
	margin-right:10px;
	font-size:0.9em;
}
.oshigrid .link {
	padding:10px;
}
.oshigrid .link img {
	width:100%;
}

/*------------------------
　ブログ新着
------------------------*/
.top_postblog_top {
	width:100%;
	padding-left:15%;
}
.top_postblog_top .box {
	display:grid;
	grid-template-columns: 1fr 1fr;
	padding:8px;
	gap:10px;
	align-items:flex-start;
	justify-content: space-between;
}
.postnewblog {
	display:block;
	wiidth:100%;
	padding:10px;
}
/*大枠　未使用*/
.postnewblog .postnewbox {
	display:grid;
	grid-template-columns: 2fr 3fr;
	
}
.postnewblog .postnewbox .gridbox {

}

.postnewblog .postnewbox a img {
	width:100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	object-position: top;
	margin-right:10px;
	border-radius: 20px;
}
.postnewblog .postnewbox .meta {
	width:100%;
	text-align:left;
	padding-left:10px;
}
.postnewblog .postnewbox .meta a {
	width:100%!important;
	display:block;
	text-align:left!important;
	margin-top:20px;
	font-weight:bold;
	font-size:1.1em;
	padding-bottom:10px;
	color:#393737;
	line-height:140%!important;
}
.postnewblog .postnewbox p.title a:hover {
	color:#F73D37;
}
.postnewblog .postnewbox p.day {
	margin:0;
	padding:3px;
	line-height:140%;
	font-size:0.8em;
}
.postnewblog .postnewbox p.author {
	margin:0;
	padding:3px;
	line-height:140%;
	font-size:0.9em;
}
.postnewblog .postnewbox p.author::after {
	clear:left;
	margin:8px;
}
.postnewblog .read {
	display:block;
	margin-top:10px;
	width:100%;
	font-size:0.8em;
	line-height:140%;
	color:#696969;
}
/*小さい枠*/
.postnewbox2 {
	display:grid;
	grid-template-columns: 1.5fr 5fr;
	justify-content: space-between;
	border:1px solid #CECECE;
	padding:10px;
	border-radius: 20px;
}
.postnewbox2 .pic {
	width:100%;
}
.postnewbox2 .pic img {
	width:100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	object-position: top;
	border-radius: 8px;
}
.postnewbox2 .meta {
	padding-left:10px;
}
.postnewbox2 .meta a.bottom {
	display:block;
	font-size:0.9em;
	line-height:1.2em;
	padding-bottom:8px;
}
.postnewbox2 .meta .day {
	font-size:0.7em;
	line-height:140%;
}
.postnewbox2 .meta .author-bottom {
	font-size:0.7em;
	line-height:140%;
}





/* ============================================================
 * WP ULike カスタマイズ（kankei1サイトと同様の仕様）
 * 対象：担い手活動（activity）／事例紹介（case）
 * ============================================================ */

/* 「応援しませんか」の弧状テキスト（いいね画像の上端に少し重ねて配置） */
.sac-new-programs__like-arc {
	position: absolute;
	left: 50%;
	top: -2px;
	width: 0;
	height: 0;
	pointer-events: none;
}

.sac-new-programs__like-arc .sac-arc-char {
	position: absolute;
	left: 0;
	top: 0;
	width: 1em;
	height: 1em;
	margin-left: -0.5em;
	margin-top: -0.5em;
	text-align: center;
	transform-origin: center;
	font-size: 11px;
	font-weight: 500;
	line-height: 1em;
	color: #333;
	white-space: nowrap;
	-webkit-font-smoothing: antialiased;
	backface-visibility: hidden;
	transition: color 0.2s ease;
}

/* いいね済み状態：赤字で表示 */
.sac-new-programs__like-arc.is-liked .sac-arc-char {
	color: #e60012;
}

/* 管理者のみ表示：弧の文字が作る円の中心にいいね数を表示 */
.sac-new-programs__like-count {
	position: absolute;
	left: 0;
	top: 0;
	transform: translate(-50%, -50%);
	font-size: 1.2em;
	font-weight: 700;
	color: #616161;
	white-space: nowrap;
	pointer-events: none;
}

/* --- 共通：ボタン本体のサイズ --- */
.wp_ulike_btn.wp_ulike_put_image {
	width: 70px !important;
	height: 70px !important;
	background-color: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	min-width: 0 !important;
	position: relative;
}

.wp_ulike_btn.wp_ulike_put_image:after {
	width: 70px;
	height: 70px;
	transition: transform 0.2s ease;
}

/* マウスオーバーで画像を少し拡大し、左下方向に傾ける */
.wp_ulike_btn.wp_ulike_put_image:hover:after {
	transform: translate(-50%, -50%) scale(1.15) rotate(-12deg);
}

/* ============================================================
 * 新着情報カードのレイアウト：3列・縦型（kankei1サイトと同じ見た目）
 * Diver標準の .postnewbox2（サムネイル横並び）を縦型カードに上書きし、
 * 1行3列で表示する。他セクション（allnews-postblog.php等）で使われる
 * .top_postblog_top .box には影響しないよう、.sac-top-activity /
 * .sac-top-case でスコープする。
 * ============================================================ */
.sac-top-activity .box,
.sac-top-case .box {
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 24px !important;
}

/* 右上に飛び出すいいねバッジ分の余白を確保（担い手活動のみ）
   ピンクの見出しバーと弧状テキストが近すぎないよう、少し多めに余白を取る。
   また、タイトルが2〜3行に折り返した場合でも、次の行のカードの
   「応援しませんか」の文字と重ならないよう、行間（row-gap）にも
   余裕を持たせている */
.sac-top-activity .box {
	padding-top: 52px !important;
	row-gap: 82px !important;
}

.sac-activity-card,
.sac-case-card {
	display: block !important;
	grid-template-columns: none !important;
	border: none !important;
	border-radius: 12px !important;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08) !important;
	padding: 0 !important;
	background: #fff;
	position: relative;
}

.sac-activity-card .pic,
.sac-case-card .pic {
	width: 100% !important;
	border-radius: 12px 12px 0 0;
	overflow: hidden;
}

.sac-activity-card .pic img,
.sac-case-card .pic img {
	aspect-ratio: 4 / 3;
	border-radius: 0 !important;
}

.sac-activity-card .meta,
.sac-case-card .meta {
	padding: 14px !important;
}

.sac-activity-card .meta a.bottom,
.sac-case-card .meta a.bottom {
	font-size: 1rem !important;
	font-weight: 700;
	color: #000 !important;
}

.sac-activity-card .meta .day,
.sac-case-card .meta .day {
	color: #888;
}

/* 事例紹介：タイトルが2行に折り返した場合に、右下固定のハート＋カウントの
   下へ文字が回り込んで隠れてしまわないよう、ハートの幅ぶん右側を空けておく
   （ハート＋カウントの実測幅 約66.5px＋余白のため 78px を確保） */
.sac-case-card .meta a.bottom,
.sac-case-card .meta .day {
	padding-right: 78px;
}

/* タイトルが長くて折り返した場合でも、次のカードのいいねバッジの
   下に文字が隠れてしまわないよう、文字側を常に手前に表示する。
   ※ 担い手活動のみに限定する（カードの外・上にはみ出すバッジのため）。
   事例紹介はバッジがカード内（右下）に収まるレイアウトで、このルールを
   事例紹介にも適用すると、リンクの当たり判定（.meta a.bottom は幅いっぱいの
   ブロック要素）がハートボタンの上に重なってクリックできなくなる不具合が
   起きるため、事例紹介には適用しない。
   ※ .meta 自体に position:relative を付けると、その下にある
   .sac-card-like（position:absolute で top:-14px 配置）の基準位置が
   カード全体ではなく .meta に変わってしまい、右上ではなく右下に
   表示される不具合が起きるため、ここ（タイトル自身）にだけ付ける */
.sac-activity-card .meta a.bottom,
.sac-activity-card .meta .day {
	position: relative;
	z-index: 3;
}

/* いいねボタン：担い手活動はカード右上に飛び出す配置
   ※ style.css に既存の .sac-card-like { top:-10px; right:-10px; } があり、
   プロパティ単位で上書きされずに混ざってしまうため、top/right/bottomすべて明示する */
.sac-activity-card .sac-card-like {
	position: absolute !important;
	right: 12px !important;
	top: -14px !important;
	bottom: auto !important;
	z-index: 2;
}

/* ハート＋カウント：事例紹介はカード右下に配置
   ※ 他要素に覆われてクリックできなくなることがないよう、
   カード内で最前面（z-index高め）に表示する */
.sac-case-card .sac-card-like {
	position: absolute !important;
	right: 10px !important;
	bottom: 10px !important;
	top: auto !important;
	z-index: 5;
}

/* style.css の旧デザイン（白丸バッジ＋影）を解除し、kankei1と同じ
   「アイコンそのものを表示」というシンプルな見た目に揃える */
.sac-activity-card .sac-card-like .wp_ulike_general_class,
.sac-case-card .sac-card-like .wp_ulike_general_class {
	background: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
}

/* 担い手活動：投票済み（onの画像）でも背景色が赤くならないようにする。
   WP ULikeのテンプレート設定で「投票済み時の背景色」が設定されているため、
   画像アイコンの背後に色が透けて見えていた分を打ち消す。 */
.sac-activity-card .wp_ulike_general_class.wp_ulike_is_liked,
.sac-activity-card .wp_ulike_general_class.wp_ulike_is_already_liked,
.sac-activity-like .wp_ulike_general_class.wp_ulike_is_liked,
.sac-activity-like .wp_ulike_general_class.wp_ulike_is_already_liked,
body.post-type-archive-activity .sac-archive-like .wp_ulike_general_class.wp_ulike_is_liked,
body.post-type-archive-activity .sac-archive-like .wp_ulike_general_class.wp_ulike_is_already_liked {
	background-color: transparent !important;
}

/* ============================================================
 * 担い手活動（activity）：じょうろアイコン（未投票／投票済み）＋水滴エフェクト
 * 対象：トップページのカード（.sac-activity-card）／
 *       シングルページ（.sac-activity-like）／
 *       アーカイブ一覧（post-type-archive-activity 配下の .sac-archive-like）
 * ============================================================ */
.sac-activity-card .wp_ulike_btn.wp_ulike_put_image:after,
.sac-activity-like .wp_ulike_btn.wp_ulike_put_image:after,
body.post-type-archive-activity .sac-archive-like .wp_ulike_btn.wp_ulike_put_image:after {
	background-image: url(/wp/wp-content/uploads/top/ulike-off.png) !important;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
}

.sac-activity-card .wp_ulike_btn.wp_ulike_btn_is_active.wp_ulike_put_image:after,
.sac-activity-like .wp_ulike_btn.wp_ulike_btn_is_active.wp_ulike_put_image:after,
body.post-type-archive-activity .sac-archive-like .wp_ulike_btn.wp_ulike_btn_is_active.wp_ulike_put_image:after {
	background-image: url(/wp/wp-content/uploads/top/olike-on.png) !important;
	/* WP ULike本体のCSS（wp-ulike.min.css）が投票済みアイコンに
	   赤系の色味を付けるfilterを適用しており、写真画像のじょうろが
	   赤っぽく見えてしまう原因になっていたため無効化する */
	filter: none !important;
}

/* ホバーでじょうろが傾いた際、注ぎ口（左外側）から水滴が落ちるエフェクト */
.sac-activity-card .wp_ulike_btn.wp_ulike_put_image:before,
.sac-activity-like .wp_ulike_btn.wp_ulike_put_image:before,
body.post-type-archive-activity .sac-archive-like .wp_ulike_btn.wp_ulike_put_image:before {
	content: "";
	position: absolute;
	left: -13px;
	top: 26px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #6fc3f7;
	opacity: 0;
	pointer-events: none;
	z-index: 1;
	box-shadow:
		4px 10px 0 1px rgba(111, 195, 247, 0.85),
		7px 20px 0 3px rgba(111, 195, 247, 0.55);
}

.sac-activity-card .wp_ulike_btn.wp_ulike_put_image:hover:before,
.sac-activity-like .wp_ulike_btn.wp_ulike_put_image:hover:before,
body.post-type-archive-activity .sac-archive-like .wp_ulike_btn.wp_ulike_put_image:hover:before {
	animation: sac-water-drop 0.7s ease-in infinite;
}

@keyframes sac-water-drop {
	0% {
		transform: translate(0, -4px) scale(0.8);
		opacity: 0;
	}
	20% {
		opacity: 1;
	}
	80% {
		opacity: 0.8;
	}
	100% {
		transform: translate(-6px, 14px) scale(0.6);
		opacity: 0;
	}
}

/* トップページのカード内配置 */
.sac-activity-card {
	position: relative;
}

/* 投票数バッジ（uliki01〜03.png）：トップページカードの右下に固定配置 */
.sac-activity-vote-badge {
	position: absolute;
	right: 8px;
	bottom: 8px;
	z-index: 2;
	pointer-events: none;
}

.sac-activity-vote-badge img {
	display: block;
	width: 50px;
	height: auto;
}

/* ============================================================
 * 事例紹介（case）：ハートアイコン＋カウント表示
 * 対象：トップページのカード（.sac-case-card）／
 *       シングルページ（.sac-case-like）／
 *       アーカイブ一覧（post-type-archive-case 配下の .sac-archive-like）
 * ============================================================ */
.sac-case-card .wp_ulike_btn.wp_ulike_put_image:after,
.sac-case-like .wp_ulike_btn.wp_ulike_put_image:after,
body.post-type-archive-case .sac-archive-like .wp_ulike_btn.wp_ulike_put_image:after {
	content: "\2764" !important;
	background: none !important;
	width: auto !important;
	height: auto !important;
	font-size: 22px;
	line-height: 1;
	color: #d0d0d0;
	transition: color .2s ease;
}

.sac-case-card .wp_ulike_btn.wp_ulike_btn_is_active.wp_ulike_put_image:after,
.sac-case-like .wp_ulike_btn.wp_ulike_btn_is_active.wp_ulike_put_image:after,
body.post-type-archive-case .sac-archive-like .wp_ulike_btn.wp_ulike_btn_is_active.wp_ulike_put_image:after {
	background: none !important;
	filter: none !important;
	color: #ff6f63;
}

.sac-case-card .wp_ulike_btn.wp_ulike_put_image,
.sac-case-like .wp_ulike_btn.wp_ulike_put_image,
body.post-type-archive-case .sac-archive-like .wp_ulike_btn.wp_ulike_put_image {
	width: 32px !important;
	height: 32px !important;
}

.sac-card-like,
.sac-case-like {
	display: flex;
	align-items: center;
	gap: 4px;
}

/* 事例紹介の「いいね」：以前と同じく枠付きで表示 */
.sac-case-card .sac-card-like {
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 8px;
	padding: 2px 8px 2px 4px;
}

.sac-card-like-count {
	/* kankei1サイトはルートfont-sizeが10pxのため1.4rem=14pxだが、
	   このサイトはルートが16pxのため、同じ見た目になるようpx指定にする */
	font-size: 14px;
	font-weight: 700;
	color: #616161;
}

/* 事例紹介はカウント数を少し小さめに */
.sac-case-card .sac-card-like-count {
	font-size: 11px;
}

/* シングルページ：タイトルといいねボタンを横並びに */
.sac-title-with-like {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
}
/* ============================================================
   WP ULike連携（新規追加）：
   トップページの「担い手活動」「過去好事例」新着情報セクション、
   カード内のいいねボタン、単一ページのいいねボタン、
   アーカイブページのいいねボタン、ランキングページの共通スタイル。
   既存のCSSファイルは変更せず、ここに追記する形で対応する。
   ============================================================ */

/* トップページ：新着情報セクションの見出し・枠 */
.sac-newsection {
	width: 100%;
	padding: 30px 15% 10px;
	box-sizing: border-box;
}

.sac-newsection-title {
	width: 100%;
	color: #fff;
	text-align: center;
	font-size: 1.1em;
	font-weight: bold;
	padding: 8px;
}



.sac-newsection-body {
	padding: 15px;
}

.sac-newsection-body .top_postblog_top {
	width: 100%;
	padding-left: 0;
}

.sac-newsection-more {
	text-align: center;
	margin-top: 10px;
}

.sac-newsection-more a {
	display: inline-block;
	padding: 8px 24px;
	background: #fff;
	border: 1px solid #fc7276;
	color: #393737;
	border-radius: 20px;
}

.sac-newsection--case .sac-newsection-more a {
	border-color: #4a9d8f;
}

/* トップページの新着カード：いいねマークをカードの枠から右上に
   少しはみ出す位置に配置し、タイトルと被らないようにする。
   カウント数は表示しない（アイコンのみのバッジにする） */
.postnewbox2 {
	position: relative;
}

.sac-card-like {
	position: absolute;
	top: -10px;
	right: -10px;
	margin-top: 0;
	z-index: 2;
}

.sac-card-like .wp_ulike_general_class {
	display: flex;
	align-items: center;
	gap: 6px;
	background: #fff;
	border-radius: 50%;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

.sac-card-like .count-box {
	display: none;
}

/* 単一ページのいいねボタン（担い手活動・過去好事例）：
   タイトルの右上にマークを配置し、カウント数は表示しない */
.sac-title-with-like {
	position: relative;
	padding-right: 50px;
}

.sac-activity-like,
.sac-case-like {
	position: absolute;
	top: 0;
	right: 0;
}

.sac-activity-like .count-box,
.sac-case-like .count-box {
	display: none;
}

/* アーカイブページのいいねボタン */
.sac-archive-like {
	margin-top: 6px;
}

/* ランキングページ */
.sac-ranking-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sac-ranking-list__item {
	display: flex;
	align-items: center;
	gap: 15px;
	padding: 15px 10px;
	border-bottom: 1px dotted #C6C6C6;
}

.sac-ranking-list__rank {
	flex: none;
	width: 40px;
	text-align: center;
	font-size: 1.3em;
	font-weight: bold;
	color: #fc7276;
}

.sac-ranking-list__thumb {
	flex: none;
	width: 100px;
}

.sac-ranking-list__thumb img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 8px;
}

.sac-ranking-list__meta {
	flex: 1;
}

.sac-ranking-list__meta a {
	font-weight: bold;
}

.sac-ranking-list__votes {
	flex: none;
	font-size: 0.9em;
	color: #696969;
}

