/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Apr 13 2026 | 11:14:25 */
/* =========================
   予算案ピックアップ～政策紹介
========================= */
/* デフォルトタイトル削除 */
.page-id-877 .page-header{
display:none;
}

/* パンくず削除 */
.page-id-877 #breadcrumb{
display:none;
}

/* ヒーロー全幅化 */
.policy-hero{
width:100vw;
margin-left:calc(50% - 50vw);
margin-right:calc(50% - 50vw);
background:linear-gradient(135deg,#ffe3ea,#ff9eb5);
padding:80px 20px;
text-align:center;
position:relative;
overflow:hidden;
}

/* ヒーロー/内側 */
.policy-hero-inner{
max-width:900px;
margin:auto;
color:#7a0033;
}

/* ヒーロー/サブタイトル */
.policy-hero-sub{
font-size:18px;
font-weight:bold;
margin-bottom:10px;
}

/* ヒーロー/タイトル */
.policy-hero-title{
font-size:42px;
margin:10px 0;
font-weight:700;
}

/* ヒーロー/説明 */
.policy-hero-desc{
font-size:16px;
margin-top:10px;
line-height:1.8;
}

/* ヒーロー/桜装飾 */
.policy-hero::before{
content:"🌸";
position:absolute;
font-size:260px;
left:-50px;
top:-60px;
opacity:0.12;
transform:rotate(-20deg);
}

.policy-hero::after{
content:"🌸";
position:absolute;
font-size:200px;
right:-40px;
bottom:-60px;
opacity:0.12;
transform:rotate(20deg);
}

/* ヒーロー/スマホ調整 */
@media (max-width:768px){

.policy-hero{
padding:50px 20px;
}

.policy-hero-title{
font-size:28px;
}

.policy-hero-sub{
font-size:16px;
}

}

/* 政策カード */
.policy-card{
border:1px solid #ddd;
border-radius:10px;
padding:25px;
margin:30px 0;
background:#fafafa;
}

.policy-open{
margin-top:15px;
padding:10px 18px;
background:#0066cc;
color:#fff;
border:none;
border-radius:6px;
cursor:pointer;
}

.policy-subtitle {
  display: block;
  font-size: 0.65em;
  font-weight: bold;
  margin-top: 4px;
}

/* 政策ぺージのみスクロールをPCで非表示 */
@media (min-width: 769px) {
  .page-id-877 .scroll-indicator,
  .page-id-1150 .scroll-indicator {
    display: none;
  }
}
/* =========================
   政策詳細モーダル
========================= */

.policy-modal{
display:none;
position:fixed;
z-index:9999;
left:0;
top:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
}


/* モーダル本体 */
.policy-modal-content{
background:#fff;
max-width:700px;
margin:5% auto;
padding:30px;
border-radius:10px;
position:relative;

max-height:85vh;
overflow-y:auto;
}


/* 閉じるボタン */
.policy-close{
position:absolute;
top:15px;
right:20px;
font-size:24px;
cursor:pointer;
}


/* タイトル */
.policy-title{
margin-bottom:20px;
}


/* 事業名・予算 */
.policy-meta{
display:flex;
gap:40px;
margin-bottom:25px;
padding:15px;
background:#f5f5f5;
border-radius:8px;
}


/* セクション見出し */
.policy-section{
margin-top:25px;
border-left:4px solid #0066cc;
padding-left:10px;
}


/* POINT */
.policy-points{
background:#f8fbff;
padding:15px 20px;
border-radius:8px;
}

.policy-points li{
margin-bottom:8px;
}


/* 事業概要カード */
.policy-grid{
display:grid;
gap:20px;
margin-top:15px;
}

.policy-item{
border:1px solid #ddd;
border-radius:8px;
padding:18px;
background:#fafafa;
}


/* 23区初バッジ */
.policy-badge{
background:#e60023;
color:#fff;
font-size:12px;
padding:3px 8px;
border-radius:4px;
margin-left:6px;
}


/* 出典 */
.policy-source{
margin-top:25px;
font-size:12px;
color:#666;
}

/* スマホ見易さ調整（事業名・予算が縦並びなど） */
@media (max-width:768px){
.policy-modal-content{
margin:10% 15px;
padding:22px;
}

.policy-meta{
flex-direction:column;
gap:10px;
}
}

/* モーダル内別資料追加分 */
/* 実績ブロック */
.policy-achievements{
background:#fff6f8;
border:1px solid #f3c1cc;
border-radius:10px;
padding:18px;
margin-top:20px;
}

/* タイトル */
.policy-achievements-title{
font-size:16px;
font-weight:bold;
margin-bottom:12px;
color:#e6005c;
}

/* リスト */
.policy-achievements-list{
list-style:none;
padding:0;
margin:0;
}

.policy-achievements-list li{
margin-bottom:12px;
font-size:14px;
line-height:1.6;
}

/* 結論 */
.policy-achievements-result{
text-align:center;
margin-top:15px;
font-weight:bold;
color:#e6005c;
font-size:15px;
}

/* ボックスに影を付ける */
.policy-achievements{
box-shadow:0 4px 12px rgba(0,0,0,0.05);
}

/* 写真ギャラリー */
.policy-gallery{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:10px;
margin-top:12px;
}

/* 画像 */
.policy-gallery img{
width:100%;
height:90px;
object-fit:cover;
border-radius:6px;
cursor:pointer;
transition:0.3s;
}

/* ホバー */
.policy-gallery img:hover{
transform:scale(1.05);
}

/* スマホ調整（画像が大きくなる） */
@media (max-width:768px){
.policy-gallery{
grid-template-columns:1fr;
}
.policy-gallery img{
height:160px;
}
}

/* 画像グリッド（グラフ・写真共通） */
.policy-image-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:12px;
margin-top:15px;
}

/* 画像 */
.policy-image-grid img{
width:100%;
height:auto;
border-radius:8px;
box-shadow:0 4px 10px rgba(0,0,0,0.1);
}
/* スマホ調整（画像が大きくなる） */
@media (max-width:768px){
.policy-image-grid{
grid-template-columns:1fr;
}
}

/* 政策タグ */
.policy-tags{
margin-bottom:10px;
/* タグの隙間を少し空ける（スマホで詰まらないように） */
display:flex;
flex-wrap:wrap;
gap:6px;
}

.policy-tag{
display:inline-block;
font-size:12px;
padding:4px 10px;
border-radius:20px;
margin-right:6px;
color:#fff;
font-weight:600;
}


/* 政策カテゴリカラー */
.tag-child{
background:#ff7a00;
}

.tag-welfare{
  background:#2bb673;
}

.tag-safety{
  background:#e53935;
}

.tag-economy{
  background:#ffb300;
}

.tag-city{
  background:#5e35b1;
}

.tag-industry{
  background:#1565c0;
}

/* 政策カードグリッド */
.policy-grid-wrapper{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:25px;
margin-top:30px;
}

/* スマホでは1列 */
@media (max-width:768px){
.policy-grid-wrapper{
grid-template-columns:1fr;
}
}

/* 横スクロールエリア */
.policy-toc-scroll{
display: block;
overflow-x:auto;
white-space:nowrap;
padding:10px 10px 5px;
background:#fff;

border-bottom:1px solid #eee;

/* スクロール滑らか */
scroll-behavior:smooth;

/* iPhone用 */
-webkit-overflow-scrolling:touch;
}

/* 各タグ */
.toc-item{
display:inline-block;

padding:8px 14px;
margin-right:8px;

background:#f1f1f1;
border-radius:20px;

font-size:13px;
text-decoration:none;
color:#333;

white-space:nowrap;
}

/* =========================
   アクティブ時：タグ色にする
========================= */

/* 各タグごとのactive色 */
.toc-item[data-filter="all"].active{
  background:#ff9eb5;
  color:#fff;
}

.toc-item.tag-child.active{
  background:#ff7a00;
  color:#fff;
}

.toc-item.tag-welfare.active{
  background:#2bb673;
  color:#fff;
}

.toc-item.tag-safety.active{
  background:#e53935;
  color:#fff;
}

.toc-item.tag-economy.active{
  background:#ffb300;
  color:#fff;
}

.toc-item.tag-city.active{
  background:#5e35b1;
  color:#fff;
}

.toc-item.tag-industry.active{
  background:#1565c0;
  color:#fff;
}

/* ホバー */
.toc-item:hover{
opacity:0.8;
}

/* ヌルっと切り替わる（フェード） */
.policy-card{
transition:opacity .3s ease, transform .3s ease;
}

.policy-card.hide{
opacity:0;
pointer-events:none;

/* 少し縮むと自然 */
transform:scale(0.95);

/* 絞り込み後も、カード位置を維持したい場合は↓消す */
display:none;
}

/* 強調アニメーション */
.policy-card.highlight{
animation:highlightEffect 0.8s ease;
}

@keyframes highlightEffect{
0%{
transform:scale(0.95);
box-shadow:0 0 0 rgba(230,0,92,0);
}
50%{
transform:scale(1.03);
box-shadow:0 10px 30px rgba(230,0,92,0.3);
}
100%{
transform:scale(1);
box-shadow:0 0 0 rgba(230,0,92,0);
}
}

/* ラッパー（横スクロール促しヒント用） */
.policy-toc-wrapper{
  position:relative;
}

/* ヒント（丸デザイン） */
.toc-scroll-hint{
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);

  width:90px;
  height:90px;

  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;

  font-size:11px;
  color:#666;
  text-align:center;
  line-height:1.4;

  /* ★丸背景 */
  background:rgba(255,255,255,0.9);
  border-radius:50%;

  /* ★ふんわり影 */
  box-shadow:0 4px 12px rgba(0,0,0,0.08);

  /* ★フェード */
  transition:opacity .4s ease;

  pointer-events:none;
}

/* 非表示 */
.toc-scroll-hint.hide{
  opacity:0;
}
/* PCでは非表示 */
@media (min-width: 769px){
  .toc-scroll-hint{
    display:none;
  }
}

/* カード基準 */
.policy-card{
position:relative;
}


/* シール型バッジ */
.policy-badge-sticker{
position:absolute;
top:-18px;
right:-18px;

width:70px;
height:70px;

display:flex;
align-items:center;
justify-content:center;

border-radius:50%;

color:#fff;
font-weight:bold;
font-size:14px;

transform:rotate(-15deg);

box-shadow:0 6px 14px rgba(0,0,0,0.25);

z-index:2;
}


/* 内側文字 */
.policy-badge-sticker span{
transform:rotate(25deg);
}

/* 桜色バッジ（23区初） */
.badge-red{
background:radial-gradient(circle at 30% 30%, #ffb3c1, #ff6f91);
border:3px solid #fff;
}

/* 青色バッジ（都内初） */
.badge-blue{
background:radial-gradient(circle at 30% 30%, #4da3ff, #0078d7);
border:3px solid #fff;
}

/* オレンジバッジ */
.badge-orange {
  background: radial-gradient(circle at 30% 30%, #ffb347, #ff8c00);
  border: 3px solid #fff;
  box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

/* 政策イラスト */
.policy-card-illust{
position:absolute;
right:15px;
bottom:15px;
width:100px;
opacity:0.9;
}

/* モーダル内イラスト右下配置 */
.policy-image-side {
  float: right;
  width: 220px; /* サイズは調整OK */
  margin-left: 20px;
  margin-top: 10px;
}

.policy-image-side img {
  width: 100%;
  height: auto;
  border-radius: 8px;
}

@media (max-width: 768px) {
  .policy-image-side {
    float: none;
    width: 120px; /* 小さめでスッキリ */
    margin: 10px 0 10px auto; /* 右寄せ */
    opacity: 0.95; /* 少しなじませる */
  }
}

/* モーダル内の表のレイアウト調整（インクルーシブスポーツ政策） */
.policy-table td:nth-child(1) {
  width: 35%;
}
.policy-table td:nth-child(2) {
  width: 45%;
}
.policy-table td:nth-child(3) {
  width: 20%;
}


/* モーダル内の下線タイトル（全国各地と共存共栄する新たな自治体連携モデル） */
.policy-underline {
  text-decoration: underline;
  font-weight: bold;
  margin-top: 10px;
}

/* =========================
   政策特設バナー（春）
========================= */

.policy-banner{
display:block;
text-decoration:none;
margin:40px auto;
max-width:900px;
border-radius:16px;
overflow:hidden;
position:relative;

background:linear-gradient(135deg,#ffe3ea,#ff9eb5);

box-shadow:
0 10px 30px rgba(0,0,0,0.18),
inset 0 2px 10px rgba(255,255,255,0.5);

transition:all .3s ease;
}


/* 背景の桜装飾 */

.policy-banner::before{
content:"🌸";
position:absolute;

font-size:240px;

left:-40px;
top:-50px;

opacity:0.12;

transform:rotate(-20deg);
pointer-events:none;
}

.policy-banner::after{
content:"🌸";
position:absolute;

font-size:180px;

right:-40px;
bottom:-50px;

opacity:0.1;

transform:rotate(20deg);
pointer-events:none;
}


/* ホバー */

.policy-banner:hover{
transform:translateY(-5px);
box-shadow:
0 16px 40px rgba(0,0,0,0.22),
inset 0 2px 10px rgba(255,255,255,0.5);
}


/* 内側 */

.policy-banner-inner{
padding:40px 45px;
text-align:center;
color:#7a0033;
position:relative;
z-index:2;
}


/* 春特設バッジ */

.policy-banner-badge{
display:inline-block;

background:#ffffff;

color:#e6005c;
font-weight:bold;
font-size:14px;

padding:6px 14px;

border-radius:30px;

margin-bottom:14px;

box-shadow:0 3px 8px rgba(0,0,0,0.15);
}


/* タイトル */

.policy-banner-title{
font-size:28px;
margin:10px 0;
font-weight:700;
letter-spacing:0.03em;
}


/* 説明 */

.policy-banner-text{
font-size:15px;
margin-bottom:22px;
line-height:1.7;
}


/* ボタン */

.policy-banner-btn{
display:inline-block;

background:linear-gradient(135deg,#ff4d80,#e6005c);
color:#fff;

padding:11px 22px;

border-radius:30px;

font-weight:bold;
font-size:14px;

box-shadow:0 4px 10px rgba(0,0,0,0.2);

transition:all .25s ease;
}


/* ボタンホバー */

.policy-banner:hover .policy-banner-btn{
transform:scale(1.05);
box-shadow:0 6px 14px rgba(0,0,0,0.25);
}


/* スマホ */

@media (max-width:768px){

.policy-banner-inner{
padding:28px 22px;
}

.policy-banner-title{
font-size:21px;
}

.policy-banner-text{
font-size:14px;
}

.policy-banner::before{
font-size:170px;
left:-40px;
top:-30px;
}

.policy-banner::after{
font-size:140px;
}

}

/* リボン */
.policy-ribbon{

position:absolute;

top:26px;
right:-90px;

background:linear-gradient(135deg,#ff4d80,#e6005c);
color:#fff;

font-size:13px;
font-weight:bold;

padding:8px 90px;

transform:rotate(35deg);

box-shadow:0 4px 10px rgba(0,0,0,0.2);

z-index:3;

}

.policy-ribbon{
background:linear-gradient(135deg,#ff4d80,#e6005c);
}
/* リボンのスマホ調整 */
@media (max-width:768px){

.policy-ribbon{
font-size:11px;
padding:6px 60px;
right:-70px;
}

}