@charset "UTF-8";
/* CSS Document */
@media screen and (max-width: 900px) {
  .pc {
    display: none !important;
  }
  .sp {
    display: block !important;
  }
  #contents {
    width: 95%;
    margin-bottom: 2.5em;
  }
}
/*SNSアイコンここから*/
.sns-icons {
  display: flex;
  gap: 10px; /* アイコン同士の間隔 */
  justify-content: center;
  align-items: center;
  list-style: none;
  margin: 27px 25px 0px 25px;
  padding: 0;
  background: #0a0a0a; /* 必要に応じて背景 */
  width: auto;
  float: left;
}
.sns-icons li {
  /* 余白なしで中央寄せ */
}
.sns-icons a {
  width: auto; /* アイコンサイズ（調整OK） */
  height: auto;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: box-shadow .2s;
}
.sns-icons img {
  width: 38px;
  height: 38px;
  object-fit: contain;
  display: block;
}
/*SNSアイコンここまで*/
/* ==================== スライダーここから ==================== */
#mainimg, .slider-area, .slider {
  width: 100%;
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
  position: relative;
}
#mainimg {
  margin: 20px auto;
  max-width: 100%;
}
.slider-area {
  width: 100vw;
  display: flex;
  justify-content: center;
  position: relative;
}
.slider {
  width: 100%;
  margin: 0 auto;
  max-width: 100%;
  position: relative;
  z-index: 0;
}
.slider .slick-slide {
  display: flex;
  align-items: center;
  justify-content: center;
	position: relative;
}
.slick-list {
  margin: 0 auto;
}
.slider img {
  height: 100%;
  /*width: auto;*/
  max-width: 98%;
  /*object-fit: contain;*/
  margin: 0 auto;
  width: 100%;
  object-fit: cover;       /* ← これで左右の黒帯が消える */	
}
.slider-item {
  position: relative;
}
/* BUY ボタンは最前面に */
.slider .slick-track {
  position: relative;
  z-index: 2;
}
/* スライド1枚分のフレーム。16:9 で高さを作る（SafariもOK） */
.slider .slick-slide > a,
.slider .slick-slide > div,
.slider .slider-item {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;   /* 古いブラウザなら下のfallbackを使う */
  overflow: hidden;
}

/* Fallback（aspect-ratio未対応ブラウザ用） */
@supports not (aspect-ratio: 16 / 9) {
  .slider .slick-slide > a,
  .slider .slick-slide > div,
  .slider .slider-item {
    height: 0;
    padding-top: 56.25%;   /* 16:9 */
  }
  .slider img{
    position: absolute;
    inset: 0;
  }
}

/* ===== slickドット（PC/スマホ共通）：中央配置 & CSS丸 ===== */
.slick-dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -40px;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  list-style: none;
  transform: none;
  z-index: 1;
}
.slick-dots li {
  margin: 0 6px;
  padding: 0;
}
.slick-dots li button {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #777; /* 非アクティブ色 */
  border: 0;
  padding: 0;
  cursor: pointer;
  font-size: 0;
  line-height: 0; /* フォントのズレ防止 */
  margin: 0 auto;
}
.slick-dots li button:before {
  content: none !important;
} /* デフォルトドット無効化 */
.slick-dots li.slick-active button {
  background: #bbb; /* アクティブ色 */
  opacity: .9;
}
/* スマホ時に少し下げたい場合 */
@media (max-width: 900px) {
  #mainimg {
    margin: 0px auto 20px;
  }
  .slider img {
    max-width: 100%;
  }
  .slick-dots {
    /*bottom: -24px;*/
  }
}
@media (max-width: 480px) {
  .slick-dots {
    bottom: -24px;
  }
}
/* ==================== スライダーここまで ==================== */
/*.buy-btnここから*/
/* BUY ボタンをドットより前面に */
.slider .buy-btn {
  z-index: 100; /* 以前の 2〜3 より高く */
  position: absolute; /* 念のため明示 */
}
.buy-btn {
  position: absolute;
  right: 3%;
  bottom: 3%;
  background: #1a4588;
  color: #fff;
  border: none;
  padding: 6px 18px;
  border-radius: 8px;
  font-size: 14px;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
  z-index: 3;
  transition: background 0.2s;
}
.buy-btn:hover {
  background: #254d9e;
}
.remodal .modal-content {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}
.remodal .modal-info {
  flex: 1;
}
.buy-links {
  margin-top: 16px;
}
.buy-main {
  display: inline-block;
  background: #c60;
  color: #fff;
  padding: 6px 16px;
  margin-bottom: 8px;
  border-radius: 5px;
  text-decoration: none;
  font-weight: bold;
}
.buy-other a {
  display: inline-block;
  background: #f5f5f5;
  color: #333;
  padding: 4px 10px;
  border-radius: 4px;
  text-decoration: none;
  margin-right: 5px;
  margin-bottom: 4px;
  font-size: 12px;
}
.buy-other a:hover {
  background: #e0e0e0;
}
/*.buy-btn*/
/*.buy-modal-links, .buy-modal-row, .buy-modal-btn-groupを徹底上書き*/
.buy-modal-links {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.buy-modal-row {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
/*.buy-btnここまで*/
/*モーダルここから*/
/* --------- モーダル全体 --------- */
/* --------- モーダル全体 --------- */
/* --------- モーダル全体 --------- */
.remodal.buy-modal {
  background: #fff;
  border-radius: 20px;
  max-width: 740px;
  padding: 2%;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.16);
  position: relative;
  font-size: 1.6rem;
}
/* BUYモーダル専用閉じるボタン */
.remodal.buy-modal .remodal-close {
  position: absolute;
  top: -5%; /* モーダル枠から外側に */
  right: -5%;
  left: auto; /* 念のため指定 */
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  z-index: 1000;
  cursor: pointer;
  transition: opacity .2s;
  /* 好みでborder追加もOK */
  color: #fff;
}
.remodal.buy-modal .remodal-close:before {
  font-size: 40px;
  text-align: center;
  /* 既存テーマのcontent（×）はそのまま */
}
.remodal.buy-modal .remodal-close:hover {
  opacity: 0.5;
}
/* スマホ対応 */
@media (max-width: 700px) {
	
	.slider .buy-btn {
	  bottom: 5%;
	}
	
  .remodal.buy-modal .remodal-close {
    top: 2%;
    right: 2%;
    font-size: 28px;
    color: #1a1a1a;
  }
}
/* ---- ジャケ＋タイトルエリア（箱） ---- */
.buy-modal-head {
  display: flex;
  align-items: center;
  /*gap: 30px;*/ /* ジャケ写とタイトル間の余白（必要なら調整） */
  margin-bottom: 18px;
  border-radius: 10px;
  padding: 18px 0px;
}
.buy-modal-jacket{
	width: 30%;
}
.buy-modal-jacket img {
	/*width: 200px;*/
	/*height: 200px;*/
	height: auto;
	object-fit: cover;
	border: 1px solid #ddd;        /* 薄いグレーの線 */
	box-shadow: 0 2px 4px rgba(0,0,0,0.12); /* 控えめのドロップシャドウ */
}
/* タイトル情報は左揃え＆縦並び */
.buy-modal-meta {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	/*padding-left: 30px;*/
	padding-left: 3%;
	box-sizing: content-box;
	width: 70%;
}
.buy-modal-artist {
	font-size: 16px;
	color: #b89c63;
	font-weight: bold;
	margin-bottom: .25em;
	text-align: left;
}
.buy-modal-title {
	/*font-size: 22px;*/
	font-size: 20px;
	font-weight: bold;
	margin-bottom: .5em;
	color: #1a1a1a;
	text-align: left;
	line-height: 1.6;
}
.buy-modal-date {
	font-size: 13px;
	color: #444;
	text-align: left;
}
/* ---- BUY/DOWNLOAD/STREAMINGセクション ---- */
.buy-modal-section {
  margin-bottom: 22px;
}
.buy-modal-label {
  font-weight: bold;
  font-size: 18px;
  margin-bottom: 8px;
  color: #222;
  text-align: left;
  font-family: 'Metal Mania', cursive;
  margin-left: 1%;
}
.buy-label {
  color: #186fd3;
}
.download-label {
  color: #b3341b;
}
.streaming-label {
  color: #3bb589;
}
.buy-modal-btn-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.buy-modal-btn {
  background: #f5f5f5;
  color: #222;
  border-radius: 7px;
  border: 1px solid #e4e4e4;
  padding: 0;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  min-width: 110px;
  text-align: center;
  transition: background .18s, box-shadow .18s;
  box-sizing: border-box;
  width: 23%;
  height: 48px; /* ← 高さ統一 */
  margin: 0 1% 2% 1%;
  display: flex;
  align-items: center; /* ← 画像を上下中央寄せ */
  justify-content: center;
}
.buy-modal-btn img {
  max-height: 26px; /* ← ボタン内で揃う高さに */
  width: auto;
  display: block;
  margin: 0 auto;
}
.buy-modal-btn.king {
  background: #b3341b;
  color: #fff;
  border: none;
  margin: 0 1% 2%;
  display: flex;
}
.buy-modal-btn.king:hover {
  background: #9d2d18;
}
.buy-modal-btn:hover {
  background: #eaeaea;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
/* DOWNLOAD 内のボタン画像だけ調整 */
.buy-modal-section .download-label + .buy-modal-btn-group .buy-modal-btn img {
  max-height: 36px;
  width: auto;
}
/* STREAMING 部分の1,4,6つ目を黒背景に */
.buy-modal-section .streaming-label + .buy-modal-btn-group .buy-modal-btn:nth-child(1), .buy-modal-section .streaming-label + .buy-modal-btn-group .buy-modal-btn:nth-child(4), .buy-modal-section .streaming-label + .buy-modal-btn-group .buy-modal-btn:nth-child(6) {
  background-color: #000; /* 黒背景 */
}
@media (max-width: 700px) {
  .remodal.buy-modal {
    padding: .5em;
    max-width: 95vw;
    margin-bottom: 0;
    border-radius: 10px;
  }
  .buy-modal-head {
    /*flex-direction: column;
    align-items: flex-start;*/
    /*gap: 8px;*/
    /*padding: 8px 6px;*/
    padding: 10px 0px;
    flex-direction: column;
  }
  .buy-modal-jacket {
    width: 70%;
    margin: 0 auto;
    margin-bottom: 1em;
  }
  .buy-modal-jacket img {
    width: 100%;
    height: auto;
  }
  .buy-modal-meta {
    padding-left: 0%;
    width: 100%;
  }
  .buy-modal-title {
    font-size: 18px;
  }
  .buy-modal-btn {
    padding: 7px 10px;
    min-width: 48%;
    font-size: 13px;
  }
}
/*モーダルここまで*/
/*モーダルここまで*/
/*モーダルここまで*/
/*NEW RELEASEここから*/
#main {
  width: 100%;
  float: none;
}
#side {
  display: none;
}
#main.top .list {
  background: none;
}
#main.top .list li {
  position: relative;
}
/* slick が幅を管理するので “a の固定幅” は外しておく */
#main.top .list li a {
  width: auto;
  height: 310px;
  position: relative;
  display: block;
  padding-bottom: 50px;
  border-right: 1px solid #787878;
}
#main.top .list {
  border: 1px solid #787878;
}
#main.top .top_in .more a {}
#main.top .list li .release_date {
  color: #999;
}
#main.top .list li h3, #main.top .list li a {
  color: #fff;
}
#main.top .list li .jacket {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1; /* 正方形に固定 */
  overflow: hidden;
  background: #080808;
  height: auto;
}
#main.top .list li .jacket img {
  position: absolute;
  top: 0; /* 上から揃える */
  left: 50%;
  transform: translateX(-50%); /* 中央寄せ（横方向） */
  width: 100%; /* 横幅はジャケット幅いっぱい */
  height: auto; /* 縦は自動 */
}
#main.top .list li .buy-btn {
  position: absolute;
  right: 6%;
  bottom: 4%;
  background: #1a4588;
  color: #fff;
  border: none;
  padding: 4px 12px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .2);
  z-index: 2;
}
#main.top .list li .buy-btn:hover {
  background: #254d9e;
}
/* 既存 PC 用はそのまま */
@media (max-width: 900px) {
  #main.top .list li a {
    border: 1px solid #787878; /* 全部に枠を付ける */
    border-right: none; /* 右線は消す → 隣が左線を持つので二重防止 */
    height: 0;
    padding-bottom: 180%;
  }
  /* 2列目（右カラム）だけ右線を復活させる */
  #main.top .list li:nth-child(even) a {
    /*border-right: 1px solid #787878;*/
  }
}
/*NEW RELEASEここまで*/
/*PLAYLISTここから*/
.head_title.playlist_ttl span {
  color: #0e6cd5;
}
#main.top .media-grid.top_in {
  margin-bottom: 0em;
}
/* グリッド：gap値を変数で定義（右の gap と同じに） */
.media-grid {
  display: grid;
  grid-template-columns: 510px 1fr;
  gap: 2rem;
  --media-vgap: 2rem; /* ← 右の .media-right の gap と同じ値 */
  align-items: stretch;
}
/* 左を“行高−gap”に合わせる */
.media-left {
  display: flex;
}
.media-left .playlist {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%; /* 行高にフィットさせるのを明示 */
}
.playlist-wrap {
  flex: 1; /* ← 残り高さを全部ここに割り当て */
  min-height: 0; /* 高さ計算の保険 */
}
/* ← ここがポイント。右の gap と同じ分だけ差し引く */
.playlist-wrap iframe {
  width: 100%;
  height: calc(100% - var(--media-vgap));
  border: 0;
}
/* 右は今のままでOK（gapは2remのまま） */
.media-right {
  display: flex;
  flex-direction: column;
  gap: var(--media-vgap); /* ここも同じ変数を使って同期 */
}
/*Youtubeここから*/
.video-wrap {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 の比率 */
  height: 0;
  overflow: hidden;
}
.video-wrap iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
/*Youtubeここまで*/
/* モバイルでは縦並びにして通常の高さに戻す */
@media (max-width: 900px) {
  .media-grid {
    grid-template-columns: 1fr;
  }
  .playlist-wrap {
    height: auto; /* 自動 */
  }
  .playlist-wrap iframe {
    height: 450px; /* 使っていた標準高さに戻す（お好みで調整可） */
  }
}
/*PLAYLIST MOVIEここまで*/
/* NEWSエリアここから */
/* ===== NEWS（崩れ修正＆横2枚）===== */
/* slick の中身をフレックス化して高さ合わせ */
.news .list .slick-list, .news .list .slick-track {
  height: auto !important;
}
.news .list .slick-track {
  display: flex !important;
}
/* 各スライドを 50% 幅に（slick の inline 幅より優先） */
.news .list .slick-slide {
  width: 50% !important;
  float: none;
}
/* li 自体の見た目 */
.news .list li {
  box-sizing: border-box;
  padding: 16px 20px;
  border-right: 1px solid #787878;
}
.news .list li:nth-child(2n) {
  border-right: none;
} /* 右端は線ナシ */
/* ★ 共通ルールの上書き：NEWS の a だけ高さ固定を解除 */
#main.top .news .list li a {
  display: grid;
  grid-template-columns: 160px 1fr; /* 画像 / テキスト */
  column-gap: 16px;
  align-items: start;
  height: auto; /* ← 310px を無効化 */
  padding: 0; /* ← 余計な下パディングを無効化 */
  border-right: 0; /* ← 右線は li 側で管理 */
  position: relative; /* 日付の絶対配置に使う */
  min-height: 120px; /* 見栄え用（お好みで） */
}
/* サムネ左、固定幅 */
#main.top .news .list li .photo {
  grid-column: 1;
  width: 160px;
  flex: 0 0 160px;
}
#main.top .news .list li .photo img {
  display: block;
  width: 100%;
  height: auto;
}
/* テキストは右カラムに */
#main.top .news .list li .text {
  grid-column: 2;
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: #fff;
}
/* 日付は右下に固定 */
#main.top .news .list li .day {
  position: absolute;
  right: 0;
  bottom: 0;
  font-size: 12px;
  color: #aaa;
  margin-bottom: 0;
}
/* スマホは縦1枚に */
@media (max-width: 850px) {
  .news .list .slick-slide {
    width: 100% !important;
  }
  #main.top .news .list li {
    padding: 1em;
  }
  #main.top .news .list li a {
    /*grid-template-columns: 40% 1fr;*/
    border: none;
    display: block;
    height: 0;
    padding-bottom: 50%;
  }
  #main.top .news .list li .photo {
    width: auto;
    height: 0;
    padding-bottom: 53.33%;
  }
  #main.top .news .list li .text {
    padding-bottom: 2em;
  }
}
/* NEWSエリアここまで*/
/*footer SNSここから*/
#footer .sns-icons li:after {
  content: "";
  margin: 0 0px;
}
#footer ul.sns-icons {
  margin: 0em 0;
}
@media (max-width:900px) {
  #footer {
    padding-top: 0;
  }
  #footer ul.sns-icons {
    margin: 0 auto;
    margin-bottom: 2em;
    width: 100%;
  }
}
/*footer SNSここまで**/
/*LIVEここから*/
.head_title.live_ttl span {
  color: #b97807;
}
.live .live-list {
  list-style: none;
  margin: 0;
  padding: 0;
  border: 1px solid #787878;
}
.live .live-list > li {
  margin: 0;
  border-bottom: 1px solid #787878;
}
.live .live-list > li:last-child {
  border-bottom: none;
}
/* aタグをクリック領域に */
.live .live-list > li > a {
  display: block;
  padding: 22px 24px;
  color: #fff;
  text-decoration: none;
  height: auto; /* 固定高さを解除 */
  border-right: 0; /* NEWS用の右ボーダーを無効化 */
}
/* 上段：日付＋会場を横並び */
.live .live-list .meta {
  display: flex; /* ← 横並びにする */
  gap: 22px; /* 日付と会場の間隔 */
  margin-bottom: 10px; /* 下段との余白 */
}
.live .live-list .day, .live .live-list .place {
  font-size: 16px;
  line-height: 1.7;
  color: #cfcfcf;
  white-space: nowrap; /* 折り返し防止（長い時は調整して） */
}
/* 下段：アーティスト＋タイトル */
.live .live-list .artist, .live .live-list .title {
  display: inline-block;
  /*font-size: 22px;*/
	font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
  color: #fff;
}
.live .live-list .artist {
  /*margin-right: 32px;*/
	margin-right: 1em;
    margin-bottom: .2em;
}
/* hover効果 */
.live .live-list > li > a:hover .artist, .live .live-list > li > a:hover .title {
  text-shadow: 0 0 8px rgba(255, 255, 255, .06);
}
/* レスポンシブ：狭い時は縦積み */
@media (max-width:900px) {
  .live .live-list > li > a {
    padding: 14px 16px;
  }
  .live .live-list .meta {
    flex-direction: column; /* ← 縦並びに切り替え */
    gap: 4px;
    margin-bottom: 8px;
  }
  .live .live-list .day, .live .live-list .place {
    font-size: 14px;
  }
  .live .live-list .artist, .live .live-list .title {
    display: block;
    /*font-size: 20px;*/
	  font-size: 16px;
    margin: 6px 0 0 0;
  }
}
/*LIVEここまで*/
/* ====== ハンバーガーここから ====== */
/* ===== ハンバーガー（外の三本線） ===== */
.nav-toggle {
  position: absolute;
  right: 14px;
  top: 14px;
  width: 36px;
  height: 36px;
  display: none;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 0;
  cursor: pointer;
  z-index: 1100; /* ドロワーより上 */
}
.nav-toggle__bar, .nav-toggle__bar::before, .nav-toggle__bar::after {
  content: "";
  display: block;
  width: 22px;
  height: 2px;
  background: #fff;
  position: relative;
  transition: .25s;
}
.nav-toggle__bar::before {
  position: absolute;
  top: -6px;
  left: 0;
}
.nav-toggle__bar::after {
  position: absolute;
  top: 6px;
  left: 0;
}
/* === PC/SPの基準を固定 === */
#navi {
  display: block;
}
.nav-toggle {
  display: none;
}
/* SP時のみ表示。ハンバーガーは開いても非表示にしない */
/* SP発火点は900pxで統一 */
@media (max-width: 900px) {
  #navi {
    display: none;
  }
  .nav-toggle {
    display: flex;
    position: fixed;
    right: 14px;
    top: 14px;
  }
}
/* 念のための“戻し”（別CSSの干渉に勝つ用） */
@media (min-width: 901px) {
  #navi {
    display: block !important;
  }
  .nav-toggle {
    display: none !important;
  }
}
/* 開いた時、三本線 → × に変形 */
.nav-toggle.is-open .nav-toggle__bar {
  background: transparent;
}
.nav-toggle.is-open .nav-toggle__bar::before {
  top: 0;
  transform: rotate(45deg);
}
.nav-toggle.is-open .nav-toggle__bar::after {
  top: 0;
  transform: rotate(-45deg);
}
/* ===== SPドロワー ===== */
.sp-drawer {
  position: fixed;
  inset: 0;
  background: #0b0b0b;
  transform: translateX(100%);
  transition: transform .28s ease;
  z-index: 1090;
  color: #fff;
  overflow: auto;
}
.sp-drawer.is-open {
  transform: translateX(0);
}
body.no-scroll {
  overflow: hidden;
}
/* 内側の×は使わないので非表示 */
.sp-drawer__close {
  display: none !important;
}
/* 中身 */
.sp-drawer__inner {
  max-width: 320px;
  margin: 0 auto;
  padding: 18px 20px 36px;
  text-align: center;
}
.sp-drawer__logo img {
  height: 32px;
  margin: 8px auto 20px;
}
/* メインリンク */
.sp-drawer__links {
  list-style: none;
  margin: 8px 0 24px;
  padding: 0;
}
.sp-drawer__links li + li {
  margin-top: 18px;
}
.sp-drawer__links a {
  display: block;
  font-family: "Metal Mania", cursive, sans-serif;
  font-size: 28px;
  letter-spacing: .04em;
  text-decoration: none;
  color: #fff;
  padding: .2em 0;
}
/* SNS */
.sp-drawer__sns {
  display: flex;
  justify-content: center;
  gap: 18px;
  margin: 8px 0 20px;
  padding: 0;
  list-style: none;
}
.sp-drawer__sns img {
  width: 38px;
  height: 38px;
  display: block;
}
/* SP 検索フォームの並びを横並びに */
.sp-drawer__search {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 6px auto 0;
  max-width: 260px;
}
/* テキスト入力 */
.sp-drawer__search .sp-search-input input {
  flex: 1;
  height: 35px;
  border-radius: 6px;
  border: 1px solid #333;
  /*background:#111;*/ color: #fff;
  padding: 0 10px;
  font-size: 14px;
}
/* 送信（PCと同じアイコン画像を使用） */
.sp-drawer__search .sp-search-submit .feas-submit-button {
  background: #000 url(images/icon_serach.png) no-repeat center;
  background-size: 16px;
  width: 40px;
  height: 35px;
  border: 1px solid #222;
  border-radius: 0;
  cursor: pointer;
  -webkit-appearance: none;
}
/* ====== ハンバーガーここまで ====== */
/*RELEASE singleページ ここから*/
.list .list_in .jacket {
  height: 0;
  padding-bottom: 100%;
}
.archive .list .list_in a {
  height: auto;
}
#contents .release .btn-area .buy-btn{
	position: static;
	margin: 0em 0 1em;
}
.archive .list li {
}
.archive .list .list_in a{
    position: relative;
    padding-bottom: 5em;
}
/*RELEASE singleページ ここまで*/
/*RELEASE 一覧ページ ここから*/
.archive .four_box .list .list_in .jacket{
	height: 0;
}
.archive.release .four_box .list .list_in a {
    height: auto;
    position: relative;
    padding-bottom: 5em;
}

/*RELEASE 一覧ページ ここまで*/

/*WP用追加ここから*/

/*NEWS*/

#main.top .news .list > li {
  width: 50%;
}

/* NEWS タイトル 2行で … */
#main.top .news .list .title-clamp{
  display: -webkit-box;
  -webkit-line-clamp: 2;      /* 表示行数 */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/*トップスライダー ここから*/
/* ========== トップスライダーを全幅で表示 ========== */
#mainimg {
  position: relative;
  width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  max-width: none !important;
  overflow: hidden;
  z-index: 1;
}

.slick-dotted.slick-slider{
	margin-bottom: 5em;
}

/* slickのローディング背景を無効化（404対策含む） */
.slick-loading .slick-list { background: none !important; }

.remodal.buy-modal [data-section="buy"] { display:block; }

/* ないサービスは薄く＆押せない */
.buy-modal-btn.is-off { opacity:.35; pointer-events:none; }

/*トップスライダー ここまで*/

/*リリースページ ここから*/
/* リリースページ：メインのジャケだけ無効、RELATION は有効にしたい */

/*.single-release .js-buy-detail {
  pointer-events: none;
  cursor: default;
}*/

/*リリースページ ここまで*/

/*関連商品 ここから*/
.release_in.four_box .list .list_in,
.relation.sub_entry.archive .list .list_in  {
    position: relative;
}
.release_in.four_box .list .list_in .buy-btn,
.relation.sub_entry.archive .list .list_in .buy-btn {
    position: absolute;
    right: 4%;
}
/*関連商品 ここまで*/

/*.movie ここから*/
.movie .list .list_in .jacket {
	padding-bottom: 0;
}
.movie .list .list_in a{
	padding-bottom: 0;
}
/*.movie ここまで*/

/*KINGS-ROCK TV ここから*/
#specialindex{
	max-width: 100% !important;
}
#specialindex .bg-bk .txt-about{
	max-width: 730px;
	display: block !important;
}
#contents-area > section.bg-red > h3 + p{
	max-width: 730px;
	display: block;
}
#specialindex .bg-red ul.balloon{
	max-width: 730px;
	margin: 0 auto;
}
/*KINGS-ROCK TV ここまで*/

/*ulma_AXCLUSION ここから*/
#contents > div > section > div.btn-area > p.eshop{
display: block;
}
/*ulma_AXCLUSION ここまで*/

/*WP用追加ここまで*/

/* ↓↓↓ レスポンシブ対応  ↓↓↓ */
@media screen and (max-width:1260px) {}
@media screen and (max-width:1120px) {}
@media screen and (max-width:1023px) {}
@media screen and (max-width:960px) {}
@media screen and (max-width:900px) {}
@media screen and (max-width:850px) {}
@media screen and (max-width:735px) {}
@media screen and (max-width:667px) {}
@media screen and (max-width:567px) {}
@media screen and (max-width:414px) {}
@media screen and (max-width:375px) {}
@media screen and (max-width:320px) {}
@media screen and (max-device-width:1366px) {}
@media screen and (max-device-width:768px) {}
@media screen and (max-device-width:414px) {}