@charset "UTF-8";
/* Top画面スタイルシート */
iframe {
  width: 100%;
}

/* バナー */
#banner_background {
  background-color: #232323;
  padding-top: 8px;
  padding-bottom: 8px;
}

#main_visual {
  position: relative;
}

#slick_area {
  position: static;
}

#main_visual #prev {
  position: absolute;
  width: 53px;
  height: 100%;
  top: 0;
  left: calc(((100% - 840px) / 2) - 53px);
  text-align: left;
  cursor: pointer;
}

#main_visual #next {
  position: absolute;
  width: 53px;
  height: 100%;
  top: 0;
  left: calc(((100% - 840px) / 2) + 840px);
  text-align: right;
  cursor: pointer;
}

#main_visual div#next img, div#prev img {
  margin-top: calc(420px / 2 - 100% / 2);
}

#slick_area div img {
  width: 100%;
  max-width: 840px;
}

.slick_parts {
  opacity: 0.6;
  background: #000;
}

/* 楽曲検索ボックス上部背景 */
div#background_music_search_top {
  background: whitesmoke;
  border-top: 1px #e6e6e6 solid;
  border-bottom: 1px #e6e6e6 solid;
  text-align: center;
}

/* 楽曲検索ボックス上部 */
div#box_music_search_top {
  height: 53px;
  margin: 0 calc(50% - 490px) 0;
  padding-right: 14px;
  padding-left: 13px;
  line-height: 53px;
}

/* 楽曲検索対象 */
div#music_search_target {
  margin-left: 20px;
}
div#music_search_target select {
  height: 18px;
  width: 145px;
}

/* 楽曲検索方法 */
div#music_search_method {
  margin-left: 14px;
}
div#music_search_method select {
  height: 18px;
  width: 145px;
}

/* 楽曲検索キーワード */
div#music_search_keyword input {
  height: 26px;
  width: calc(100% - 16px);
  margin-left: 16px;
  padding: 0;
  border: 1px #cccccc solid;
  border-right: none;
}

/* 楽曲検索キーワード（回り込み） */
div.music_search_keyword_input_box {
  float: left;
  width: calc(100% - 515px);
}

/* 楽曲検索ボタン */
div#music_search_btn input {
  height: 28px;
  width: 80px;
  margin: 12.5px 0;
  border-style: none;
  cursor: pointer;
  background: url("/img/btn/btn_search.png") left top no-repeat;
}

/* 楽曲検索ボックス下部背景 */
div#background_music_search_bottom {
  margin-bottom: 15px;
  background: whitesmoke;
  border-bottom: 1px #e6e6e6 solid;
}

/* 楽曲検索ボックス下部 */
div#box_music_search_bottom {
  height: 48px;
  margin: 0 calc(50% - 360.5px) 0;
  line-height: 48px;
}

/* 楽曲検索区切り線 */
div#music_search_line {
  height: 28px;
  width: 0;
  margin: 10px 0 10px 10px;
  padding-right: 10px;
  border-left: 1px #e6e6e6 solid;
}

/* お気に入り登録済み楽曲ボタン */
img#btn_favorite_music_list {
  margin-left: 9px;
}

/* 楽曲情報ボックス */
div#box_music_info {
  margin: 0 calc(50% - 490px) 0;
}

/* 楽曲情報ボックス（楽曲情報ボックス左なしの時） */
div#box_music_info_none {
  margin: 0 calc(50% - 400px) 0;
}

/* 楽曲情報ボックス左 */
div#box_music_info_left {
  width: 336px;
  margin-right: 14px;
}

/* 楽曲情報ボックス左（回り込み） */
div.box_music_info_left_box {
  float: left;
}

/* 特集ボックス上部 */
div#box_campaign_top {
  height: 42px;
  line-height: 42px;
  padding-left: 13px;
  border: 1px #e6e6e6 solid;
}

/* 特集ボックス下部 */
div#box_campaign_bottom {
  padding: 14px 13px 24px;
  border: 1px #e6e6e6 solid;
  border-top: none;
}

/* 関連リンクボックス上部 */
div#box_link_top {
  height: 42px;
  line-height: 42px;
  margin-top: 14px;
  padding-left: 13px;
  border: 1px #e6e6e6 solid;
}

/* 関連リンクボックス下部 */
div#box_link_bottom {
  padding: 14px 13px 24px;
  border: 1px #e6e6e6 solid;
  border-top: none;
}

/* メンテナンス情報リンクボックス上部 */
div#box_maintenance_info_top {
  height: 42px;
  line-height: 42px;
  margin-top: 14px;
  padding-left: 13px;
  border: 1px #e6e6e6 solid;
}

/* メンテナンス情報ボックス下部 */
div#box_maintenance_info_bottom {
  padding: 14px 13px 24px;
  border: 1px #e6e6e6 solid;
  border-top: none;
}

/* 楽曲情報ボックス右 */
div#box_music_info_right {
  width: calc(100% - 336px - 14px);
}

/* 楽曲情報ボックス右（回り込み） */
div.box_music_info_right_box {
  float: right;
}

/* PickUp楽曲ボックス上部 */
div#box_pickup_top {
  height: 42px;
  line-height: 42px;
  padding-left: 13px;
  border: 1px #e6e6e6 solid;
}

/* PickUp楽曲ボックス下部 */
div#box_pickup_bottom {
  border: 1px #e6e6e6 solid;
  border-top: none;
  font-size: 0;
}

/* みんなの配信中楽曲＜カラオケ再生順＞ボックス下部 */
div#box_sp_music_bottom {
  border: 1px #e6e6e6 solid;
  border-top: none;
  font-size: 0;
  margin-bottom: 14px;
}

/* 楽曲のブロック */
div.pickup_music_block {
  margin: 14px 1.5%;
  width: 30.33333%;
  display: inline-block;
  vertical-align: top;
}

/* 楽曲のブロック（1行のみ表示用） */
div.pickup_music_block_line1 {
  margin: 0 1.5%;
  height: 0;
  width: 180px;
  display: inline-block;
  vertical-align: top;
}

/* 楽曲のブロックライン（3列表示用） */
div.pickup_music_block_line_row3 {
  border-bottom: 1px #e6e6e6 solid;
  margin: 0 1.5%;
  width: 97%;
  display: inline-block;
  vertical-align: top;
}

/* 楽曲のブロックライン（1列表示用） */
div.pickup_music_block_line_row1 {
  border-bottom: 1px #e6e6e6 solid;
  margin: 0 1.5%;
  width: 97%;
  display: none;
  vertical-align: top;
}

/* PickUp楽曲情報（3列表示用） */
div.box_pickup_music_info_row3 {
  width: 93%;
  width: -webkit-calc(100% - 5px * 2);
  width: calc(100% - 5px * 2);
  word-break: break-all;
  word-wrap: break-word;
  font-size: 12px;
  margin: 0 5px;
}

/* PickUp楽曲情報（1列表示用） */
div.box_pickup_music_info_row1 {
  width: 64%;
  word-break: break-all;
  word-wrap: break-word;
  font-size: 12px;
  margin: 0 5px;
  color: #000000;
  display: none;
}

/* サムネイル */
div.pickup_music_thumbnil {
  margin: 0 5px;
  position: relative;
  top: 0;
  left: 0;
  max-height: 135px;
  max-width: 180px;
}

/* サムネイル上アイコン */
div.thumbnil_icon {
  position: absolute;
  top: 0;
  left: 0;
  max-height: 135px;
  max-width: 180px;
}

/* 該当楽曲無し */
div.music_none {
  word-break: break-all;
  word-wrap: break-word;
  font-size: 14px;
  margin: 10px;
}

/* 各許諾元管理番号ボックス */
div#box_control_number {
  padding: 10px 0;
  background: whitesmoke;
  text-align: center;
  font-size: 0;
}
div#box_control_number ul {
  display: inline;
}
div#box_control_number li {
  display: inline-block;
  text-align: center;
  vertical-align: middle;
}

/* 許諾元ロゴ */
div.logo {
  display: inline-block;
  height: 50px;
  margin-right: 5px;
  vertical-align: middle;
}
div.logo img {
  height: 100%;
}

/* 許諾元管理番号 */
p.control_number {
  display: inline-block;
  line-height: 1em;
  vertical-align: middle;
  font-size: 13px;
}

/* JASRAC */
li#jasrac {
  margin-right: 20px;
}

/* JRC */
li#jrc {
  margin-right: 20px;
}

/* e-license */
li#e_license {
  line-height: 1em;
  font-size: 13px;
}

#list_link {
  text-align: right;
}

/* sp画面用みんなの配信中楽曲をもっとみる  */
#sp_search_delivery_music {
  width: 100%;
  height: 40px;
  text-align: center;
  margin: 10px 0;
}
#sp_search_delivery_music a div {
  width: 95%;
  height: 40px;
  background-color: #E22732;
  color: white;
  font-size: 11pt;
  line-height: 40px;
  text-align: center;
  display: inline-block;
  font-weight: 700;
}

/************************************************************************************/
/************************************************************************************/
/*-----------------------------------------------------------
	 画面サイズが1015px以下
		1.楽曲情報ボックス左右マージン変更
-----------------------------------------------------------*/
@media screen and (max-width: 1015px) {
  /*----*/
  /* 1. */
  /*----*/
  /* 楽曲情報ボックス */
  div#box_music_info {
    margin: 0 10px;
  }
}
/*-----------------------------------------------------------
	画面サイズが970px以下
		1.楽曲検索ボックス上部左側マージン削除
		2.バナー矢印非表示
-----------------------------------------------------------*/
@media screen and (max-width: 970px) {
  /*----*/
  /* 1. */
  /*----*/
  /* 楽曲検索ボックス上部 */
  div#box_music_search_top {
    margin: 0;
  }

  /*----*/
  /* 2. */
  /*----*/
  /* バナー次へ矢印 */
  #main_visual #next {
    display: none;
  }

  /* バナー前へ矢印 */
  #main_visual #prev {
    display: none;
  }
}
/*-----------------------------------------------------------
	画面サイズが900px以下
		1.PickUp楽曲3列 -> 1列（左ブロック有り）表示変更
-----------------------------------------------------------*/
@media screen and (max-width: 900px) {
  /*----*/
  /* 1. */
  /*----*/
  /* 楽曲のブロック */
  div.pickup_music_block {
    width: 100%;
    font-size: 0;
  }

  /* サムネイル */
  div.pickup_music_thumbnil {
    width: 30%;
    display: inline-block;
    vertical-align: top;
  }

  /* 楽曲のブロックライン（3列表示用） */
  div.pickup_music_block_line_row3 {
    display: none;
  }

  /* 楽曲のブロックライン（1列表示用） */
  div.pickup_music_block_line_row1 {
    display: inline-block;
  }

  /* PickUp楽曲情報（3列表示用） */
  div.box_pickup_music_info_row3 {
    display: none;
  }

  /* PickUp楽曲情報（1列表示用） */
  div.box_pickup_music_info_row1 {
    display: inline-block;
  }
}
/*-----------------------------------------------------------
	画面サイズが840px以下
		1.楽曲情報ボックス（楽曲情報ボックス左なしの時）の左右マージン変更
-----------------------------------------------------------*/
@media screen and (max-width: 840px) {
  /*----*/
  /* 1. */
  /*----*/
  /* 楽曲情報ボックス（楽曲情報ボックス左なしの時） */
  div#box_music_info_none {
    margin-left: 10px;
    margin-right: 10px;
  }
}
/*-----------------------------------------------------------
	画面サイズが768px以下
		1.楽曲検索ボックス上下部非表示
		2.PickUp楽曲1列（左ブロック下移動）表示変更
		3.楽曲情報ボックス（楽曲情報ボックス左なしの時）の上マージン変更
-----------------------------------------------------------*/
@media screen and (max-width: 768px) {
  /*----*/
  /* 1. */
  /*----*/
  /* 楽曲検索ボックス上部背景 */
  div#background_music_search_top {
    display: none;
  }

  /* 楽曲検索ボックス下部背景 */
  div#background_music_search_bottom {
    display: none;
  }

  /*----*/
  /* 2. */
  /*----*/
  /* 楽曲情報ボックス */
  div#box_music_info {
    margin: 15px 10px;
  }

  /* 楽曲情報ボックス左 */
  div#box_music_info_left {
    width: 100%;
    margin-top: 14px;
  }

  /* 楽曲情報ボックス左（回り込み） */
  div.box_music_info_left_box {
    float: none;
  }

  /* 楽曲情報ボックス右 */
  div#box_music_info_right {
    width: 100%;
  }

  /* 楽曲情報ボックス右（回り込み） */
  div.box_music_info_right_box {
    float: none;
  }

  /*----*/
  /* 3. */
  /*----*/
  /* 楽曲情報ボックス（楽曲情報ボックス左なしの時） */
  div#box_music_info_none {
    margin-top: 15px;
  }
}
/*-----------------------------------------------------------
	画面サイズが480px以下
		1.PickUp楽曲情報1列表示時の回り込み防止（-6%）
-----------------------------------------------------------*/
@media screen and (max-width: 480px) {
  /*----*/
  /* 1. */
  /*----*/
  /* PickUp楽曲情報（1列表示用） */
  div.box_pickup_music_info_row1 {
    width: 58%;
  }
}
/************************************************************************************/
/*-------------------------*/
/* Safari、Chromeにスタイル指定 */
/*-------------------------*/
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  /* 楽曲検索キーワード */
  div#music_search_keyword input {
    height: 28px;
  }
}
/* マウスオン */
/*----------------------*/
/* サムネイルをずらし影を付ける */
/*----------------------*/
div.pickup_music_thumbnil:hover {
  position: relative;
  top: -5px;
  left: -5px;
  box-shadow: 5px 5px 0 0 rgba(230, 230, 230, 0.7);
}
