body.page,body.single {
	background:#fff;
}
figure.singular-header__thumbnail.post-thumbnail img, .paging__image img {
    border-radius: 10px;
	width: 100%;
}
.section-title h2,.archive-header h1 {
    margin-top: 0;
}
/* 全面クリック用リンク */
.stretched-link {
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: auto;
}

/* 親要素に position 必須 */
.news-card {
  position: relative;
}

    /* ===== Reset / Base ===== */
    *,*::before,*::after{box-sizing:border-box}
    html,body{margin:0;padding:0}
    body{font-family: system-ui, -apple-system, Segoe UI, Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; color:#0a0a0a; background:#f6f7fb}
    img{max-width:100%;height:auto;vertical-align:middle}
    a{color:inherit;text-decoration:none}
    :root{
      --brand:#1676ff; --ink:#0a0a0a; --muted:#ec5c99; --surface:#ffffff; --line:#e5e7eb; --shadow:0 8px 24px rgba(16,24,40,.08); --radius:16px; --container:1184px;
      --green:#56b000; --gap:12px;
    }
    .container{width:min(100% - 32px, var(--container)); margin-inline:auto}
    .section{padding:48px 0}
    .eyebrow{font-size:.75rem;letter-spacing:.12em;color:var(--muted);text-transform:uppercase}
    .h2{font-size:clamp(20px,3vw,28px);font-weight:800;letter-spacing:.02em}
.tag {
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--line);
    padding: 4px 14px;
    border-radius: 999px;
    font-size: 16px;
    color: #ffffff;
    background: #2b2b2b;
}
    /* ===== Header ===== */
    .header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.8);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line)}
    .header__inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
    .logo{font-weight:800;letter-spacing:.03em}
    .nav{display:flex;gap:20px}
    .nav a{font-size:14px;color:#111}

    /* ===== 共通 ===== */
@media (max-width:960px){
	.sp {display:block;}
}
@media (min-width:960px){
	.sp {display:none;}
}
.section-title h2 {
    margin-top: 0;
}
/* 初期状態：透明＋下に少しズレてる */
.reveal{
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .8s ease, transform .8s ease;
}

/* 出現後の状態 */
.reveal.active{
  opacity: 1;
  transform: translateY(0);
}

    /* ===== FV 2カラム ===== */
    .fv{padding:12px 0 24px}
    .fv__grid{display:grid;gap:var(--gap)}
    @media (min-width:960px){ .fv__grid{grid-template-columns:2.3fr 1fr;align-items:stretch} }
    .panel{background: #2b2b2b;border:1px solid var(--line);border-radius:12px;overflow:hidden;}

    /* 左：大スライダー */
    .fv-main .splide__slide{position:relative;min-height:38vw;}
    .fv-main .media{position:absolute;inset:0;background-size:cover;background-position:center}
    .fv-main .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.45))}
    .fv-main .caption{position:absolute;left:24px;bottom:24px;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.45)}
    .fv-main .title{font-size:clamp(24px,3.4vw,40px);font-weight:900;line-height:1.1}
    .fv-main .sub{margin-top:4px;color:#e5efff}

    /* 右：縦スライダー（オーバーレイカード） */
.fv-side-title {
	background:#2b2b2b;
	color:#fff;
	text-align: center;
}
    .fv-side {
    position: relative;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
@media (min-width:960px){
	    .fv-side {
			height: 100%;
		}
}
    .fv-side .splide__list{height:100%}
    .fv-side .splide__slide{height:calc((100% - 2 * var(--gap)) / 3)}
    .side-card{position:relative;height:100%;border-bottom:1px solid var(--line);overflow:hidden}
    .side-card:last-child{border-bottom:0}
    .side-card .bg{position:absolute;inset:0;background-size:cover;background-position:center}
    .side-card .veil{position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.05) 0, rgba(0,0,0,.55) 100%)}
    .side-card .cap{position:absolute;left:16px;right:16px;bottom:16px;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.6)}
    .badge{position:absolute;left:16px;top:12px;background:var(--green);color:#fff;font-weight:800;letter-spacing:.02em;border-radius:6px;padding:6px 10px;font-size:12px}
    .date{opacity:.9;margin-bottom:6px}
    .title{font-weight:900;line-height:1.35}
    .fv-side .splide__pagination{position:absolute;right:8px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:10px}
    .fv-side .splide__pagination__page{background:#fff;border:1px solid var(--line)}
    .fv-side .splide__pagination__page.is-active{background:#111}

/* === スマホ時のFV調整 === */
@media (max-width: 959px){

  /* FV 全体の余白ちょい調整 */
  .fv{
    padding: 0 0 24px;
  }
  .fv__grid{
    gap: 0px;
  }
	.container.fv__grid {
		width: 100%;
		padding:0;
		margin:0;
	}
  /* パネルはスマホではカード感を弱める */
  .fv .panel{
    border-radius: 0;
    border: none;
    background: transparent;
  }

  /* メインビジュアルは縦長に（好みで値調整してOK） */
  .fv-main .splide__slide{
    min-height: 140vw;
  }

  /* INFORMATION 見出し（青帯） */
  .fv-info-heading{
    margin: 8px 0;
    padding: 8px 16px;
    font-size: 14px;
    letter-spacing: .18em;
    color: #fff;
    background: #0070ff;
    font-weight: 700;
  }

  /* 右側スライダーを「横並びカード」にする */

	.fv-side {
    height: auto;
    justify-content: flex-start;
}
  .fv-side .splide__list{
    height: auto;
  }
  .fv-side .splide__slide{
    height: auto; /* 縦3分割やめる */
	          position: relative;
  }
.fv-side .splide__slide:after {
    position: absolute;
    bottom: 0;
    content: '';
    width: 100%;
    height: 1px;
    background: #e4e4e4;
}
  .side-card{
    position: relative;
    display: flex;
    align-items: stretch;
    min-height: 96px;
    border-bottom: 1px solid var(--line);
    overflow: hidden;
    background: #fff;
  }

  /* サムネ部分 */
  .side-card .bg{
    position: relative;
    flex: 0 0 35%;
    padding-top: 33%;           /* 縦横比を確保するためのダミー */
    background-size: cover;
    background-position: center;
  }

  /* オーバーレイはスマホでは消す */
  .side-card .veil{
    display: none;
  }

  /* テキスト部分を右側に */
  .side-card .cap{
    position: static;
    flex: 1;
    padding: 10px 12px;
    color: #111;
    text-shadow: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .side-card .badge{
    position: static;
    display: inline-block;
    margin: 8px 0px 0px 8px;
    padding: 2px 8px;
    font-size: 10px;
    border-radius: 999px;
  }

  .side-card .date{
    margin-bottom: 4px;
    font-size: 11px;
    opacity: .7;
  }

  .side-card .title{
    font-size: 13px;
    line-height: 1.4;
    font-weight: 700;
  }

  /* ページネーションを下に並べる */
  .fv-side .splide__pagination{
    position: static;
    transform: none;
    margin: 10px 0 0;
    flex-direction: row;
    justify-content: center;
    gap: 6px;
  }
}
    /* ===== section title ===== */
.section-title {
    position: relative;
    padding-left: 0.5rem;
}

.section-title::before {
    content: '';
    position: absolute;
    width: 4px;
    height: 90%;
    transform: translateX(-.5rem);
    background: #ec5c99;
}

    /* ===== NEWS ===== */
    .news-card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;}
    .news-card .img{aspect-ratio:16/9;background:#e5e7eb}
    .news-card .body{padding:14px 14px 16px}
    .news-card .ey{font-size:12px;color:var(--muted)}
    .news-card .ti{margin:6px 0 10px;font-weight:800;line-height:1.35}
    .news-card .dt{font-size:12px;color:var(--muted)}
    /* ===== INFO＆NEWSのホバーアニメーション ===== */
/* side-card 画像ズーム用 */
.side-card{
  position: relative;
  overflow: hidden;         /* ここ絶対必要、枠外にはみ出させない */
}

.side-card .bg{
  transition:
    transform .7s ease,
    filter .7s ease;
}

/* ホバー時：画像ふわっと拡大 */
.side-card:hover .bg{
  transform: scale(1.10);   /* お好みで 1.05〜1.15 */
  filter: brightness(0.9);
}

/* 縦スライダーなのでテキスト・バッジは影響なし */

/* NEWSカードのベース（必要あれば調整して） */
.news-card{
  position: relative;
  overflow: hidden;          /* これで中の拡大をクリップ */
  border-radius: 12px;
  background: #fff;
}

/* 画像エリア */
.news-card .img{
  width: 100%;
  padding-top: 56.25%;       /* 16:9。今と違う比率ならここはそのままでOK */
  background-size: cover;
  background-position: center;
  transition:
    transform .6s ease,
    filter .6s ease;
}

/* ホバー時：画像だけズーム＋ちょい暗く */
.news-card:hover .img{
  transform: scale(1.08);    /* 拡大率はお好みで 1.03〜1.12 くらい */
  filter: brightness(0.95);
}

/* クリック範囲をカード全体にしてるなら a にも block 付けとくと安定 */
.news-card > a{
  display: block;
  height: 100%;
}

    /* ===== Gallery（2列・逆方向・無限スクロール） ===== */
    .gallery{background:#fff6f6;border-top:1px solid var(--line);border-bottom:1px solid var(--line);justify-content: center;}
    .gallery .container {
    display: flex;
    margin: 0;
	padding: 0;
    width: 100%;
	max-width: 100%;
    flex-direction: column;
    align-content: center;
}
.gallery .container h2,.gallery .container .eyebrow {
    text-align: center;
}
    .ticker{overflow:hidden}
    .ticker__track{display:flex;gap:24px;align-items:center;animation:scroll var(--duration,40s) linear infinite}
    .ticker--reverse .ticker__track{animation-direction:reverse}
    .ticker:hover .ticker__track{animation-play-state:paused}
    @keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* カードは比率固定のまま */
.gcard{
  position: relative;
  flex: 0 0 auto;
  width: 280px;
  aspect-ratio: 16/9;
  border-radius: 12px;
  background: #fff;
  border: 1px solid var(--line);
  display: grid;
  place-items: center;
}

/* 画像を枠いっぱいに“収める”（どの比率でもOK） */
.gcard img{
  width: 100%;
  height: 100%;
  object-fit: contain;           /* ここがキモ：収まり優先 */
  object-position: center;
  display: block;
  border-radius: 10px;
}
}

/* 透過PNGの端が見切れるのが嫌なら背景色で縁取りしたいとき */
.gcard { background: #fff; }     /* ここで台紙色を調整 */
.gcard--cover img{ object-fit: cover }

    /* Splide 微調整 */
    .splide__arrow{background:#ffffffcc;border:1px solid var(--line);}
    .splide__pagination__page.is-active{background:#111}


    /* ===== CREATORS ===== */
		/* 横スクロール用の外枠 */
		.table-scroll {
		  width: 100%;
		  overflow-x: auto;
		  -webkit-overflow-scrolling: touch; /* iOSの慣性スクロール */
		  margin-bottom: 1em;
		}

		/* テーブル基本 */
		table.member-table  {
		  width: 100%;
		  border-collapse: collapse;
		  min-width: 600px; /* ここがスマホで横スクロールになるポイント */
		  background: #fff;
		  border-color: #f2d1d1;
		}

		.member-table th,
		.member-table td {
		  padding: 10px 12px;
		  border-bottom: 1px solid #f2d1d1;
		  text-align: left;
		  white-space: nowrap; /* 折り返し防止 → 横スクロールが成立 */
		}
		.member-table tr,
		.member-table th,
		.member-table td {
			border-color: #f2d1d1;
		}
		.member-table thead th {
		  background: #fff6f6;
		  font-weight: bold;
		  border-bottom: 2px solid #f2d1d1;
		}

		/* PCで綺麗に見せるために */
		@media (min-width: 768px) {
		  .member-table {
			min-width: 100%;
		  }
		}


    .creators-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
    }
    @media (max-width:1200px){ .creators-grid{grid-template-columns:repeat(3,1fr)} }
    @media (max-width:800px){ .creators-grid{grid-template-columns:repeat(2,1fr)} }

    .creator-card{
    background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;
    transition:transform .25s cubic-bezier(.2,.65,.2,1), box-shadow .25s;
    }
    .creator-card:hover{ transform:translateY(-4px); box-shadow:0 10px 30px rgba(16,24,40,.12) }

    .creator-card .ph{
    aspect-ratio:1/1; background:#e5e7eb center/cover no-repeat;
    }
    .creator-card .body{
    padding:14px 14px 16px;
    }
    .creator-meta{display:flex; align-items:center; gap:8px; color:var(--muted); font-size:12px}
    .creator-name{font-weight:900; line-height:1.35; margin:6px 0 6px}
    .creator-role{font-size:12px; color:var(--muted)}
    .creator-tags{display:flex; gap:6px; flex-wrap:wrap; margin-top:8px}
    .creator-tag{border:1px solid var(--line); border-radius:999px; padding:2px 8px; font-size:11px; color:var(--muted); background:#fff}
/* ===== Creator hover overlay ===== */
.creator-card{ position:relative; overflow:hidden }
.creator-card .ph{ transition:transform .6s cubic-bezier(.2,.65,.2,1), filter .6s }
.creator-card:hover .ph{ transform:scale(1.05); filter:saturate(.9) brightness(.9) }

/* 黒ベール＋白枠 */
.creator-overlay{
  position:absolute; inset:0;                 /* カード全面を覆う */
  display:grid; place-items:center;
  background:rgba(0,0,0,.45);
  opacity:0; pointer-events:none;
  transition:opacity .35s ease;
}

.creator-overlay::before{
  content:""; position:absolute; inset:14px;
  border:2px solid #fff; border-radius:10px;
  opacity:.0; transform:scale(.96);
  transition:transform .4s cubic-bezier(.2,.65,.2,1), opacity .3s;
}
@media (min-width:960px){
	.creator-overlay::before{inset:8px;}
}
/* テキスト出現（上：名前、下：肩書き） */
.ov-name, .ov-role{
  color:#fff; text-align:center;
  text-shadow:0 2px 10px rgba(0,0,0,.35);
  transform:translateY(10px); opacity:0;
  transition:transform .38s ease, opacity .38s ease;
}
.ov-name{ font-weight:900; font-size:clamp(20px,2.2vw,28px); letter-spacing:.02em }
.ov-role{ margin-top:10px; font-size:14px; line-height:1.6; opacity:.85 }
@media (max-width:960px){
	.ov-name{ font-size:clamp(16px,2.2vw,28px);}
.ov-role{ font-size:7px;}
}
/* ホバー/フォーカス時の最終状態 */
.creator-card:hover .creator-overlay,
.creator-card:focus-visible .creator-overlay{ opacity:1 }
.creator-card:hover .creator-overlay::before,
.creator-card:focus-visible .creator-overlay::before{
  opacity:1; transform:scale(1)
}
.creator-card:hover .ov-name,
.creator-card:hover .ov-role,
.creator-card:focus-visible .ov-name,
.creator-card:focus-visible .ov-role{
  transform:translateY(0); opacity:1
}
.creator-card:hover .ov-role{ transition-delay:.05s } /* ちょい遅らせて“出てくる感” */


/* 動きを控えたい人向け */
@media (prefers-reduced-motion: reduce){
  .creator-card .ph{ transition:none }
  .creator-overlay,
  .creator-overlay::before,
  .ov-name,.ov-role{ transition:none }
}

.offcer-only-name {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: nowrap;
	margin-top: 4rem;
}
@media (max-width:960px){
	.offcer-only-name {
		flex-wrap: wrap;
		gap: 1rem;
		margin-top: 3rem;
	}
    .offcer-only-name div {
        width: 46%;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
    }
	 .ov-name {
        font-size: clamp(18px, 2.2vw, 28px);
    }
	.ov-role {
    margin-top: 0;
	font-size: 12px;
}
}
.offcer-only-name .ov-name, .offcer-only-name .ov-role {
    color: #000;
    text-shadow: none;
	opacity: 1;
	width: 100%;
}
/* ===== btn ===== */
section.player.section {
    display: flex;
    justify-content: center;
    align-items: center;
}
.btn, a.btn, button.btn {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.5;
    position: relative;
    display: inline-block;
    padding: 1rem 4rem;
    cursor: pointer;
}
	a.btn-flat {
  overflow: hidden;
  padding: 1.5rem 6rem;
  color: #fff;
  border-radius: 0;
  background: #000;
}
@media (max-width:960px){	
.btn, a.btn, button.btn {
    font-size: 1rem;
    line-height: 1.5;
    padding: 1rem 2rem;
    cursor: pointer;
}
	a.btn-flat {
  overflow: hidden;
  padding: 1.5rem 6rem;
  color: #fff;
  border-radius: 0;
  background: #000;
}
}
a.btn-flat span {
  position: relative;
}

a.btn-flat:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
  -webkit-transform: translateX(-96%);
  transform: translateX(-96%);
  background: #ec5c99;
}

a.btn-flat:hover:before {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
}
/* ===== FOOTER ===== */
.footer{
  background:#2b2b2b;color:#f1f1f1;padding:48px 0 32px;margin-top:0
}
.footer-top{
  display:flex;flex-direction:column;align-items:center;gap:16px;margin-bottom:32px
}
.footer-logo{font-weight:800;font-size:20px;letter-spacing:.05em}
.footer-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;font-size:14px}
.footer-nav a{color:#ddd;transition:color .25s}
.footer-nav a:hover{color:#fff}
.footer-links{display:flex;justify-content:center;gap:24px;font-size:13px;color:#999;margin-bottom:16px}
.footer-links a{color:#999;transition:color .25s}
.footer-links a:hover{color:#fff}
.footer-copy{text-align:center;font-size:12px;color:#666}
@media(max-width:700px){
  .cta-grid{grid-template-columns:1fr}
  .cta-card{aspect-ratio:16/9}
}