@charset "utf-8";

body {
	margin: 0;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	font-family: "游ゴシック体", "ヒラギノ角ゴ ProN", "メイリオ", "MS ゴシック", sans-serif;
	margin: 0;
	overflow-y: scroll;
	font-size: 14px;
}
/* ◆ サイト全幅 ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
#wrapper {
  width: 1050px;      /* 全体幅 */
  margin: 0 auto;    /* 画面中央寄せ */
  overflow: hidden;  /* floatの親要素が高さを持たない場合の対策 */
}
/* ヘッダー部分関連 ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
#header {
  width: 100%;     /* wrapperの幅に追随 */
  margin: 0;       /* wrapperが中央寄せするので不要 */
  background-color: #FFF;
}
#top-image {
  width: 100%;      /* wrapperに追随 */
  margin: 0 auto;
}
#top-image img {
  display: block;   /* 下の隙間防止 */
  width: 100%;      /* 横幅いっぱい */
  height: auto;     /* 縦横比を自動維持 */
}
/* コンテンツ部分関連 ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
#main-25 {
  width: 100%;             /* wrapperに追随 */
  background-color: #FFF;
  margin: 15px auto 15px;  /* 上10px / 左右auto / 下15px */
  overflow: hidden;        /* float解除（left/rightカラムを包むため） */
}
/* 左メニュー・カラム全体 ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.left-menu {
  float: left;
  width: 200px;       /* 旧230px→180pxに縮めたまま“固定” */
  margin-top: 0px;
}
/* 右コンテンツ・カラム全体 ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ ▼ */
.right-contents-25 {
  float: right;
  width: calc(100% - 200px);  /* wrapper幅から左メニュー180pxを引く */
  margin-bottom: 10px;
}

/* 左メニュー ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.kakomi-left {/* メニュー大枠 */
  width: 96%;
  margin-right: 8px;
  margin-bottom: 15px;
	padding: 5px 0px 0px 0px;
	letter-spacing: 1px;
	background-color: #F6F6F6;
	vertical-align: middle;
	border: 1px solid #CCC;
}
.kakomi-left2 {/* メニュー大枠メンバーページ */
  width: 96%;
  margin-right: 8px;
  margin-bottom: 15px;
	padding: 5px 0px 0px 0px;
	letter-spacing: 1px;
	background-color: #f5f1e9;
	vertical-align: middle;
	border: 1px solid #CCC;
}
.kakomi-left .MenuName {
  margin-left: 6px;
  margin-bottom: -5px;
	font-size: 14px;
  font-weight: bold;
	color: #C83B27;
}
.kakomi-left2 .MenuName {
  margin-left: 6px;
  margin-bottom: -5px;
	font-size: 14px;
  font-weight: bold;
	color: #C83B27;
}
.menu-list {/* メニュー内側 */
  width: 100%;
  box-sizing: border-box; /* すべて含めてちょうど100%の幅 */
  margin-right: 8px;
	background-color: #fff;
	padding: 10px 12px 10px 8px; /* 上5px / 左右10px / 下10px */
	list-style: none;
	font-size: 13px;
}
.menu-list li {/* メニュー内リスト */
	margin-bottom: 12px;
	color: #3775DB;
	letter-spacing: 0;
}
.menu-list li::before {
	content: "- ";
}
.menu-list li:last-child {
	margin-bottom: 0;
}
.special-link {
	color: #3775DB;      /* 訪問前・訪問後も同じ色 */
	text-decoration: none; /* デフォルトでは下線なし */
}
.special-link:visited {
	color: #3775DB;      /* 訪問後も同じ色 */
}
.special-link:hover {
	text-decoration: underline; /* マウスホバー時のみ下線を表示 */
}
.special-link:active {
	color: darkblue;      /* クリック時も同じ色 */
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ 左メニュー */
.kakomi-left-member {
  width: 190px;
  font-size: 15px;
  letter-spacing: 1px;
  color: #7a5c3d;
  background: #f8f1e4;
  border: 1px solid #ccc;
  vertical-align: middle;
  padding: 8px 8px 0;
  margin: 0 8px 15px 0;
}
/* ▼ コンテンツ汎用 ▼ */
.box-detail-in-right {
	width: 200px;
	float: right;
	font-size: 15px;
	color: #333;
}
.cp_link4 {
	display: inline-block;
	padding: 0.3em;
	margin-bottom: 5px;
	color: #FF3300;
	text-decoration: none;
	letter-spacing: 0.03em;
	transform: scale(1);
	transition: 0.3s;
}
/* 各アルバムページ 関連タイトルのシリーズタイトル ▼ */
.cp_link4b { /* シリーズタイトル＋リンク ▼ */
	display: inline-block;
	font-size: 15px;
  font-weight: bold;
	color: #FF3300;
	text-decoration: none;
	letter-spacing: 0.03em;
	padding: 0 0.1em;
	transform: scale(1);
	transition: 0.3s;
}
.cp_link4b::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;                /* 文字のすぐ下ではなく少し余裕をもたせる */
  width: 100%;
  height: 1px;                 /* 細く上品に */
  background-color: currentColor; /* 文字色と連動（#FF3300） */
  opacity: 0.4;                /* 落ち着いた印象に */
  transition: opacity 0.3s ease, transform 0.3s ease;
  transform-origin: left center;
}
/* ▼ ホバー時：ほんの少し濃く、さりげなく */
.cp_link4b:hover::after {
  opacity: 0.8;
  transform: scaleX(1.02);     /* ほんの少しだけ伸びる */
}
.SongFileLink {
  display: inline-block;
	font-size: 13px;
	color: #b05a00;
	text-decoration: none;
	letter-spacing: 0.03em;
	padding: 0 0.3em;
	transform: scale(1);
	transition: 0.3s;
  font-weight: bold;
  color: #b05a00;   /* 通常時：落ち着いたブラウンオレンジ */
}
.SongFileLink:hover {
  color: #d19800;   /* ホバー時：明るめ黄土色 */
}
.download-link a {
  color: #b05a00;   /* ← 好みの色に差し替え */
  text-decoration: none;
  font-weight: bold;
  transition: color 0.3s ease;
}
.download-link a:hover {
  color: #d19800;   /* ← ホバー時に少し明るく */
}
.detail2 {
	width: 340px;
	float: right;
	font-size: 14px;
	color: #333;
	margin-bottom: 10px;
	padding-left: 159px;
}
.detail2-houkou {
	width: 355px;
	float: right;
	font-size: 15px;
	color: #333;
	margin-bottom: 10px;
	padding-left: 144px;
}
.detail2-bangumi {
	width: 372px;
	float: right;
	font-size: 15px;
	color: #333;
	margin-bottom: 10px;
	padding-left: 129px;
}
.infobox-series {
  width: 880px;
  margin: 10px auto 35px;
  padding: 0 20px;
  float: right;
  text-align: left;
  font-size: 14px;
  line-height: 1.7;
  letter-spacing: 0.04em;
  color: #333;
  background-color: #FAFAFA;
  border-radius: 10px;
}
.right-contents-25-h1 {
  width: 80%;
  text-align: center;
  margin: 10px auto 0;
}
.series {
	width: 920px;
	float: right;
	color: #333;
}
.series2 {
	width: 920px;
	float: right;
	color: #333;
	margin-bottom: 30px;
}
.series-info {
	width: 100%;
	float: right;
	font-size: 15px;
	color: #333;
}
.series-info-1 {
	float: right;
	color: #333;
  padding-top: 0;
  margin-top: 0;
}
.series-info-2 {
  background-color: #f9f9f9;
  border-left: 6px solid #c06050; /* 赤み系ポイント */
  padding: 1em 1.5em;
  margin-bottom: 1.5em;
  border-radius: 6px;
  box-shadow: 0 0 5px rgba(0,0,0,0.05);
  font-size: 15px;
  line-height: 1.6;
}
.series-left {
	width: 200px;
	float: left;
	font-size: 15px;
	color: #333;
}
.series-left-1 {
	width: 200px;
	float: right;
	font-size: 15px;
	color: #333;
	margin-bottom: 7px;
	border: 1px solid #999;
	height: 200px;
}
.series-left-2 {
	width: 200px;
	float: right;
	text-align: left;
}

/* ▼ 各アルバム紹介ページ ▼ */
.box-subtitle {
	width: 880px;
	float: right;
	margin: 10px auto 35px;
	padding: 5px 20px;
	text-align: center;
	font-size: 17px;
	letter-spacing: 0.04em;
	color: #FFF;
	background-color: #C83B27;
	border-radius: 10px;
}
.line-box1 {
	width: 100%;
	float: left;
	margin-bottom: 25px;
	padding: 6px 10px 0;
	background-color: #F8F8F8;
}
.line1 {
	width: 100%;
	float: left;
	color: #333;
	font-size: 14px;
	height: 60px;
	align-items: center; /* 縦中央揃え */
}
.line1b {
	width: 100%;
	float: left;
	font-size: 14px;
	height: 60px;
}
.line1-left {/* ジャケイメージ */
	width: 60px;
	height: 60px;
	float: left;
	color: #0CF;
	background-color: #6FC;
}
.line2 {
	width: 900px;
	float: left;
	display: flex;
	align-items: center;
	height: 30px;
	margin: 8px 0 5px;
	font-size: 13px;
	color: #333;
}
.line2d {
	width: 900px;
	float: left;
	display: flex;
	align-items: center;
	height: 30px;
	margin: 8px 0 15px;
	font-size: 13px;
	color: #333;
}
.main-title {
	font-size: 14px;
	width: 550px;
	float: right;
	height:28px;
	vertical-align: middle;
}
.infobox-series2 {
	width: 98%;
	float: right;
	margin: 20px auto 15px;
	padding: 10px 20px;
	text-align: left;
	font-size: 14px;
	line-height: 1.7;
	letter-spacing: 0.04em;
	color: #333;
	background-color: #FAFAFA;
	border-radius: 10px;
  box-sizing: border-box;     /* ← padding込みでwidthを計算 */
}

/* ▼ フォント関連 ▼ */
.h1-special {
  color: #c83b27;
  font-size: 23px;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
  margin: 10px 0;
}
.ac-green {
	color:#22AC38
}
.color-red {
	color: #F33;
}
.cp_link5 {
	display: inline-block;
	color: #FF3300;
	text-decoration: none;
	letter-spacing: 0.03em;
	margin-left: 0;
	padding-left: 0.0em;   /* ← 左だけ少なくする（例） */
	padding-right: 0.3em;  /* 右はそのまま */
	transform: scale(1);
	transition: 0.3s;
}
.font-seriestitle {
	color: #333;
	font-size: 14px;
}
.st-blue {
	color:#0066cc;
}

.album-links {
	width: 200px;
	float: right;
	margin: 5px 0;
	padding-bottom: 5px;
	text-align: center;
}
.album-links a {
	display: block;
	width: 100%;
	padding: 3px 0;
	font-size: 15px;
	font-weight: bold;
	color: #fff;
	background-color: #F39800;
	border-radius: 5px;
	text-decoration: none;
	text-align: center;
	line-height: 3;
	box-sizing: border-box;
	transition: background-color 0.3s ease;
}
.album-links a:hover {
	background-color: #BD7600;
	color: #fff;
}
.down-links {
  width: 200px;
  float: right;
  margin: 5px 0;
  text-align: center;
}
.down-links a {
  display: block;
  width: 100%;
  padding: 3px 0;
  font-size: 15px;
  font-weight: bold;
  color: #fff;
  text-decoration: none;
  text-align: center;
  line-height: 3;
  border-radius: 5px;
  background-color: #FF5733;
  transition: background-color 0.3s ease;
  box-sizing: border-box;
}
.down-links a:hover {
  background-color: #C83B27;
  color: #fff;
}
.vol-links {
  width: 100%;
  margin: 0 0 35px auto;  /* ← 右寄せ。左カラムを避ける */
  padding-bottom: 15px;
  border-bottom: 1px solid #EEE;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  clear: both; /* 念のため追加：前のfloatの影響を排除 */
}
.vol-links a {
  display: inline-block;
  padding: 2px 10px;
  font-size: 12px;
  line-height: 2;
  text-decoration: none;
  color: #333;
  background-color: #f8f8f8;
  border-radius: 5px;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.vol-links a:hover {
  background-color: #FF5733;
  color: #fff;
}
.vol-links-x {
  width: 100%;
  margin: 0 0 20px auto;  /* ← 右寄せ。左カラムを避ける */
  padding-bottom: 15px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;   /* ★ 中央寄せ */
  clear: both; /* 念のため追加：前のfloatの影響を排除 */
}
.vol-links-x a {
  display: inline-block;
  padding: 2px 10px;
  font-size: 12px;
  line-height: 2;
  text-decoration: none;
  color: #fff;
  background-color: #e73b57;
  border-radius: 5px;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.vol-links-x a:hover {
  background-color: #FF5733;
  color: #fff;
}
/* 最下のボックス下線なし */
.vol-links2 {
  width: 100%;
  margin: 0 0 35px auto;  /* ← 右寄せ。左カラムを避ける */
  padding-bottom: 15px;
  margin-bottom: 5px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  clear: both; /* 念のため追加：前のfloatの影響を排除 */
}
.vol-links2 a {
  display: inline-block;
  padding: 2px 10px;
  font-size: 12px;
  line-height: 2;
  text-decoration: none;
  color: #333;
  background-color: #f8f8f8;
  border-radius: 5px;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.vol-links2 a:hover {
	background-color: #FF5733;
	color: #fff;
}
.vol-links2::after {
  content: "";
  display: block;
  clear: both;
}
.vol-links3 {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  float: right;
  width: 920px;
  text-align: left;
  margin: 0 0 10px;
  padding-bottom: 15px;
}
.vol-links3 a {
	display: inline-block;
	padding: 5px 10px;
	font-size: 14px;
	line-height: 3;
	text-decoration: none;
	color: #333;
	background-color: #f8f8f8;
	border-radius: 5px;
	transition: background-color 0.3s ease, color 0.3s ease;
}
.vol-links3 a:hover {
	background-color: #FF5733;
	color: #fff;
}

.vol-linksX {
  width: 100%;
  margin: 0 0 35px auto;  /* ← 右寄せ。左カラムを避ける */
  padding-bottom: 15px;
  border-bottom: 1px solid #EEE;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  clear: both; /* 念のため追加：前のfloatの影響を排除 */
}
.vol-linksX a {
  display: inline-block;
  padding: 2px 10px;
  font-size: 12px;
  line-height: 2;
  text-decoration: none;
  color: #fff;
  background-color: #FF5733;
  border-radius: 5px;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.vol-linksX a:hover {
  background-color: #f8f8f8;
  color: #333;
}

.youtube-links {
  float: right;
  width: 200px;
  text-align: center;
  margin: 5px 0 0;
  padding-bottom: 0;
}
.youtube-links a {
  display: block;
  width: 100%;
  font-size: 15px;
  font-weight: bold;
  color: #fff;
  text-align: center;
  text-decoration: none;
  line-height: 1.5;
  background: #f00;
  border-radius: 5px;
  padding: 3px 0;
  box-sizing: border-box;
  transition: background-color 0.3s ease;
}
.youtube-links a:hover {
	background-color: rgb(220, 38, 28);
	color: #fff;
}

/* ▼ 歴史教養音楽集 専用 ▼ */
.box-rekishi0 {
  display: flex;
  float: left;
  width: 920px;
  margin: 20px 0 0 25px;
  padding-bottom: 0;
}
.box-rekishi {
  display: flex;
  float: left;
  width: 920px;
  margin: 0 0 0 25px;
  padding-bottom: 0;
}
.box-rekishi2 {
	font-size: 15px;
	font-family: "游ゴシック体", "ヒラギノ角ゴ ProN", "メイリオ", "MS ゴシック", sans-serif;
	display: flex;
	text-align: left;
	padding-left: 20px;
	flex: 1; /* 残りの幅を自動で埋める */
	align-items: center; /* 縦方向の中央揃え */
	margin-top: 0px;
	padding-bottom: 15px;
}
.rekishi-links {
	display: flex;
	align-items: center; /* 縦方向の中央揃え */
	width: auto;
	flex-wrap: wrap; /* 子要素が折り返しできるように */
	gap: 10px; /* リンク間の隙間を調整 */
	float: left;
	margin-top: 0px;
	padding-bottom: 15px;
	text-align: left;
}
.rekishi-links a {
	text-decoration: none;
	font-size: 14px;
	color: #00A200;
	padding: 5px 10px;
	border-radius: 5px;
	background-color: #f8f8f8;
	transition: all 0.3s ease;
	line-height: 3; /* 行の高さを設定 */
}
.rekishi-links a:last-child {
	margin-right: 0; /* 最後のリンクの右側余白をなくす */
}
.rekishi-links a:hover {
	background-color: #FF5733; /* ホバー時に色を変更 */
	color: #fff; /* 文字を白に */
}

/* ▼ メールフォーム ▼ */

/* 画像の初期サイズ */
.hover-enlarge {
	transition: transform 0.3s ease, z-index 0s ease;
	position: relative;
	z-index: 1;
	transform-origin: right center; /* 右辺の縦軸センターを拡大の基点に */
}
/* マウスオーバー時に拡大＆最前面に */
.hover-enlarge:hover {
	transform: scale(3.2);
	z-index: 10;
}

/* フッター 2025リニューアル */
/* ===== フッター全体：背景エリア ===== */
#footer-all-25 {
  background-color: #F6F6F6;  /* 背景色：全幅に広がる */
  width: 100%;               /* ビューポート全幅 */
  min-width: 1050px;          /* ← Nemotoさんの要望：最低1050pxを維持 */
  margin: 0;
  padding: 0;
  border-top: 1px solid #CCC;
  box-sizing: border-box;
  clear: both;                /* float解除 */
}
/* ===== 内部コンテンツ：中央寄せ ===== */
#footer-Yoko {
  width: 100%;
  max-width: 1050px;          /* コンテンツの上限幅 */
  margin: 0 auto;             /* 中央寄せ */
  padding: 0 20px;            /* 内側余白 */
  background: none;           /* 背景は親に任せる */
  box-sizing: border-box;
}

/* フッター メニュー */
.footer-menu {
	list-style: none;
	padding: 0;
	margin: 0;
	font-size: 13px;
}
.footer-menu li {
	margin-bottom: 10px; /* 行間を狭くする */
	line-height: 1.2; /* 高さを調整（デフォルトより狭め） */
}
.footer-menu a {
	text-decoration: none;
	color: #333;
}
.footer-title {
	font-size: 13px; /* フォントサイズ */
	font-weight: bold; /* 太字 */
	color: #333; /* 文字の色 */
	border-bottom: 2px solid #ccc; /* 下線 */
	padding-bottom: 2px; /* 下線と文字の間隔を狭める */
	display: inline-block;
}

/* フッター メニュー格納 */
.footer-menubox25-1 {
	float: left;
	margin: 15px 23px 20px 20px;
	padding-left: 5px;
	font-size: 13px;
	line-height: 35px;
	color: #000;
}
.footer-menubox25-2 {
	float: right;
	margin: 20px 5px 0;
	font-size: 13px;
	color: #000;
}
/* フッター左側の情報 */
.footer-logobox-1 {
	font-size: 14px;
	color: #000;
	line-height: 25px;
	margin-top: 5px;
}
/* フッターのJASRAC許諾情報を横並びに */
.footer-logobox-2 {
	display: flex;
	align-items: center; /* 画像とテキストの縦位置を中央揃え */
	gap: 10px; /* 画像とテキストの間隔 */
	font-size: 14px;
	color: #000;
	line-height: 25px;
	margin-top: 20px;
}
/* 画像サイズの調整 */
.footer-logobox-2-left img {
	width: 50px;
	height: 50px;
}
/* JASRACの許諾番号部分 */
.footer-logobox-2-right {
	font-size: 12px;
	color: #000;
	line-height: 1.5;
}
/* 他の情報（必要なら） */
.footer-logobox-3 {
	font-size: 14px;
	color: #000;
	line-height: 25px;
	margin-top: 10px;
}

/* フッター メニュー 2025 横並び編*/
#footer-Yoko {
	width:100%;
	max-width:1050px;     /* ← wrapperと同じ */
	margin:0 auto;
	padding:0 20px;      /* 内側余白のみ */
	background-color: #F6F6F6;
}
.footer-row-1,
.footer-row-2,
.footer-row-3{
  width:100%;
  margin:18px auto 28px;
  font-size:12px;
}
/* 見出し */
.footer-row-1 h4,
.footer-row-2 h4,
.footer-row-3 h4{
  font-size:13px;
  font-weight:bold;
  padding-left:8px;
  border-left:3px solid #666;
  margin:0 0 8px;
}
.footer-row-3 {
  display: flex;
  align-items: flex-end;
  gap: 20px;
}
.footer-nav-horizontal {
  display: flex;
  flex-wrap: wrap; /* 折り返しを許可 */
  gap: 10px 20px; /* 上下15px、左右25px */
  padding: 0;
  margin: 0;
  list-style: none;
}
.footer-nav-horizontal li {
  white-space: nowrap; /* リンク内で改行させない */
}
.footer-nav-horizontal li a {
  font-size: 12px;
  line-height: 1.7;
  white-space: nowrap;  /* 改行させない */
}
.footer-link-darkblue a {
  color: #1a2a44;
  text-decoration: none;
  transition: color 0.3s ease;
}
.footer-link-darkblue a:hover {
  color: #004080;
  text-decoration: underline;
}
.footer-support-left {
  width: 80%;
}
.footer-support-right {
  width: 20%;
  text-align: right;
}
.footer-support-right img {
  max-width: 180px;
  height: auto;
}
.footer-support-right .jasrac-info {
  display: flex;
  align-items: center; /* 上下中央揃え */
  gap: 8px; /* 画像とテキストの間の余白 */
  align-items: flex-end; /* 下端で揃える！ */
}
.jasrac-text {
  font-size: 9px;
  line-height: 1.4;
  text-align: left;
}

/* フッター 最下 */
#footer-under25 {
	background-color: #C83B27;
	font-size: 15px;
	color: #FFF;
}
#footer-under25-in {
	width: 100%;          /* 全幅に広げる */
	max-width: 1050px;     /* wrapper幅に揃える */
	margin: 0 auto;
	padding-top: 10px;
	background-color: #C83B27;
	font-size: 13px;
	text-align: right;
	color: #FFF;
}

#title {
	width: 1150px;
	background-color: #FFF;
	margin: 0 auto
}
.clear { clear:both; }  
.clear hr { display:none; } 

.back-to-top {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: 50px;
    height: 50px;
    background-color: #333;
    color: white;
    border: none;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    display: none;
    opacity: 0.7;
    transition: opacity 0.3s;
    z-index: 9999; /* 最前面に表示 */
}
.back-to-top:hover {
    opacity: 1;
}

/* 音源情報 関連 */
h2 {
	position: relative;
	font-size: 21px;
	margin: 5px 0 6px 15px;
	padding-left: 10px;
	letter-spacing: 0.05em;
}
.series-info-1 h2 {
	margin-top: 0;
	padding-top: 0;
}
h3.academic-title {
	font-size: 18px;
	font-weight: bold;
	color: #333;
	padding-bottom: 8px;
	display: inline-block;
	position: relative;
}
h3.academic-title::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 40%;
	height: 3px;
	background-color: #33CC00;
}
h3.standard-title {
	font-size: 18px;
	font-weight: bold;
	color: #333;
	padding-bottom: 8px;
	display: inline-block;
	position: relative;
}
h3.standard-title::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 40%;
	height: 3px;
	background-color: #0066FF;
}
p.p2 {
  color: red;
  text-align: right;
}
.genre-block-0 {
  width: 920px;
  margin: 20px auto 20px; /* ← 上に余白を持たせる */
  text-align: center;
}
.genre-block {
  width: 90%;
  margin: 30px auto 30px; /* ← 上に余白を持たせる */
  text-align: center;
}
.genre-heading {
  font-size: 22px;
  color: #C83B27;
  display: inline-block;
  padding-bottom: 5px;
  margin-bottom: 0px;
  letter-spacing: 0.05em;
}
.genre-heading2 {
  display: inline-block;
  font-size: 18px;
  color: #c83b27;
  letter-spacing: 0.05em;
  margin: 10px 0 5px;
  padding-bottom: 0;
}
.genre-desc {
  font-size: 14px;
  color: #444;
  max-width: 800px;
  margin: 0 auto 20px;
}
.genre-box {
  background: #fafafa;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 15px 20px;
  margin: 5px 0 30px;
}
.genre-box2 {
  background: #fafafa;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 7px 20px;
  margin: 2px 0 30px;
}
.genre-block2 {
  width: 920px;
  margin: 10px auto 20px; /* ← 上に余白を持たせる */
  text-align: center;
}
.genre-desc.genre-box h2 {
  font-size: 16px; /* 好きなサイズに調整 */
}
.series-info-compact {
  max-width: 720px;
  margin: 0px auto 55px auto; /* ← 上のマージンを12pxに縮小 */
  padding: 12px 16px;
  background-color: #fdf8f6;
  border: 1px solid #e0d9d6;
  border-left: 6px solid #cc4b3a;
  border-radius: 4px;
  font-size: 14.5px; /* ← 少しだけ小さく */
  line-height: 1.7;
  color: #333;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}
.series-info-compact a {
  color: #cc4b3a;
  text-decoration: underline;
  font-weight: bold;
}
.series-info-compact a:hover {
  color: #a33022;
}
.series-info-compact2 {
  max-width: 720px;
  margin: 20px auto 45px auto;
  padding: 12px 16px;
  background-color: #fdf8f6;
  border: 1px solid #e0d9d6;
  border-left: 6px solid #cc4b3a;
  border-radius: 4px;
  font-size: 14.5px; /* ← 少しだけ小さく */
  line-height: 1.7;
  color: #333;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}
.series-info-compact2 a {
  color: #cc4b3a;
  text-decoration: underline;
  font-weight: bold;
}
.series-info-compact2 a:hover {
  color: #a33022;
}
.winter-sub {
  color: #4a90e2; /* 冬の静けさ → クールな青 */
}
.xmas-sub {
  color: #d33; /* クリスマス → あたたかい赤系 */
}
.newyear-sub {
  color: #cc9900; /* お正月 → 和風の金・黄土色 */
}
.cinema-sub {
  color: #444488; /* 落ち着いた青紫：シネマティックな印象 */
  font-weight: bold;
}
.promo-sub {
  color: #cc5500; /* 落ち着きつつも販促らしいオレンジ系 */
  font-weight: bold;
}

/* Guide */
.series-info-3a {
	width: 450px;
	float: left;
	font-size: 15px;
	color: #333;
}
.series-info-3c {
	margin-left: 0px ;
	width: 56%; /* 400px相当 */
	float: left;
	font-size: 11px;
	color: #333;
}
.series-info-3b {
  float: right;
  width: 35%;
  font-size: 13px;
  color: #333;
  background: #fff;
  padding: 3px 10px 8px;
  margin: 0 18px 6px 0;
  border: 1px solid #ddd;
  border-radius: 8px;
}
.detail-2 {
	width: 98%;   /* ← 480px を基準にしたい場合 */
	max-width: 480px; /* 画面が広すぎるときは最大480pxに制限 */
	float: left;
	font-size: 13px;
	color: #333;
	margin-left: 5px;
	margin-bottom: 6px;
	line-height: 2; /* 行間を少し開ける */
	word-break: keep-all;
	overflow-wrap: break-word;
}
.series-info-sp {
	float: right;
	width: 96%;
	margin: 0px 0 30px 10px;
	padding: 0 15px;
	font-size: 12px;
	color: #333;
	background-color: #FAFAFA;
	letter-spacing: 0.5px;
	line-height: 1.6;
	border: 1px solid #ddd;
}
.series-info-sp2 {
	float: right;
	width: 96%;
	margin: 5px 0 30px 10px;
	padding: 0 15px;
	font-size: 12px;
	color: #333;
	background-color: #FAFAFA;
	letter-spacing: 0.5px;
	line-height: 1.6;
	border: 1px solid #ddd;
}
.series-info-sp h2 {
  color: #d03c3c;
  font-size: 1.1em;
  text-align: left;
  margin: 15px 0.6em 0 -10px;
}
.series-info-sp2 h2 {
  color: #d03c3c;
  font-size: 1.1em;
  text-align: left;
  margin: 15px 0.6em 0  -10px;
}
.info-break {
  display: inline-block;
  margin-top: 5px; /* ←好みに応じて調整。4〜6pxくらいが自然 */
}
.series-box {
  border: 1px solid #ccc;
  background-color: #fdfdfd;
  padding: 15px 20px;
  margin: 24px auto 30px;
  font-size: 14px;
  color: #333;
  border-radius: 6px;
  text-align: center;
  max-width: 600px;
  box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.04);
  line-height: 1.7;
}
.series-box a {
  color: #c33;
  font-weight: bold;
  text-decoration: underline;
}
.series-box a:hover {
  text-decoration: none;
}
.series-box2 {
  border: 1px solid #ccc;
  background-color: #fdfdfd;
  padding: 15px 20px;
  margin: 14px auto 30px;
  font-size: 14px;
  color: #333;
  border-radius: 6px;
  text-align: center;
  max-width: 600px;
  line-height: 1.7;
  box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.04);
}
.series-box2 a {
  color: #c33;
  font-weight: bold;
  text-decoration: underline;
}
.series-box2 a:hover {
  text-decoration: none;
}

/* コンテナ：親幅に追随、上限だけ決める */
.dlbox-jacket{
  width: 100%;
  max-width: 180px;        /* 旧180pxをここへ移動 */
  margin: 0 auto 10px;     /* 中央寄せ＋下余白 */
  box-sizing: border-box;
}

/* クリック範囲＝画像サイズに */
.dlbox-jacket a{ display: block; }

/* 画像：親にフィット（重複プロパティを整理） */
.dlbox-jacket img{
  width: 100%;
  height: auto;
  display: block;
  border: 1px solid #ddd;
  border-radius: 6px;       /* ← 4pxと重複してたので6pxに統一 */
  box-shadow: 0 0 4px rgba(0,0,0,0.05);
  box-sizing: border-box;
}
/* アルバム紹介（画像・DL・アルバム名・説明・カテゴリー項目 */
.dlbox-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 15px;
  padding-top: 10px;
  gap: 0;
  background: #f7f9fc;
  border-radius: 8px;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.03);
}
.dlbox-left {/* アルバム紹介：左カラム */
  flex: 0 0 25%;              /* ← 親の幅の30%を確保 */
  box-sizing: border-box;     /* ← paddingを幅に含める */
  padding: 8px;               /* ← 幅30%の中に含まれる */
  margin-top: 10px;           /* ← 外側の余白なので30%には含まれない */
  display: flex;
  flex-direction: column;
  align-items: center;
}
/* アルバムダウンロード関連 -------------- */
.dlbox-buttons {
  width: 100%;           /* 親に追随 */
  max-width: 180px;      /* .dlbox-jacket と同じ上限幅 */
  margin-top: 0;
  box-sizing: border-box;
}
.dlbox-link-main {/* BOXサーバ カラム */
 margin-bottom:10px ;
}
.dlbox-link-main a {
  display: block;
  width: 100%;   /* ← 親幅に100%でフィット */
  text-align: center;
  padding: 3px 0;
  font-size: 13px;
  background-color: #ddd;
  border: 1px solid #ccc;
  border-radius: 4px;
  text-decoration: none;
  color: #000;
  transition: background-color 0.2s;
}
.dlbox-link-youtube a {
  display: block;
  width: 100%;   /* ← 親幅に100%でフィット */
  text-align: center;
  padding: 3px 0;
  background-color: #ddd;
  border: 1px solid #ccc;
  border-radius: 4px;
  text-decoration: none;
  color: #000;
  transition: background-color 0.2s;
  margin-top: 15px;
  font-size: 12px;
}
.dlbox-link-main a:hover,/* ★ ホバー追加 */
.dlbox-link-youtube a:hover {
  background-color: #ccc;
}
.zip-info {
  width: 95%;
  margin: 11px auto 4px auto;   /* ← 中央寄せ */
  display: flex;                /* ← 中のテキストを中央に配置 */
  justify-content: center;      /* ← 横方向中央 */
  align-items: center;          /* ← 縦方向中央 */
  font-size: 13px;
  color: #00497A;
  font-weight: 500;
  text-align: center;
  letter-spacing: 0.4px;
  padding: 4px 0;               /* ← 軽い上下余白で見出し感UP */
  box-sizing: border-box;
}
.dlbox-zip-row {/* ZIP カラム */
  display: flex;
  justify-content: space-between; /* 均等配置 */
  gap: 4px;                       /* ← ここで余白調整（4〜12px 好みで） */
  margin-top: 4px;                /* 上に少し余白を追加 */
}
.dlbox-zip {
  flex: 1;                        /* 均等幅で並ぶ */
  max-width: 86px;                /* 画像幅に合わせるなら制限 */
}
.dlbox-zip a {
  display: block;
  text-align: center;
  padding: 2px 0;
  font-size: 13px;
  background-color: #f0f0f0;
  border: 1px solid #ccc;
  border-radius: 4px;
  text-decoration: none;
  color: #000;
  transition: background-color 0.2s;
}
.dlbox-zip a:hover {
  background-color: #e0e0e0;
}
.dlbox-zip-row2 {/* 不使用の可能性あり */
  display: flex;
  justify-content: space-between; /* 均等配置 */
  gap: 4px;                       /* ← ここで余白調整（4〜12px 好みで） */
  margin-top: 5px;                /* 上に少し余白を追加 */
}

/* アルバム詳細 関連 -------------- */
.series-info {
  flex: 1 1 75%;
  font-size: 15px;
  color: #333;
  /* background-color: #3c2424;*/
  margin-bottom: 0;
  box-sizing: border-box;
}
.series-info-top {
  margin-bottom: 1em;
}
.series-info-top h2 {
  font-size: 17px;
  color: #c22;
  line-height: 0.6;
  margin: 20px 0 0 !important;
}
.series-description {/* アルバム説明 */
  width: 90%;               /* max-widthではなく幅を90%に固定 */
  margin: 0 auto 15px 7px;    /* 上0 / 右auto / 下20px / 左0 → 左寄せ */
  background-color: #f9f9f9;
  border-left: 6px solid #c06050;
  padding: 1px 20px 5px 13px;
  border-radius: 6px;
  box-shadow: 0 0 5px rgba(0,0,0,0.05);
  background-color: #FFF;
  font-size: 14px;
  line-height: 1.6;
}
.kakomi-songinfo-2 {/* アルバム詳細各事項 見出し */
  padding: 1px 6px;
  margin-right: 10px;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 0.5px;
  color: #0055A4;
  background-color: #EAF4FF;
  border: 1px solid #B3D7FF;
  border-radius: 4px;
  vertical-align: middle;
}
.detail-1 {
  width: 98%;
  font-size: 14px;
  color: #333;
  line-height: 2;
  margin: 0 0 6px 5px;
  word-break: keep-all;
  overflow-wrap: break-word;
}
.cp_link6 {
	display: inline-block;
	color: #FF3300;
	text-decoration: none;
	letter-spacing: 0.03em;
	margin-left: -4px;
	padding: 0 0.3em;
	transform: scale(1);
	transition: 0.3s;
}
.kakomi-songinfo-3 {
  display: inline-block;
  background: #dde4ed;
  color: #00497A;
  font-size: 12px;
  padding: 2px 6px;
  border-radius: 5px;
  margin-right: 8px;
  line-height: 1.4;
  white-space: nowrap;   /* ← ★これで改行禁止！ */
}
.kakomi-songinfo-3Long {
  display: inline-block;
  background: #dde4ed;
  color: #00497A;
  font-size: 12px;
  padding: 2px 6px;
  border-radius: 5px;
  margin-right: 8px;
  line-height: 1.4;
  white-space: nowrap;   /* ← ★これで改行禁止！ */
  position: relative;  /* ← 相対位置指定 */
  top: -9px;          /* ← ★ 上に10pxずらす */
}
.VariationNumb {
  display: inline-block;
  background: #dde4ed;
  color: #00497A;
  font-size: 12px;
  padding: 2px 6px;
  border-radius: 5px;
  margin-right: 8px;
  line-height: 1.2;
  white-space: nowrap;   /* ← ★これで改行禁止！ */
}
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}
.logout-button:hover {
  background-color: #c9302c;
}
.member-banner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #f5f1e9;   /* 落ち着いた背景色（後者優先） */
  color: #8b0000;             /* 強調色 */
  font-weight: bold;
  font-size: 14px;            /* 前者のサイズを引き継ぎ */
  padding: 4px 15px;          /* 中間的に最適化 */
  margin-bottom: 15px;             /* 上下のバランスを調整 */
  border: 1px solid #d3c5b0;  /* 枠線は後者優先 */
  border-radius: 4px;
}
.logout-button {
  background-color: #c83b27;
  color: #fff;
  padding: 3px 12px;
  text-decoration: none;
  border-radius: 3px;
  font-size: 0.9em;
}
.logout-button:hover {
  background-color: #a83020;
}
/* ページトップボタン（シック修正版） */
#backToTop {
  position: fixed !important;  /* ←確実にビューポート固定 */
  bottom: 25px !important;     /* ←位置明確に */
  right: 25px !important;
  left: auto !important;       /* ←念のため中央基準を解除 */
  top: auto !important;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: rgba(40, 40, 40, 0.55);
  backdrop-filter: blur(4px);
  color: #fff;
  font-size: 19px;
  line-height: 42px;
  text-align: center;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
  transition: background-color 0.25s ease, box-shadow 0.25s ease;
  display: none;
  z-index: 9999;
  margin: 0;                   /* ←中央寄せ抑止 */
  transform: none !important;  /* ←hover前のずれ補正を解除 */
}

/* ホバー時：ふわっと浮かせるが位置は動かさない */
#backToTop:hover {
  background: rgba(70, 70, 70, 0.8);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}
.kanren-notice {
  color: #B8860B;
	font-size: 13px;
  margin-left: 15px;
  vertical-align: bottom; /* ← これを追加 */
}