@charset "utf-8";

/** --------------------------------------------------------------------------------
 * html body
 */
html {
  overflow-y: scroll;
}

body {
  line-height: 1.5;
  color: #343330;
  /* background-color: #fffae4; */
  background-color: #fff5ee;
  font-size: small;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
}

blockquote {
	color: #808080;
  font-weight: bold;
}

cite,
cite a {
  color: #ff69b4;
  font-size: 12px;
  font-style: normal;
}

cite a:hover {
  opacity: 0.7;
}


/** --------------------------------------------------------------------------------
 * ハイパーテキスト
 */
a {
  color: #343330;
  outline: none;
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;
}

a:link,
a:visited,
a:hover,
a:active {
  text-decoration: none;
}

a:hover,
a:active {
  color: #ff69b4;
}

a img {
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

a:hover img {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

/** --------------------------------------------------------------------------------
 * フォント
 */
@font-face {
  font-family: utIcon;
  src:url('/fonts/utIcon.eot');
  src:url('/fonts/utIcon.eot?#iefix') format('embedded-opentype'),
    url('/fonts/utIcon.woff') format('woff'),
    url('/fonts/utIcon.ttf') format('truetype'),
    url('/fonts/utIcon.svg#utIcon') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: smileIcon;
  src:url('/fonts/smileIcon.eot?');
  src:url('/fonts/smileIcon.eot?#iefix') format('embedded-opentype'),
    url('/fonts/smileIcon.woff?') format('woff'),
    url('/fonts/smileIcon.ttf?') format('truetype'),
    url('/fonts/smileIcon.svg?#smileIcon') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: idolIcon;
  src:url('/fonts/idolIcon.eot');
  src:url('/fonts/idolIcon.eot?#iefix') format('embedded-opentype'),
    url('/fonts/idolIcon.woff') format('woff'),
    url('/fonts/idolIcon.ttf') format('truetype'),
    url('/fonts/idolIcon.svg#idolIcon') format('svg');
  font-weight: normal;
  font-style: normal;
}

/** --------------------------------------------------------------------------------
 * $header
 */
header {
  padding: 8px 0 6px;
  border-bottom: 3px solid #ff69b4;
  background-color: #fff;
  line-height: 1.0;
  height: 42px;
}

.header__inner {
  margin: 0 auto;
  width: 1040px;
}

.header__inner:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.header__inner * {
  float: left;
  display: block;
}

header a {
  text-decoration: none !important;
}

header .headerLogo {
  margin-top: 9px;
  margin-right: 15px;
  width: 145px;
}

header .headerLogo img {
  width: 100%;
}

/** ------------------------------
 * グローバルナビ
 */
.globalNav {
  margin-top: 8px;
  font-weight: bold;
  font-size: 14px;
}

.globalNav__item a:before {
  font-family: utIcon;
}

.globalNav__item a {
  margin: 0 2px;
  padding: 5px 12px;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  position: relative;
  -webkit-transition: all 0.3s ease;
     -moz-transition: all 0.3s ease;
      -ms-transition: all 0.3s ease;
       -o-transition: all 0.3s ease;
          transition: all 0.3s ease;
}

.globalNav__item a:before {
  margin-top: -2px;
  padding-right: 2px;
  display: inline-block;
  vertical-align: middle;
  font-size: 15px;
  font-weight: normal;
}

.globalNav__item--top a:before {
  content: "\e602";
}

.globalNav__item--search a:before {
  content: "\e630";
}

.globalNav__item--ranking a:before {
  content: "\e691";
}

.globalNav__item--sp a:before {
  content: "\e600";
}

.globalNav__item--keyword a:before {
  content: "\e64a";
}

.globalNav__item--news a:before {
  content: "\e605";
}

.globalNav__item--mypage a:before {
  content: "\e634";
}

.globalNav__item--idol a:before {
  font-family: idolIcon;
  content: "\e900";
}

.globalNav__item--current a {
  color: #fff !important;
  background-color: #ff69b4;
}

.globalNav__item--mypage {
  position: relative;
  z-index: 60;
}

/** ------------------------------
 * マイメニュー
 */
.myMenu {
  margin: 0 auto;
  width: 1080px;
  position: relative;
  z-index: 50;
  display: none;
}

.myMenu > div {
  padding: 3px;
  border: 1px solid #ddd;
  position: absolute;
  top: 8px;
  right: 0;
  width: 380px;
  background-color: #eee;
  font-size: 0;
  -webkit-box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
     -moz-box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
          box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

.myMenu ul {
  padding: 10px 5px;
  border: 1px solid #e6e6e6;
  background-color: #fff;
}

.myMenu ul:before {
  border-width: 15px 10px;
  border-style: solid;
  border-color: transparent transparent #eee transparent;
  position: absolute;
  top: -30px;
  right: 180px;
  z-index: 10;
  content: "";
  display: block;
}

.myMenu ul:after {
  border-width: 17px 12px 16px;
  border-style: solid;
  border-color: transparent transparent #d6d6d6 transparent;
  position: absolute;
  top: -33px;
  right: 178px;
  z-index: 8;
  content: "";
  display: block;
}

.myMenu__item {
  position: relative;
  display: inline-block;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  width: 33.33%;
  font-size: 13px;
  vertical-align: middle;
  text-align: center;
}

.myMenu__item:before {
  margin: auto;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  content: "";
  display: block;
  height: 74%;
  width: 1px;
  background-color: #ddd;
}

.myMenu__item--right:before {
  display: none;
}

.myMenu__item:after {
  margin: auto;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  content: "";
  display: block;
  width: 74%;
  height: 1px;
  background-color: #ddd;
}

.myMenu__item--bottom:after {
  display: none;
}

.myMenu__item a {
  padding: 25px 3px;
  display: block;
  text-decoration: none;
}

.myMenu__item a:before {
  margin: 0 auto 7px;
  display: block;
  vertical-align: middle;
  font-size: 34px;
  font-weight: normal;
  font-family: utIcon;
  text-align: center;
}

.myMenu__item--lyricHistory a:before {
  content: "\e65a";
  /*
  content: "\e6aa";
  */
}

.myMenu__item--newsHistory a:before {
  content: "\e6ab";
}

.myMenu__item--spHistory a:before {
  content: "\e622";
}

.myMenu__item--search a:before {
  content: "\e630";
}

.myMenu__item--sp a:before {
  content: "\e600";
}

.myMenu__item--ranking a:before {
  content: "\e691";
}

.myMenu__item--keyword a:before {
  content: "\e64a";
}

.myMenu__item--news a:before {
  content: "\e605";
}

.myMenu__item--request a:before {
  content: "\e620";
}

.myMenu__item--favourite a:before {
  content: "\e604";
}

.myMenu__overlay {
  position: fixed;
  z-index: 7;
  top: 0px;
  left: 0px;
  height:100%;
  width:100%;
  background: transparent;
}

/** ------------------------------
 * SNSナビ
 */
.shareLink {
  float: right;
}

.shareLink--left {
  float: left;
}

.snsNav {
  margin-top: 2px;
  float: left;
  font-size: 43px;
  vertical-align: top;
}

.snsNav__item {
  margin-left: 5px;
  margin-bottom: 2px;
  width: 43px;
  height: 45px;
  overflow: hidden;
}

.snsNav__item a {
  position: relative;
  padding-left: 55px;
  display: block;
  /*
  color: #fff;
  */
  text-decoration: none !important;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.snsNav__item a:before {
  position: absolute;
  top: 2px;
  left: 0;
  font-family: utIcon;
  display: block;
  line-height: 42px;
}

.snsNav__item a:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

.snsNav__item--twitter a:before {
  content: "\e692";
  color: #55acee;
}

.snsNav__item--facebook a:before {
  content: "\e694";
  color: #3b5998;
}

.snsNav__item--googleplus a:before {
  content: "\e693";
  color: #d84937;
}

/* LINEアイコン
.snsNav__item--line a:before {
  content: "\e695";
  color: #00c300;
}
*/

.snsNav__item--youtube a:before {
  content: "\e6ae";
  color: #cc181e;
}

.snsNav__item--share a:before {
  content: "\e6ad";
  color: #ee7b00;
}

.snsNav__item--favourite a:before {
  top: 1px;
  border: 1px solid #eebe00;
  -webkit-border-radius: 7px;
          border-radius: 7px;
  content: "\e604";
  display: inline-block;
  color: #fff;
  width: 43px;
  height: 43px;
  color: #eebe00;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 60%;
  text-align: center;
}

.snsNav__item--favourite a.favourite--on:before {
  color: #fff;
  background-color: #eebe00;
}

/** ------------------------------------------------------------
 * TOP
 */

/** ------------------------------
 * billboard
 */
.billboard {
  background-color: #f6cece;
}

.billboard__inner {
  margin: 0 auto;
  padding: 10px 0;
  width: 1040px;
}

.billboard__inner:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

/* バナー */
.billboardBanner {
  margin-bottom: 10px;
  text-align: center;
}

.billboardBanner a {
  display: inline-block;
}

/* スライド */
.billboardSlide {
  border: 1px solid #ddd;
  padding: 10px 41px 0;
  float: left;
  width: 426px;
  min-height: 271px;
  background-color: #fff;
}

.billboardSlide--video {
  margin-left: -2px;
  padding-bottom: 10px;
  min-height: 180px;
}

.billboardSlide__title {
  margin-top: 8px;
}

/* JS関連 */
.bx-prev,
.bx-next {
  margin: auto;
  padding: 0;
  border: 1px solid #ddd;
  position: absolute;
  top: 0;
  bottom: 0;
  display: block;
  width: 20px;
  height: 110px;
  color: #fff !important;
  text-decoration: none !important;
  background-color: #ff69b4;
  cursor: pointer;
  font-size: 0;
  line-height: 0;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.bx-prev:hover,
.bx-next:hover {
  background-color: #f1278c;
}

.bx-prev:before,
.bx-next:before {
  margin: auto;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  font-family: utIcon;
  display: block;
  width: 24px;
  height: 24px;
  line-height: 1.0;
  font-size: 24px;
  text-indent: -4px;
}

.bx-prev {
  left: -43px;
}

.bx-next {
  right: -42px;
}

.bx-prev:before {
  content: "\e69a";
}

.bx-next:before {
  content: "\e69d";
}

/* 新着歌詞 */
.billboardNewest {
  border: 1px solid #ddd;
  position: relative;
  float: right;
  width: 498px;
  background-color: #fff;
}

.billboardNewest__title {
  margin: 5px 1px 1px;
  padding: 0 19px;
  position: relative;
  line-height: 44px;
  background-color: #eee;
  font-size: 131%;
}

.billboardNewest__title:before {
  content: "";
  display: block;
  position: absolute;
  top: -4px;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #ff69b4;
}

.billboardNewest__more {
  position: absolute;
  top: 20px;
  right: 19px;
  line-height: 1.0;
}

.billboardNewest__more a {
  padding: 1px 8px 1px 13px;
  display: block-inline;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  color: #fff;
  background-color: #343330;
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.billboardNewest__more a:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

.billboardNewest__more a:after {
  font-family: utIcon;
  content: "\e699";
  vertical-align: bottom;
}

.billboardNewestList__item {
  padding: 10px 20px 8px;
}

.billboardNewestList__item:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.billboardNewestList__item + .billboardNewestList__item {
  border-top: 1px solid #eee;
}

.billboardNewestList__title {
  display: block;
  font-size: 93%;
  font-weight: bold;
  overflow: hidden;/* overflowの値にvisible以外のものを指定 */
  text-overflow: ellipsis;/* テキストが表示領域からはみ出た場合、末尾に省略符号「…」を表示 */
  white-space: nowrap;/* 自動改行しない */
}

.billboardNewestList__name,
.billboardNewestList__date {
  font-size: 85%;
}

.billboardNewestList__name {
  float: left;
}

.billboardNewestList__name a {
  color: #ff69b4;
}

.billboardNewestList__date {
  margin-left: 10px;
  float: right;
  color: #888;
}

/* 検索 */
.billboardSearch {
  clear: both;
  background-color: #ff69b4;
}

.billboardSearch__inner {
  margin: 0 auto;
  padding: 10px 0;
  width: 1040px;
  text-align: center;
}

.billboardSearch__inputArea {
  margin: 0 auto;
  padding: 4px;
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  width: 710px;
  background-color: #fff;
}

.billboardSearch__inputArea:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.billboardSearch__inputArea input[type="text"],
.billboardSearch__inputArea button {
  margin: 0;
  padding: 0;
  border: none;
  float: left;
  line-height: 1.7;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  background-color: transparent;
  font-size: 15px;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  outline: none;
}

/* プルダウン装飾JS用 */
.easy-select-box {
  float: left;
  position: relative;
  width: 152px !important;
  color: #ff69b4;
  background-color: #fffdf4;
  font-size: 14px;
  text-align: left;
}

.easy-select-box .esb-displayer {
  padding: 0 27px 0 3px;
  height: 27px;
  line-height: 27px;
  text-indent: 5px;
  cursor: pointer;
}

.easy-select-box .esb-displayer:after {
  margin: auto;
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  right: 3px;
  color: #ff69b4;
  height: 26px;
  font-size: 26px;
  font-family: utIcon;
  content: "\e697";
}

.easy-select-box .esb-displayer:hover {
  filter: alpha(opacity=80);
  -ms-filter: 'alpha(opacity=80)';
  opacity: 0.8;
}

.easy-select-box:hover .esb-displayer {
  text-decoration:none;
}

.easy-select-box.disabled .esb-displayer,
.easy-select-box:hover.disabled .esb-displayer {
  background-position: 0 -36px;
}

.easy-select-box .esb-dropdown {
  border: 1px solid #ddd;
  overflow: auto;
  position: absolute;
  z-index: 999;
  display: none;
  width: 145px !important;
  max-height: 200px;
  background-color: #fff;
}

.easy-select-box .esb-item {
  padding: 3px 6px;
  background-color: #fffdf4;
  cursor: pointer;
}

.easy-select-box .esb-item:hover {
  color: #fff;
  background-color: #ff69b4;
  text-decoration: none;
}

.billboardSearch input[type="text"] {
  margin-right: 15px;
  width: 550px;
}

.billboardSearch button {
  -webkit-border-radius: 2px;
     -moz-border-radius: 2px;
          border-radius: 2px;
  width: 145px;
  color: #fff;
  background-color: #343330;
  text-align: center;
  cursor: pointer;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.billboardSearch button:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

.billboardSearch button:before {
  margin-right: 5px;
  font-family: utIcon;
  content: "\e630";
}

/** ------------------------------------------------------------
 * container
 */
#container {
  margin: 0 auto;
  padding: 16px 0;
  position: relative;
  width: 1040px;
}

#container:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

/** ------------------------------------------------------------
 * contents
 */
#contents {
  float: left;
  width: 710px;
}

/** ------------------------------
 * contentBox
 */
.contentBox {
  margin-bottom: 15px;
  border: 1px solid #ddd;
  clear: both;
  position: relative;
  background-color: #fff;
}

.contentBox--half {
  margin-bottom: 0;
  border: none;
  padding: 1px;
  position: relative;
  z-index: 5;
  clear: none;
  float: left;
  width: 348px;
  background-color: transparent;
}

.contentBox--half + .contentBox--half {
  float: right;
}

.halfBoxWrapper {
  margin-bottom: 15px;
  position: relative;
}

.halfBoxWrapper:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.halfBoxWrapper__inner:before,
.halfBoxWrapper__inner:after {
  position: absolute;
  border: 1px solid #ddd;
  top: 0;
  bottom: 0;
  z-index: 1;
  content: "";
  display: block;
  width: 348px;
  background-color: #fff;
}

.halfBoxWrapper__inner:before{
  left: 0;
}

.halfBoxWrapper__inner:after{
  right: 0;
}

.contentBox__title {
  margin: 5px 1px 1px;
  padding: 10px 9px;
  border-bottom: 1px solid #ddd;
  position: relative;
  color: #ff69b4;/* 基本色 */
  font-size: 131%;
}

/* オススメ歌詞 */
.contentBox__title--recommend {
  padding-right: 120px;
}

.contentBox__titleSub {
  display: block;
  font-size: 13px;
  color: #343330;
  line-height: 1.2;
}

.contentBox__title a {
  color: #ff69b4;
}

.contentBox__title a:before {
  margin-right: -0.2em;
  content: "\e690";
  color: #ccc;
  font-size: 12px;
  font-family: utIcon;
  vertical-align: middle;
}

.contentBox__title--lyricTitle,
.contentBox__title--article {
  padding: 15px 17px 13px 19px;
  color: #343330;
  background-color: #f6f6f6;
  font-size: 160%;
}

.contentBox__title--lyricTitle {
  padding-right: 78px;
  position: relative;
}

.contentBox__title--article {
  font-size: 193%;
}

.contentBox__title--lyricTitle:after,
.contentBox__title--article:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: #fff;
}

.contentBox__title:before {
  content: "";
  display: block;
  position: absolute;
  top: -4px;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #ff69b4;/* 基本色 */
}

/* タイアップ情報 */
.lyricTieup {
  color: #888;
  font-size: 14px;
  vertical-align: middle;
}

.lyricTieup:before {
  margin-right: 0.8em;
  content: "―";
  font-size: 10px;
}

/* サブタイトル */
.contentBox__subTitle {
  padding: 0.6em 10px;
  border-bottom: 1px solid #ddd;
  position: relative;
  color: #ff69b4;
  font-size: 116%;
}

.contentBox__subTitle--line {
  border-top: 1px solid #ddd;
}

/* もっと見る */
.contentBox__more {
  position: absolute;
  top: 20px;
  right: 9px;
  line-height: 1.0;
}

.contentBox__subTitle + .contentBox__more {
  margin-top: -2.1em;
  top: auto;
}

.contentBox__more a {
  padding: 1px 8px 1px 13px;
  display: block-inline;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  color: #fff;
  background-color: #343330;
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.contentBox__more a:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

.contentBox__more a:after {
  font-family: utIcon;
  content: "\e699";
  vertical-align: bottom;
}

.contentBox__footerMore {
  border-top: 1px solid #ddd;
  padding: 10px 9px;
  text-align: right;
}

.contentBox__footerMore a {
  padding: 1px 8px 1px 13px;
  display: block-inline;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  color: #fff;
  background-color: #343330;
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.contentBox__footerMore a:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

.contentBox__footerMore a:after {
  font-family: utIcon;
  content: "\e699";
  vertical-align: bottom;
}

/* 赤紫 */
.contentBox__title--keyword {
  border-bottom: none;
  color: #ab538b;
}
.contentBox__title--keyword:before,
.contentBox__more--keyword a {
  background-color: #ab538b;
}

/* スミレ */
.contentBox__title--news {
  color: #7f5ed4;
}
.contentBox__title--news:before,
.contentBox__more--news a {
  background-color: #7f5ed4;
}

/* 黄緑 */
.contentBox__title--recentPopular {
  color: #72c331;
}
.contentBox__title--recentPopular:before,
.contentBox__more--recentPopular a {
  background-color: #72c331;
}

/* 黄緑 */
.contentBox__title--pickup {
  color: #31c3ad;
}
.contentBox__title--pickup:before {
  background-color: #31c3ad;
}

/* 紅 */
.contentBox__title--special {
  color: #d0475a;
}
.contentBox__title--special:before,
.contentBox__more--special a {
  background-color: #d0475a;
}

/* ツイート */
.contentBox__title--tweet {
  color: #55acee;
}
.contentBox__title--tweet:before {
  background-color: #55acee;
}

/* 内容 */
.contentBox__body {
  margin: 1px;
}

.contentBox__body--text {
  font-size: 109%;
}

/** ------------------------------
 *記事関連
 */
.articleGenreAndType {
  background-color: #f2f2f0;
  padding: 4px 8px;
  border-bottom: 1px solid #ddd;
}

.articleGenreAndType a {
  color: #ff69b4;
  margin-left: 8px;
}

.articleGenreAndType a:hover {
  opacity: 0.6;
}

.articleOverview {
  padding: 15px;
}

.articleOverview img {
  margin: 0 auto;
  display: block;
  max-width: 100%;
}

.articleOverview .articleOverview__description {
  margin-top: 4px;
  color: #555452;
  font-size: 15px;
  line-height: 1.5;
  word-break: break-all;
}

.articleOverview__date {
  text-align: right;
  padding-right: 4px;
  color: #bbb;
}

.articleOverview__writer:after {
  content: "";
  display: block;
  clear: both;
}

.articleOverview__writer__articleSub {
  float: left;
  color: #bbb;
  margin-right: 6px;
}

.articleOverview__writer__writerPerson {
  float: left;
}

.articleOverview__writer__writerPerson a {
  color: #272672;
}

.articleInfo {
  padding: 5px 0 0px 19px;
  border-bottom: 1px solid #ddd;
}

.articleInfo:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.bodyImageList {
  display: table;
  table-layout: fixed;
  width: 100%;
  border-collapse: separate;
  border-spacing: 4px;
}

.bodyImageList__item {
  display: table-cell;
  vertical-align: middle;
  border: 1px solid #ddd;
}

.bodyImageList__item--empty {
  border: none;
}

.bodyImageList__item a {
  display: block;
  width: 100%;
  height: 100%;
}

.bodyImageList__item img {
  width: 100%;
}

/** ------------------------------
 *日付
 */
.articleInfo__date {
  float: left;
  color: #888;
  line-height: 4;
}

.contentBox__voteTime {
  padding: 20px 10px;
  text-align: center;
}

/** ------------------------------
 * shareLink
 */
.contentBox .shareLink {/* ページ項目内の場合 */
  padding: 3px 12px 5px 0;
  line-height: 1.0;
}

.contentBox .shareLink:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.shareLink__item {
  padding: 5px 5px;
  float: left;
}

.shareLink__item .twitter-share-button {
  width: 105px !important;
}

/* 記事の下にある場合 */
.wideShareLink {
  margin-right: 1px;
}

.wideShareLink .shareLink {
  padding: 1px 0 0;
  border-top: 1px solid #ddd;
  clear: both;
  float: none;
  display: table;
  table-layout: fixed;
  width: 100%;
  text-align: center;
}

.wideShareLink .snsNav {
  margin: 0;
  padding: 0;
  float: none;
  display: table-cell;
  width: 100%;
  position: relative;
}

.wideShareLink .shareLink div + div {
  border-left: 1px solid #fff;
}

.wideShareLink .shareLink .snsNav__item {
  margin: 0;
  width: auto;
  height: auto;
}

.wideShareLink .shareLink a {
  padding: 10px 0 10px 0;
  display: block;
  color: #fff;
  background-color: #ccc;
  font-size: 12px;
  text-decoration: none;
}

.wideShareLink .snsNav__item--twitter a {
  background-color: #55acee;
}

.wideShareLink .snsNav__item--facebook a {
  background-color: #3b5998;
}

.wideShareLink .snsNav__item--googleplus a {
  background-color: #d84937;
}

.wideShareLink .snsNav__item--youtube a {
  background-color: #cc181e;
}

.wideShareLink .snsNav__item--share a {
  background-color: #ff69b4;
}

.wideShareLink .shareLink a:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

.wideShareLink .snsNav__item a:before {
  margin: 0 auto 4px;
  width: 24px;
  position: static;
  color: #fff !important;
  font-size: 24px;
  line-height: 1.2;
}

.wideShareLink .snsNav__item--twitter a:before {
  content: "\e6a9";
}

.wideShareLink .snsNav__item--facebook a:before {
  content: "\e6a8";
}

.wideShareLink .snsNav__item--googleplus a:before {
  content: "\e6a7";
}

.wideShareLink .snsNav__item--youtube a:before {
  content: "\e647";
}

.wideShareLink .snsNav__item--share a:before {
  content: "\e61b";
}

/* 記事 */
.article__body {
  padding: 25px 20px;
  color: #555452;
  font-size: 15px;
  line-height: 1.5;
}

.article__body a {
  color: #ff69b4;
}

.article__body img {
  max-width: 100%;
}

.article__body img.center {
  display: block;
  margin: 0 auto;
}

.article__body img.floatRight {
  float: right;
  margin-left: 2em;
  margin-bottom: 2em;
  margin-top: 2em;
}

.article__body img.floatLeft {
  float: left;
  margin-right: 2em;
  margin-bottom: 2em;
  margin-top: 2em;
}

.article__body hr+br,
.article__body .lyricCard+br {
  display: none;
}

.article__body .openTrunkBody {
  text-align: right;
}

.article__body .trunkBody {
  display: none;
}

.article__date {
  text-align: right;
  padding-right: 4px;
  color: #bbb;
}

.article__body h2 {
  margin: 7px 0;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.5em;
  border-bottom: 2px solid #ff69b4;
}

.article__body h3 {
  margin: 5px 0;
  font-size: 18px;
  font-weight: bold;
  line-height: 1.5em;
  padding-left: 3px;
  border-left: 3px solid #ff69b4;
}

.article__body__pagerNext {
  margin-top: 16px;
  text-align: center;
}

.article__body__pagerNext a {
  background-color: #ff69b4;
  color: #fff;
  display: inline-block;
  padding: 10px;
  width: 600px;
  -webkit-border-radius: 100px;
     -moz-border-radius: 100px;
          border-radius: 100px;
}

.article__body__pagerNext a:hover {
  opacity: 0.6;
}

.article__body__pager {
  margin-top: 8px;
  margin-bottom: 1px;
  padding: 10px;
  text-align: center;
}

.article__body__pager__item,
.article__body__pager__item a {
  display: inline-block;
}

.article__body__pager__item--current {
  background-color: #eee;
}

.article__body__pager__item a:hover {
  border-color: #ff69b4;
}

.article__body__pager__item--current,
.article__body__pager__item a {
  padding: 4px 12px;
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}

.article__body__pager__item a {
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.article__body__pager__item--prev a,
.article__body__pager__item--next a {
  color: #ff69b4;/* 基本色 */
}

.article__body__pager__item--prev a:before {
  margin-right: 5px;
  font-family: utIcon;
  content: "\e63c";
  vertical-align: middle;
}

.article__body__pager__item--next a:after {
  margin-left: 5px;
  font-family: utIcon;
  content: "\e63d";
  vertical-align: middle;
}

/* 特集記事内 */
.article__body cite
{
  color: #808080;
}

.ut-int
{
  color: maroon;
}

.ut-photocap
{
  color: gray;
  font-size: x-small;
}

.ut-red
{
  color: red;
  font-weight: bold;
}

.ut-blue
{
  color:blue;
  font-weight: bold;
}

.ut-yellow
{
  color: #ffd900;
  font-weight: bold;
}

.ut-green
{
  color: green;
  font-weight: bold;
}

.ut-pink
{
  color: #FFA8B8;
  font-weight: bold;
}

.ut-deep-pink
{
  color: #ff33dd;
  font-weight: bold;
}

.ut-light-blue
{
  color: #00FFFF;
  font-weight: bold;
}

.ut-purple
{
  color: purple;
  font-weight: bold;
}


/* 目次 */
.article__index {
  margin: 20px;
  padding: 20px 25px;
  font-size: 14px;
  background-color: #FCFCFC;
  border: 1px solid #CCC;
}

.article__index a {
  color: #ff69b4;
}

.article__index a:hover {
  opacity: 0.6;
}

.article__index--title {
  font-weight: bold;
  font-size: 16px;
  text-align: center;
}

.article__index--h2 {
}

.article__index--h3 {
  padding-left: 2em;
}

.article__pager {
  padding: 10px 15px;
  position: relative;
  font-size: 14px;
  height: 30px;
}

.article__pager__item {
  vertical-align: middle;
}

.article__pager__item a {
  display: inline-block;
  color: #ff69b4;
  width: 300px;
  padding: 4px 5px;
  text-align: center;
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}

.article__pager__item a:hover {
  border-color: #ff69b4;
}

.article__pager__item--prev {
  float: left;
}

.article__pager__item--prev a:before {
  margin-right: 5px;
  font-family: utIcon;
  content: "\e63c";
  vertical-align: middle;
}

.article__pager__item--next {
  float: right;
}

.article__pager__item--next a:after {
  margin-left: 5px;
  font-family: utIcon;
  content: "\e63d";
  vertical-align: middle;
}


.youtube {
  padding-bottom: 56.25%;
  position: relative;
  height: 0;
  overflow: hidden;
}

.youtube iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

.abematv {
  padding-bottom: 56.25%;
  position: relative;
  height: 0;
  overflow: hidden;
}

.abematv iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

a.abematvlink {
  display: none;
}

.article__mainImage {
  text-align: center;
  margin: -24px -20px 25px;
}

.article__mainImage img {
  max-width: 100%;
}

.lyricCard ,
.lyricCard a {
  color: #000;
  display: table;
  table-layout: fixed;
  width: 100%;
  direction: rtl;
  unicode-bidi: embed;
}

.lyricCard {
  margin: 8px 0;
  border: 1px solid #ccc;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}

.lyricCard a:hover {
  color: #ff69b4;
}

.lyricCard .text,
.lyricCard .image {
  padding: 10px;
  display: table-cell;
  direction: ltr;
  vertical-align: top;
}

.lyricCard .text {
  padding-left: 0;
  line-height: 1.2;
}

.lyricCard .text .title {
  font-weight: bold;
}

.lyricCard .text .artist {
  font-size: 90%;
  line-height: 1.6;
  margin-bottom: 8px;
}

.lyricCard .text .line {
  font-size: 80%;
  line-height: 1.6;
}

.lyricCard .image {
  width: 100px;
  text-decoration: none;
}

.lyricCard .image img {
  width: 100%;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}

.lyricCard + br {
  display: none;
}

/* 戻るリンク */
.contentBox__backLink {
  margin-top: 10px;
  padding-top: 1px;
  border-top: 1px solid #ddd;
  position: relative;
  text-align: center;
}

.contentBox__backLink a {
  padding: 10px 19px;
  display: block;
  background-color: #f6f6f6;
  font-size: large;
  text-decoration: none;
}

.contentBox__backLink a:before {
  margin: auto;
  position: absolute;
  top: 0;
  right: 12px;
  bottom: 0;
  font-family: utIcon;
  content: "\e6a1";
  width: 26px;
  height: 26px;
  font-size: 26px;
  line-height: 1.0;
  vertical-align: middle;
}

/* リンク */
.contentBox__buttonLink {
  padding-top: 1px;
  border-top: 1px solid #ddd;
  clear: both;
  display: table;
  table-layout: fixed;
  width: 100%;
  text-align: center;
}

.contentBox__buttonLink > div {
  display: table-cell;
  position: relative;
}

.contentBox__buttonLink div + div {
  border-left: 1px solid #fff;
}

.contentBox__buttonLink a {
  padding: 10px 19px;
  display: block;
  color: #fff;
  background-color: #42e2a7;
  font-size: 15px;
  text-decoration: none;
}

.contentBox__buttonLink div + div a {
  background-color: #a1dc3c;
}

.contentBox__buttonLink a:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

.contentBox__buttonLink a:before {
  font-family: utIcon;
  content: "\e684";
  width: 20px;
  height: 20px;
  font-size: 20px;
  line-height: 1.0;
  vertical-align: middle;
}

.contentBox__buttonLink div + div a:before {
  content: "\e691";
}

/** ------------------------------
 * 歌詞詳細
 */
.lyricData {
  padding: 10px;
  border-bottom: 1px solid #ddd;
  position: relative;
}

.lyricBody + .lyricData {
  border-top: 1px solid #ddd;
  border-bottom: none;
}

.lyricBody + .lyricData .lyricData__sub {
  height: auto;
}

.lyricBody + .lyricData .lyricData__main {
  margin-right: 0;
  width: 570px;
}

.lyricData:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.lyricData__sub {
  float: left;
  width: 100px;
  min-height: 100px;
}

.lyricData__sub img {
  width: 100%;
}

.lyricData__main {
  margin-right: 160px;
  float: right;
  width: 410px;
}

.lyricData .shareLink {
  position: absolute;
  top: 7px;
  right: 0;
  line-height: 1.0;
  width: 144px;
}

/* 楽曲制作 */
.lyricWork {
  margin-bottom: 5px;
  border-bottom: 1px solid #eee;
}

.lyricWork__title,
.lyricWork__body {
  margin-bottom: 3px;
}

.lyricWork__title {
  margin-right: 10px;
  float: left;
  font-weight: bold;
}

.lyricWork__body {
  color: #888;
  word-break: break-all;
  overflow: hidden;
}

/* アフィリンク */
.lyricLink:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.lyricLink__item {
  margin-right: 5px;
  float: left;
}

.youtubeLink {
  margin: 0 20px 10px 10px;
  float: right;
  font-size: 15px;
}

.youtubeLink a {
  padding: 4px 15px 4px 10px;
  display: block-inline;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  color: #fff;
  background-color: #ff69b4;
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.youtubeLink a:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

.youtubeLink a:before {
  margin-top: -1px;
  padding-right: 6px;
  font-size: 120%;
  display: inline-block;
  vertical-align: middle;
  font-family: utIcon;
  content: "\e61d";
}

/*
.lyricLink__button {
  padding: 0 15px;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  display: inline-block;
  color: #fff !important;
  background-color: #ff69b4;
  text-decoration: none !important;
  line-height: 26px;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.lyricLink__button:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

.lyricLink__button--iTunes:before {
  margin-right: 3px;
  font-family: utIcon;
  content: "\e61b";
  vertical-align: middle;
}

.lyricLink__button--youtube:before {
  margin-right: 3px;
  font-family: utIcon;
  content: "\e647";
  vertical-align: middle;
}
*/

/* カテゴリ */
.lyricCategory {
  margin-bottom: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid #eee;
}

.lyricCategory__title  {
  margin-right: 10px;
  float: left;
  font-weight: bold;
}

.lyricCategory__body {
  color: #888;
  overflow: hidden;
}

.lyricCategory__body a {
  color: #ff69b4;
}

/* キーワード */
.lyricKeyword {
  padding-top: 10px;
  clear: both;
}

.lyricKeyword__inner {
  padding-top: 10px;
  border-top: 1px solid #eee;
  list-style-type: none;
}

.lyricKeyword__item {
  margin-right: 5px;
  display: inline-block;
}

.lyricKeyword__item a {
  color: #ff69b4;
}

/* 歌詞フォント */
.lyricFont {
  margin: 15px 10px 10px 10px;
  padding: 3px;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  background-color: #eee;
  float: right;
}

.lyricFont__size {
  padding: 8px 10px;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  float: left;
  background-color: #fff;
}

.lyricFont__size + .lyricFont__size {
  margin-left: 3px;
}

.lyricFont__title {
  margin-bottom: 5px;
  padding: 2px 0;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  color: #fff;
  background-color: #343330;
  font-size: 85%;
  text-align: center;
}

.lyricFont input[type="button"] {
  padding: 3px 10px;
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  background-color: #f6f6f6;
  cursor: pointer;
}

.lyricFont input[disabled="disabled"] {
  border-color: #ff69b4;
  color: #ff69b4;
  background-color: #fff;
}

/* 歌詞 */
.lyricBody {
  margin: 25px 20px 5px;
}

/* 歌詞お楽しみ */
.hopeVote {
  margin: 30px;
}

.hopeVote__message {
  padding-bottom: 20px;
  line-height: 1.8;
  font-size: medium;
  text-align: center;
}

.hopeVote__message span {
  display: inline-block;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%,rgba(255,242,0,0)), color-stop(60%,rgba(255,242,0,1)), color-stop(100%,rgba(255,255,0,1)));
  background: -webkit-linear-gradient(top, rgba(255,242,0,0) 59%,rgba(255,242,0,1) 60%,rgba(255,255,0,1) 100%);
  background:    -moz-linear-gradient(top, rgba(255,242,0,0) 59%, rgba(255,242,0,1) 60%, rgba(255,255,0,1) 100%);
  background:     -ms-linear-gradient(top, rgba(255,242,0,0) 59%,rgba(255,242,0,1) 60%,rgba(255,255,0,1) 100%);
  background:      -o-linear-gradient(top, rgba(255,242,0,0) 59%,rgba(255,242,0,1) 60%,rgba(255,255,0,1) 100%);
  background:         linear-gradient(to bottom, rgba(255,242,0,0) 59%,rgba(255,242,0,1) 60%,rgba(255,255,0,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00fff200', endColorstr='#ffff00',GradientType=0 );
}

.hopeVote__balloon {
  margin-bottom: 20px;
  padding: 30px 10px;
  border: 1px solid #e6e6e6;
  position: relative;
  color: #ff69b4;
  background-color: #fff;
  font-size: 120%;
  text-align: center;
}

.hopeVote__balloon:before {
  margin-left: -20px;
  border-width: 15px 10px;
  border-style: solid;
  border-color: #fff transparent transparent transparent;
  position: absolute;
  bottom: -30px;
  left: 50%;
  z-index: 10;
  content: "";
  display: block;
}

.hopeVote__balloon:after {
  margin-left: -21px;
  border-width: 16px 11px;
  border-style: solid;
  border-color: #d6d6d6 transparent transparent transparent;
  position: absolute;
  bottom: -32px;
  left: 50%;
  z-index: 8;
  content: "";
  display: block;
}

.rankingList {
  border-top: 1px solid #ddd;
}

.balloon + .rankingList {
  border-top: 1px solid #ddd !important;
}

.hopeVoteButton {
  text-align: center;
}

.hopeVoteButton button {
  margin: 0;
  padding: 10px 0;
  border: none;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  width: 50%;
  color: #fff;
  line-height: 25px;
  background-color: #ff69b4;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  cursor: pointer;
  font-size: large;
  outline: none;
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;
}

.hopeVoteButton button:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

/* tweet */
.tweetBox {
  padding-bottom: 10px;
  border-bottom: 1px solid #ddd;
}

.tweetBox:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

/*
.tweetBox:before {
  margin-right: 10px;
  float: left;
  display: block;
  width: 100px;
  height: 100px;
  color: #fff;
  background-color: #55acee;
  font-family: utIcon;
  font-size: 60px;
  content: "\e6a9";
  line-height: 100px;
  overflow: hidden;
  text-align: center;
}
  */

.tweetBox__label {
  padding: 4px 10px;
  font-size: 18px;
  background-color: #55acee;
  color: #fff;
}

.tweetBox__input {
  display: table;
  width: 100%;
}

.tweetBox__input div {
  cursor: pointer;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  height: 4em;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  font-size: 17px;
  color: #55acee;
}

.tweetBox__input div.selected {
  color: #555;
  background-color: #fffe66;
}

.tweetBox__button {
  text-align: center;
  margin: 10px 0 0;
}

.tweetBox__input input[type="text"] {
  margin: 0 10px;
  padding: 4px 6px;
  border: 1px solid #ddd;
  -webkit-border-radius: 2px;
     -moz-border-radius: 2px;
          border-radius: 2px;
  width: 80px;
  line-height: 1.7;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  background-color: transparent;
  font-size: 15px;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  outline: none;
  text-align: center;
}

.tweetBox__button input[type="button"] {
  margin: 0 0 0 10px;
  padding: 0 25px;
  -webkit-border-radius: 2px;
     -moz-border-radius: 2px;
          border-radius: 2px;
  border: none;
  line-height: 2;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  color: #fff;
  background-color: #55acee;
  font-size: medium;
  text-align: center;
  cursor: pointer;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
}

.tweetBox__button input[type="button"]:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

.lyricBody__row {
  margin: 10px 0;
  padding-left: 3.2em;
  position: relative;
}

.lyricBody__row + .lyricBody__row {
  padding-top: 10px;
  border-top: 1px dotted #ddd;
}

.lyricBody__number {
  padding: 0 0.2em;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  position: absolute;
  left: 0;
  display: block;
  min-width: 2em;
  color: #fff;
  background-color: #55acee;
  text-align: center;
}

.lyricLineNum {
  cursor: pointer;
}

.lyricLineNum:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

/* 関連リンク */
.relatedLink {
  margin-top: 20px;
  padding: 17px 20px 15px;
  border-top: 1px solid #ddd;
}

.relatedLink__title {
  margin: 0 0 12px;
  border-bottom: 2px solid #ff69b4;
  color: #ff69b4;
  font-size: medium;
  font-weight: bold;
}

.relatedLink__body {
  padding-left: 1em;
  line-height: 1.8;
}

.relatedLink__body--lyric a {
  color: #ff69b4;
}

.relatedLink__body--lyric a.box {
  padding: 4px 6px;
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  display: inline-block;
  background-color: #fff;
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.relatedLink__body--lyric a.box:hover {
  border-color: #ff69b4;
}

.relatedLink__item a {
  padding-left: 20px;
  color: #555452;
  position: relative;
  -webkit-transition: all 0.3s ease;
     -moz-transition: all 0.3s ease;
      -ms-transition: all 0.3s ease;
       -o-transition: all 0.3s ease;
          transition: all 0.3s ease;
  text-decoration: none;
}

.relatedLink__item a:before {
  position: absolute;
  top: 0.1em;
  left: 0;
  font-family: utIcon;
  font-size: 12px;
  content: "\e683";
  display: block;
  width: 12px;
  height: 12px;
}

.relatedLink__item a:hover {
  color: #ff69b4;
}

/* アルバム詳細 */
.albumDetail {
  margin-top: 0;
  padding: 17px 20px 15px;
  border-top: 1px solid #ddd;
}

.albumDetail__title {
  margin: 0 0 12px;
  border-bottom: 2px solid #ff69b4;
  color: #ff69b4;
  font-size: medium;
  font-weight: bold;
}

.albumDetail__body img {
  margin: 0 15px 10px 0;
  float: left;
  max-width: 160px;
}

/* アーティスト情報 */
.artistInfo__profile__name {
  padding-top: 8px;
  margin-top: 8px;
  border-top: 1px solid #ddd;
  margin-bottom: 4px;
  font-size: medium;
  font-weight: bold;
}

.artistInfo__profile__image {
  text-align: center;
  margin-bottom: 8px;
}

.artistInfo__profile__image img {
  max-width: 600px;
}

.artistInfo__latest__title {
  padding-top: 8px;
  margin-top: 8px;
  border-top: 1px solid #ddd;
  margin-bottom: 4px;
  font-size: medium;
  font-weight: bold;
}

/* 投票 */
.gauge {
  margin: 15px 10px 10px;
}

.gauge:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.gauge__button button {
  margin: 0;
  padding: 36px 0 0;
  border: 1px solid #e6e6e6;
  position: relative;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  width: 65px;
  line-height: 2.1;
  color: #bbb;
  background-color: #fff;
  font-size: 15px;
  vertical-align: top;
  cursor: pointer;
  outline: none;
}

.gauge__button .voted {
  border-color: #fff59d;
  color: #ff69b4;
  background-color: #fff59d;
}

.gauge__button .mostVoted {
  border-color: #ff69b4;
  color: #ff69b4;
}

.gauge__button button:before {
  margin-left: -0.5em;
  position: absolute;
  top: 8px;
  left: 50%;
  font-family: smileIcon;
  content: "\e6b4";
  font-size: 32px;
  line-height: 1.1;
}

.gauge__button button.kandoBtn:before {
  content: "\e6b1";
}

.gauge__button button.rennaiBtn:before {
  content: "\e6b0";
}

.gauge__button button.gennkiBtn:before {
  content: "\e602";
}

.gauge__button button.openVoteResult:before {
  top: 6px;
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  background-image: url("/images/pc/pie.png");
  background-repeat: no-repeat;
}

.gauge__button .openVoteResult {
  border-color: #50cc33;
  color: #fff;
  background-color: #50cc33;
}

/*
.gauge__button .favourite {
  padding-top: 1px;
  line-height: 1.7;
  color: #ff69b4;
  font-size: 300%;
}

.gauge__button .favourite:before {
  display: none;
}

.gauge__button .favourite {
  border-color: #ff69b4;
}

.gauge__button .favourite--on {
  color: #fff;
  background-color: #ff69b4;
}
*/

/** ------------------------------
 * 基本の一覧
 */
.list__item,
.list__item > a {
  display: table;
  table-layout: fixed;
  width: 100%;
  direction: rtl;
  unicode-bidi: embed;
}

.list__item + .list__item {
  border-top: 1px solid #ddd;
}

.list__item > a {
  text-decoration: none;
}

.list__main,
.list__sub {
  padding: 10px;
  display: table-cell;
  direction: ltr;
}

.list__main {
  padding-left: 0;
  line-height: 1.8;
  vertical-align: middle;
}

.list__sub {
  width: 100px;
  vertical-align: top;
  text-decoration: none;
}

.list__sub--compact {
  width: 65px;
}

.list__sub img {
  width: 100%;
}

.list__release {
  padding: 0 0.5em;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  display: inline-block;
  color: #fff;
  background-color: #bbb;
  text-align: center;
  font-size: 11px;
  line-height: 1.4;
  vertical-align: middle;
}

.list__title {
  font-weight: bold;
}

.list__title--large {
  font-size: 116%;
}

.list__title--indexRanking a:hover {
  color: #72c331;
}

.list__title--pickup a:hover {
  color: #31c3ad;
}

.list__title--special {
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;
}

a:hover .list__title--special {
  color: #d0475a;
}

.list__name,
.list__date {
  font-size: 85%;
}

.list__name a {
  color: #ff69b4;/* 基本色 */
}

.list__name a:before {
  margin-right: -0.2em;
  content: "\e690";
  color: #ccc;
  font-size: 12px;
  font-family: utIcon;
  vertical-align: middle;
}

.list__message {
  margin-top: 5px;
  color: #888;
  font-size: 93%;
}

.list__date {
  color: #ff69b4;/* 基本色 */
  text-align: right;
}

/* 黄緑 */
.list__name--ranking a {
  color: #72c331;
}

/* 黄緑 */
.list__name--pickup a {
  color: #31c3ad;
}

/* 紅 */
.list__date--special {
  color: #d0475a;
}

.list__voteCount {
  text-align: right;
  line-height: 1.2;
}

.list__voteCount span {
  color: #ff69b4;
  font-size: 200%;
}

.list__button {
  text-align: right;
}

.list__button button {
  margin: 5px 0 0;
  padding: 3px 8px 3px 10px;
  border: none;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  text-align: right;
  color: #fff;
  background-color: #333;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  cursor: pointer;
  -webkit-transition: all 0.3s ease;
     -moz-transition: all 0.3s ease;
      -ms-transition: all 0.3s ease;
       -o-transition: all 0.3s ease;
          transition: all 0.3s ease;
}

.list__button button:hover {
  background-color: #ff69b4;
}


.list__button button:after {
  margin-left: 3px;
  font-family: utIcon;
  content: "\e699";
  vertical-align: middle;
}

/** ------------------------------
 * JSカレンダー
 */
.ui-widget,
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
  color: #ff69b4;
  font-weight: normal;
}

.ui-datepicker th {
  padding: 4px 0;
  color: #fff;
  background-color: #444;
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
  font-weight: bold;
}

.ui-datepicker .ui-datepicker-title select {
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  border: 1px solid #ccc;
}

.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
  -webkit-border-radius: 0;
     -moz-border-radius: 0;
          border-radius: 0;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  padding-top: 2px;
  text-decoration: none;
  vertical-align: middle;
  line-height: 1.8;
  text-align: center;
}

.ui-datepicker .ui-datepicker-prev:before {
  font-family: utIcon;
  content: "\e696";
}

.ui-datepicker .ui-datepicker-next:before {
  font-family: utIcon;
  content: "\e699";
}

.ui-widget-header .ui-icon {
  background-image: none !important;
}

.voteSurvey {
  border-top: 1px solid #ddd;
}

.voteSurvey td .selectOuter {
  width: 160px;
}

.voteSurvey__button {
  text-align: center;
}

.voteSurvey td input[type="text"] {
  width: 148px
}

.voteSurvey td input[type="button"] {
  padding: 5px;
  border: none;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  text-align: right;
  width: 10em;
  color: #fff;
  background-color: #ff69b4;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  cursor: pointer;
  -webkit-transition: all 0.3s ease;
     -moz-transition: all 0.3s ease;
      -ms-transition: all 0.3s ease;
       -o-transition: all 0.3s ease;
          transition: all 0.3s ease;
  text-align: center;
}

.voteSurvey td input[type="button"] + input[type="button"] {
  background-color: #343330;
}

/** ------------------------------
 * 箱型の一覧
 */
.blockList {
  margin-bottom: 1px;
  background: #eee url("/images/common/tableBg.png") no-repeat 100% 100%;
}

.blockList__inner {
  overflow: hidden;
  border-bottom: 1px solid #ddd;
  position: relative;
  z-index: 10;
}

.blockList__inner--last {
  border-bottom: none;
}

.blockList__inner:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.blockList__item {
  border-right: 1px solid #ddd;
  -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
          box-sizing: content-box;
  float: left;
  width: 235px;
}

.blockList__item + .blockList__item + .blockList__item {
  border-right: none;
  width: 234px;
}

.blockList__image {
  width: 100%;
  height: 234px;
  vertical-align: top;
}

/** ------------------------------
 * 特集などの一覧（blockListに入るもの）
 */
.preface {
  padding-top: 244px;
  text-decoration: none !important;
}

.preface:before {/* 各ボックスの高さが揃っているように見せるための背景の白い領域 */
  border-right: 1px solid #ddd;
  content: "";
  position: absolute;
  z-index: 0;
  top: 0;
  bottom: 0;
  width: 235px;
  display: block;
  background-color: #fff;
}

.preface__title,
.preface__body,
.preface__date {
  padding: 0 10px;
}

.preface__title,
.preface__body {
  position: relative;
}

.preface__title {
  margin-bottom: 7px;
  font-weight: bold;
  font-size: 109%;
}

.preface__body {
  padding-bottom: 1.0em;
  color: #888;
  font-size: 85%;
}

.preface__date {
  position: absolute;
  width: 215px;
  bottom: 0.4em;
  color: #ff69b4;
  font-size: 85%;
  text-align: right;
}

.preface__sub {
  position: absolute;
  top: 0;
  width: 235px;
}

.preface__sub img {
  width: 100%;
  height: 234px;
  vertical-align: top;
}

/** ------------------------------
 * pickupList
 */
.pickupList {
  display: table;
  border-collapse: separate;/* firefoxでborderが出ないバグ対策 */
  border-spacing: 0;/* firefoxでborderが出ないバグ対策 */
  width: 100%;
}

.pickupList__item {
  padding: 10px 8px 10px 10px;
  display: table-cell;
  vertical-align: top;
}

.pickupList__item +.pickupList__item {
  border-left: 1px solid #ddd;
}

.pickupList__itemInner {
  display: table;
  width: 100%;
  direction: rtl;
  unicode-bidi: embed;
  text-decoration: none !important;
}

.pickupList__main,
.pickupList__sub {
  display: table-cell;
  direction: ltr;
  vertical-align: top;
}

.pickupList__title {
  font-weight: bold;
}

.pickupList__date {
  margin-top: 5px;
  color: #888;
  font-size: 83%;
  text-align: right;
}

.pickupList__sub {
  padding-right: 8px;
  width: 65px;
}

.pickupList__sub img {
  width: 100%;
}

/** ------------------------------
 * 基本のtable
 */
table {
  border-collapse: separate;/* firefoxでborderが出ないバグ対策 */
  border-spacing: 0;/* firefoxでborderが出ないバグ対策 */
}

th,
td {
  padding: 8px 10px;
}

tr + tr > * {
  border-top: 1px solid #ddd;
}

tr > td + td {
  border-left: 1px dotted #ddd;
}

th {
  position: relative;
  background-color: #eee;
  font-weight: bold;
}

/* シンプルなtable */
.simpleTable {
  margin-bottom: 2px;
}

.simpleTable th,
.simpleTable td {
  padding: 14px 20px;
}

.simpleTable tr > th:first-of-type {
  position: relative;
  width: 200px;
  background-color: transparent;
  font-size: 109%;
}

.simpleTable tr > th:first-of-type:before {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #ff69b4;
}

.simpleTable td {
  color: #555452;
}

/** ------------------------------
 * 自由入力エリア
 */
.freeArea {
  margin-bottom: 1px;
  padding: 10px 10px 25px;
  border-bottom: 1px solid #ddd;
  color: #555452;
  font-size: 109%;
}

/** ------------------------------
 * キーワード
 */
.keywordList__tag {
  width: 11em;
  text-align: center;
}

.keywordList__tagLink {
  color: #ff69b4 !important;
}

.keywordList__tagLink:before {
  color: #aaa;
  font-family: utIcon;
  font-size: 10px;
  content: "\e64a";
}

.keywordList__tagLink:hover:before {
  color: #ff69b4;
}

.keywordList__title {
  font-weight: bold;
}

.keywordList__name {
  font-size: 85%;
  color: #ff69b4 !important;
  vertical-align: middle;
}

.keywordList__name:before {
  margin-right: -0.2em;
  margin-left: 5px;
  content: "\e690";
  color: #ccc;
  font-size: 12px;
  font-family: utIcon;
  vertical-align: middle;
}

.keywordList__lyric {
  padding-right: 0;
  padding-left: 0;
}

.keywordList__list {
  padding-right: 15px;
  padding-left: 15px;
}

.keywordList__list + .keywordList__list {
  margin-top: 7px;
  padding-top: 7px;
  border-top: 1px dotted #ddd;
}

/** ------------------------------
 * 検索
 */
.searchResult__head {
  width: 230px;
}

.searchResult__title a {
  font-weight: bold;
}

.searchResult__name {
  font-size: 85%;
}

.searchResult__name a {
  color: #ff69b4;
}

.searchResult__name a:before {
  margin-right: -0.2em;
  content: "\e690";
  color: #ccc;
  font-size: 12px;
  font-family: utIcon;
  vertical-align: middle;
}

/** ------------------------------
 * 該当なし
 */
.noItem {
  margin: 50px 15px;
  color: #888;
  font-size: medium;
  text-align: center;
}

.noItem--line {
  margin: 0;
  padding: 50px 15px;
  border-top: 1px solid #ddd;
}

/** ------------------------------
 * 送信完了
 */
.sendMessage {
  margin: 80px 15px;
  color: #888;
  font-size: medium;
  text-align: center;
}

/** ------------------------------
 * 歌詞検索
 */
.searchForm__title {
  width: 230px;
}

/** ------------------------------
 * フォーム関連
 */
table input[type="text"],
table textarea {
  padding: 4px 6px;
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  font-size: 108%;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
}

table input[type="text"] {
  width: 80%;
}

table textarea {
  width: 94%;
  height: 200px;
}

/* ボタン */
.formButton {
  margin-top: 1px;
  border-top: 1px solid #ddd;
  padding: 10px;
  text-align: center;
}

.formButton > * {
  display: inline-block;
}

.formButton button {
  margin: 0;
  padding: 0 60px;
  -webkit-border-radius: 2px;
     -moz-border-radius: 2px;
          border-radius: 2px;
  border: none;
  line-height: 2;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  color: #fff;
  background-color: #343330;
  font-size: medium;
  text-align: center;
  cursor: pointer;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.formButton button:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

/* 歌詞検索フォーム */
.lyricSearchForm th {
  padding-right: 0;
  padding-left: 0;
  width: 110px;
}

.lyricSearchForm td input[type="text"] {
  width: 92%;
}

/* selects装飾 */
td .selectOuter {
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  width: 96%;
  position: relative;
  overflow: hidden;
}

td select {
  margin: 0;
  padding: 4px 0;
  border: none;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  background-color: transparent;
  line-height: 1.7;
  font-size: 108%;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  outline: none;
}

td .selectOuter:after {
  position: absolute;
  z-index: 1;
  top: -0.1em;
  right: 0;
  color: #ff69b4;
  font-size: 26px;
  font-family: utIcon;
  content: "\e697";
}

td .selectOuter select {
  padding-left: 5px;
  position: relative;
  z-index: 10;
  width: 112%;
}

td .selectOuter select option {
  padding-left: 5px;
}

/** ------------------------------
 * 歌詞リクエスト
 */
.lyricForm__head {
  padding-right: 0;
  padding-left: 0;
  width: 210px;
}

.lyricForm textarea,
.lyricForm input[type="text"] {
  width: 80%;
}

/* 必須 */
.mandatoryfield {
  padding: 1px 4px;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  display: inline-block;
  color: #fff;
  background-color: #ff69b4;
  font-weight: normal;
  font-size: 10px;
  vertical-align: middle;
}

/** ------------------------------------------------------------
 * エラーメッセージ
 */
.errorMessage {
  margin-bottom: 1px;
  padding: 20px 100px;
  border-bottom: 1px solid #ddd;
}

.errorMessage__title {
  padding: 0 20px;
  color: #ef8100;
  font-weight: bold;
  font-family: "Times New Roman", serif;
  font-size: xx-large;
  line-height: 1.2;
  text-align: center;
}

.errorMessage__body {
  padding: 15px;
  border: 1px solid #ddd;
  color: #824e1c;
  background-color: #fffae4;
  list-style-type: square;
}

.errorMessage__item {
  margin-left: 1.5em;
}

/** ------------------------------
 * pager
 */
.pager {
  margin-bottom: 1px;
  border-bottom: 1px solid #ddd;
  padding: 10px;
  text-align: center;
}

table + .pager,
.list + .pager,
.blockList + .pager,
#loadIcon + .pager {
  border-top: 1px solid #ddd;
  border-bottom: none;
}

.pager__item,
.pager__item a {
  display: inline-block;
}

.pager__item--current {
  background-color: #eee;
}

.pager__item a:hover {
  border-color: #ff69b4;
}

.pager__item--current,
.pager__item a {
  padding: 4px 12px;
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}

.pager__item a {
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.pager__item--first a,
.pager__item--last a {
  color: #ff69b4;/* 基本色 */
}

.pager__item--first a:before {
  margin-right: 5px;
  font-family: utIcon;
  content: "\e63c";
  vertical-align: middle;
}

.pager__item--last a:after {
  margin-left: 5px;
  font-family: utIcon;
  content: "\e63d";
  vertical-align: middle;
}

/** ------------------------------
 * newIcon
 */
.newIcon {
  padding: 0 0.5em;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  display: inline-block;
  color: #fff;
  background-color: #ff69b4;
  text-align: center;
  font-size: 11px;
  font-weight: bold;
  font-style: italic;
  line-height: 1.4;
  vertical-align: middle;
}

/** ------------------------------
 * preIcon
 */
.preIcon {
  padding: 0 0.5em;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  display: inline-block;
  color: #fff;
  background-color: #28c4e5;
  text-align: center;
  font-size: 11px;
  font-weight: bold;
  font-style: italic;
  line-height: 1.4;
  vertical-align: middle;
}

/** ------------------------------
 * popularIcon
 */
.popularIcon {
  padding: 0 0.5em;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  display: inline-block;
  color: #fff;
  background-color: #f44aa2;
  text-align: center;
  font-size: 11px;
  font-weight: bold;
  font-style: italic;
  line-height: 1.4;
  vertical-align: middle;
}

/** ------------------------------
 * 検索時スライド
 */
.searchSlide {
  margin-bottom: 1px;
  padding: 16px 41px 13px;
  border-bottom: 1px solid #ddd;
}

.searchSlide a {
  display: inline-block;
}

.searchSlide img {
  display: inline-block !important;
  width: 100%;
}

.searchSlide__itemOuter {
  width: 108px !important;
}

.searchSlide__item {
  text-align: center;
  word-break: break-all;
}

.searchSlide__name {
  margin-top: 8px;
}

/* JS関連 */
.searchSlide .bx-prev,
.searchSlide .bx-next {
  height: 68px;
}

/** ------------------------------
 * 表示切替タブ
 */
.switchTab {
  padding-left: 5px;
  position: relative;
  border-bottom: 1px solid #ddd;
}

.switchTab__inner {
  display: table;
}

.switchTab__item {
  display: table-cell;
}

.switchTab__item a {
  margin: 10px 0 0 5px;
  padding: 5px 15px;
  border: 1px solid #ddd;
  -webkit-border-radius: 3px 3px 0 0;
     -moz-border-radius: 3px 3px 0 0;
          border-radius: 3px 3px 0 0;
  background-color: #fff;
  border-bottom-style: none;
  display: block;
  text-decoration: none;
}

.switchTab__item a:hover {
  color: #ff69b4;
}

.switchTab__item--current a {
  margin-bottom: -1px;
  padding-bottom: 6px;
  color: #343330 !important;
  background-color: #eee;
  font-weight: bold;
}

/** ------------------------------
 * ニュース検索
 */
.newsSearch {
  padding: 10px;
  position: relative;
  border-bottom: 1px solid #ddd;
  background-color: #eee;
}

.newsSearch__inner {
  border-radius: 3px;
  padding: 4px;
  border: 1px solid #ddd;
  background-color: #fff;
}

.newsSearch__inner:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.newsSearch__inner * {
  margin: 0;
  padding: 0;
  border: none;
  line-height: 1.7;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  background-color: transparent;
  font-size: 15px;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  outline: none;
}

.newsSearch input[type="text"] {
  margin-left: 5px;
  float: left;
  width: 463px;
}

.newsSearch button {
  -webkit-border-radius: 2px;
     -moz-border-radius: 2px;
          border-radius: 2px;
  float: right;
  width: 200px;
  color: #fff;
  background-color: #ff69b4;
  text-align: center;
  cursor: pointer;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.newsSearch button:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

.newsSearch button:before {
  margin-right: 5px;
  font-family: utIcon;
  content: "\e630";
}

.specialArticleSearch .easy-select-box {
  margin-right: 2px;
  padding: 4px 1px;
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  height: 27px;
  background-color: #fff;
}

/** ------------------------------
 * 特集検索
 */
.specialArticleSearch {
  padding: 10px;
  position: relative;
  border-bottom: 1px solid #ddd;
  background-color: #eee;
}

.specialArticleSearch:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.specialArticleSearch__inner {
  border-radius: 3px;
  padding: 4px;
  border: 1px solid #ddd;
  background-color: #fff;
  width: 50%;
  float: left;
}

.specialArticleSearch__inner:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.specialArticleSearch__inner * {
  margin: 0;
  padding: 0;
  border: none;
  line-height: 1.7;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  background-color: transparent;
  font-size: 15px;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  outline: none;
}

.specialArticleSearch input[type="text"] {
  margin-left: 5px;
  float: left;
  width: 236px;
}

.specialArticleSearch button {
  -webkit-border-radius: 2px;
     -moz-border-radius: 2px;
          border-radius: 2px;
  float: right;
  width: 100px;
  color: #fff;
  background-color: #ff69b4;
  text-align: center;
  cursor: pointer;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.specialArticleSearch button:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

.specialArticleSearch button:before {
  margin-right: 5px;
  font-family: utIcon;
  content: "\e630";
}

.grid {
  padding-left: 1px;
}

#loadIcon {
  margin: 30px 0;
  text-align: center;
}

/** ------------------------------
 * ランキング
 */
.rankingIcon {
  padding: 0 0.3em;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  position: absolute;
  left: 0;
  min-width: 1.6em;
  color: #fff;
  background-color: #ff69b4;
  text-align: center;
  font-size: medium;
  font-weight: normal;
  font-style: normal;
  line-height: 1.5;
}

.rankingIcon--index {
  padding: 0;
  background-color: #72c331;
}

.list__main--ranking {
  padding-left: 3.6em;
  position: relative;
}

.list__main--indexRanking {
  padding-left: 2.6em;
  position: relative;
}

/** ------------------------------
 * 新着
 */
.newestList__releaseHead {
  padding-right: 0;
  padding-left: 0;
  width: 7em;
  text-align: center;
}

.newestList__release {
  color: #888;
  font-size: 85%;
  text-align: center;
}

.newestList__title a {
  font-weight: bold;
}

.newestList__name {
  font-size: 85%;
}

.newestList__name a {
  color: #ff69b4;
}

/** ------------------------------
 * テキスト基本形
 */
.space {
  padding: 40px 25px;
  border-bottom: 1px solid #ddd;
  position: relative;
  color: #555452;
  line-height: 1.6;
}

.space--line {
  border-bottom: 1px solid #ddd;
}

.themeColor {
  color: #ff69b4 !important;
}

/**/
.longText {
  margin-top: 10px;
  line-height: 1.6;
}

.longText__title {
  padding: 10px 25px 7px;
  border-bottom: 3px solid #ff69b4;
  display: inline-block;
  font-weight: bold;
  font-size: medium;
  line-height: 1.4;
}

.longText__body {
  margin: -2px 0 25px;
  padding: 13px 25px 0;
  border-top: 1px solid #ddd;
  color: #555452;
}

.basicList {
  margin: 10px 0 10px 2.2em;
  list-style-type: square;
}

/* サイン */
.sign {
  margin: 25px;
  color: #555452;
}

.sign:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.sign__inner {
  float: right;
}

.sign__title {
  font-weight: bold;
}

/** ------------------------------------------------------------
 * sidebar
 */
#sidebar {
  float: right;
  width: 300px;
}

/** ------------------------------
 * banner
 */
.MediumRectangleBanner,
.rectangleBanner {
  margin-bottom: 15px;
}

/** ------------------------------
 * 話題のキーワード
 */
.keywordLineUp {
  padding: 10px 10px 4px;
  background-color: #fffcf6;
}

.keywordLineUp--index {
  background-color: #fbf4f8;
 }

.keywordLineUp:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.keywordLineUp li {
  margin: 0 6px 6px 0;
  float: left;
}

.keywordLineUp li a {
  padding: 3px 5px;
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  display: inline-block;
  background-color: #fff;
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.keywordLineUp li a:hover {
  color: #ff69b4;
  border-color: #ff69b4;
}

.keywordLineUp--index li a:hover {
  color: #ab538b;
  border-color: #ab538b;
}

/** ------------------------------
 * 音楽特集
 */
.specialLineUp__item a {
  display: table;
  table-layout: fixed;
  width: 100%;
  direction: rtl;
  unicode-bidi: embed;
}

.specialLineUp__item a:hover {
  color: #7f5ed4;
}

.specialLineUp__item + .specialLineUp__item {
  border-top: 1px solid #ddd;
}

.specialLineUp__main,
.specialLineUp__sub {
  padding: 10px;
  display: table-cell;
  direction: ltr;
}

.specialLineUp__main {
  padding-left: 0;
  vertical-align: middle;
}

.specialLineUp__sub {
  width: 80px;
  vertical-align: top;
}

.specialLineUp__sub img {
  width: 100%;
}

/** ------------------------------
 * twitter
 */
#twitter {
  margin-bottom: 15px;
  height: 300px;
}

/** ------------------------------
 * facebook
 */
#facebook {
  height: 500px;
}

/** ------------------------------------------------------------
 * errorPage
 */
.errorPage {
  padding: 80px 0;
  text-align: center;
}

.errorPage__title {
  color: #ff69b4;
  font-size: 54px;
  line-height: 1.3;
}

.errorPage__text {
  color: #999;
  font-size: medium;
}

#exceptionMessage {
  margin-top: 40px;
  padding: 20px;
  border: 3px solid #ff69b4;
  background-color: #fff;
  text-align: left;
}

/** ------------------------------------------------------------
 * footer
 */
footer {
  color: #9a9998;
  font-size: 13px;
  background-color: #343330;
}

footer:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

footer a,
footer a:hover,
footer a:active {
  color: #fff;
}

/* バナー */
.footerBanner {
  padding: 10px 0;
  background-color: #d0c8e5;
  text-align: center;
}

.footerBanner a {
  display: inline-block;
}

.footer__inner {
  margin: 0 auto;
  padding: 10px 0;
  position: relative;
  width: 1040px;
}

.footer__inner:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

/* メイン領域 */
.footer__main {
  float: left;
  width: 810px;
  position: relative;
}
/* Logo */
.footerLogo {
  border-bottom: 3px solid #ff69b4;
  margin-bottom:20px;
}
.footer__main ul {
  width:100%;
  display:table;
}
.footer__main ul li {
  display:table-cell;
  width:20%;
}
.footerNavi {
  margin-bottom:20px;
  line-height:1.8em;
}
.footerNavi li:nth-of-type(3) p:nth-of-type(n+2),
.footerNavi li:nth-of-type(4) p:nth-of-type(n+2),
.footerNavi li:nth-of-type(5) p {
  text-indent:1em;
}
.footerNavi .tSpace {
  padding-top:1.8em;
}
.footer__main ul:nth-of-type(2)
{
  width:auto;
}
.footer__main ul:nth-of-type(2) li
{
  width:auto;
}
.footer__main ul:nth-of-type(2) li:nth-of-type(n+2) {
  padding-left:25px;
}
/* Copyright , rss */
.footerInfo {
  margin-top:20px;
}
.footerInfo li:nth-of-type(1) {
  width:75%;
  font-size: 11px;
  vertical-align:middle;
}
.footerInfo  li:nth-of-type(2) {
  width:25%;
  line-height: 1.2;
  font-size: 14px;
  text-align:right;
}
.footerInfo  li:nth-of-type(2) p {
  text-align:left;
  padding-bottom:5px;
  text-indent: 1em;
}
.footerInfo  li:nth-of-type(2) a {
  display: inline-block;
  /* margin-left:3px; */
  padding: 3px 20px 3px 35px;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  background-color: #ff69b4;
  position: relative;
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}
.footerInfo  li:nth-of-type(2) a:hover {
  background-color: #f1278c;
}
.footerInfo  li:nth-of-type(2) a:before {
  position: absolute;
  top: 3px;
  left: 3px;
  font-family: utIcon;
  content: "\e6a6";
}

/* 許諾 */
.license {
  float: right;
  width: 210px;
}

.license__sub {
  text-align: left;
  font-size: 0;
}

.license__sub li {
  margin-bottom: 5px;
}

.license__item + .license__item {
  margin-left: 5px;
}

.license__item--jasrac {
  width: 60px;
}

.license__item--nextone {
  width: 60px;
}

.license__main {
  margin-top: 5px;
  font-size: 10px;
  line-height: 1.3;
}

/* 相互リンク */
.footerLink {
  background-color: #777;
  width: 1040px;
  position: relative;
  margin: 10px auto;
}

/* 掲載メディア */
.footerMedia {
  background-color: #777;
  width: 1040px;
  position: relative;
  margin: 10px auto;
}

/** ----------------------------------------
 * モーダル
 */
#lean_overlay {
  position: fixed;
  z-index:100;
  top: 0px;
  left: 0px;
  height:100%;
  width:100%;
  background: #000;
  display: none;
}

.modalWindow {
  display: none;
  width: 400px;
}

.modalWindow button.close {
  margin: auto;
  border: none;
  position: absolute;
  top: 0;
  right: 10px;
  bottom: 0;
  width: 26px;
  height: 26px;
  font-size: 16px;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  background-color: transparent;
  overflow: hidden;
  cursor: pointer;
}

.modalWindow button.close:before {
  position: absolute;
  top: 0;
  right: 0;
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
  width: 26px;
  height: 26px;
  line-height: 26px;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  color: #fff;
  background-color: #343330;
  outline: none;
  text-align: center;

  font-family: utIcon;
  content: "\e639";
}

/** ------------------------------
 * iTunes
 */
.iTunesData {
  padding: 10px;
  border-bottom: 1px solid #ddd;
}

.iTunesData:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.iTunesData--last {
  border-bottom: none;
}

.iTunesData__sub {
  float: left;
  width: 110px;
}

.iTunesData__sub img {
  width: 100%;
}

.iTunesData__main {
  float: right;
  width: 556px;
}

.iTunesInfo {
  padding: 8px 0;
}

.iTunesInfo__title,
.iTunesInfo__body {
  margin-bottom: 3px;
}

.iTunesInfo__title {
  width: 60px;
  margin-right: 10px;
  float: left;
  font-weight: bold;
}

.iTunesInfo__body {
  color: #888;
}

.iTunesData__purchase {
  margin-top: 10px;
  text-align: center;
}

.iTunesData__audio {
  padding: 0 0 4px 4em;
  clear: both;
  position: relative;
  background-color: #000;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  height: 2.7em;
}

.iTunesData__audio:before {
  padding: 0 5px;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  content: "試聴";
  color: #fff;
  position: absolute;
  top: 10px;
  left: 10px;
  background-color: #666;
  border: none;
}

.iTunesData__audio audio {
  margin: 0;
  padding: 0;
  width: 80%;
  height: 2.7em;
  vertical-align: top;
}

/** ------------------------------
 * 投稿ランキング
 */
.balloon {
  margin: 10px 70px 7px;
  padding: 15px;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  position: relative;
  color: #fff;
  background-color: #ff69b4;
  text-align: center;
  font-size: 118%;
}

.balloon:after {
  margin-left: -10px;
  border-width: 10px;
  border-style: solid;
  border-color: #ff69b4 transparent transparent transparent;
  content: "";
  display: block;
  position: absolute;
  bottom: -20px;
  left: 50%;
}

.balloon {
  margin-top: 25px 0 5px;
  background-color: #ff69b4;
}

.rankingList {
  border-top: 1px solid #ddd;
}

.balloon + .rankingList {
  border-top: 1px solid #ddd !important;
}

.contentBox__title + .contentBox__body > .rankingList,
.pager + .rankingList {
  border-top: none;
}

.rankingList .rankingList__item {
  padding: 0 10px;
}

.rankingList__title {
  margin: 0 -10px 10px;
  padding: 8px 12px;
  border-bottom: 1px solid #ddd;
  background-color: #eee;
}

.rankingList__item + .rankingList__item {
  border-top: 1px solid #ddd;
}

.rankingList__title h2 {
  color: #343330;
  font-weight: bold;
  font-size: 116%;
  margin-top: 16px;
}

.rankingList__image {
  float: left;
  margin-right: 12px;
}

.rankingList__time {
  padding-top: 4px;
  color: #ff69b4;
  font-size: 93%;
}

.rankingList__message {
  margin: 20px 10px;
}

.rankingList__finished {
  padding: 5px 0 0;
  color: #e00;
  text-align: right;
  font-size: 116%;
  font-weight: bold;
}

.rankingList__button {
  margin: 0 -10px;
  padding: 10px 0;
  border-top: 1px dashed #ddd;
  text-align: center;
}

.rankingList__button button,
.rankingList__button a,
.rankingList__button span {
  margin: 0;
  padding: 6px 0;
  border: none;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  color: #fff;
  line-height: 25px;
  background-color: #ff69b4;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  cursor: pointer;
  width: 30%;
}

.rankingList__button a {
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

.rankingList__button a:hover {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
  text-decoration: none;
}

.rankingList__button span {
  color: #aaa;
  background-color: #ddd;
}

.rankingList__button a.rankingList__resultButton {
  background-color: #333;
}

.rankingList + .pager {
  border-top: 1px solid #ddd;
  border-bottom: none;
}

/* 結果 */
.voteCount {
  margin-bottom: 2px;
  padding: 30px 0;
  position: relative;
  background-color: #f6f6f6;
  text-align: center;
  font-size: 30px;
}

.voteCount:after {
  border-bottom: 1px solid #ddd;
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  content: "";
  display: block;
}

.voteCount:before {
  font-family: utIcon;
  content: "\e671";
}

.voteCount span {
  margin: 0 5px;
  color: #f33;
  font-size: 56px;
}

input.voted {
  background-color: yellow;
}

input.mostVoted {
  color: red;
}

/* 投票結果 1位 */
.voteTop {
  border-bottom: 1px solid #fff;
  padding: 7px;
  background: #fce7cc url("/images/common/bg1.gif") repeat 0 0;
}

.voteTop + .list {
  border-top: 1px solid #ddd;
}

.voteTop__inner {
  border: 1px solid #f8ab45;
  padding: 2px;
  background-color: #fff;
}

.voteTop__inner:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.voteTop__main {
  padding-top: 6em;
  position: relative;
  float: right;
  width: 470px;
}

.voteTop__title {
  font-size: 20px;
  font-weight: bold;
}

.voteTop__name a {
  color: #ff69b4;/* 基本色 */
}

.voteTop__name a:before {
  margin-right: -0.2em;
  content: "\e690";
  color: #ccc;
  font-size: 12px;
  font-family: utIcon;
  vertical-align: middle;
}

.voteTop__sub {
  float: left;
  width: 200px;
}

.voteTop__sub img {
  width: 200px;
}

.voteTop__icon {
  position: absolute;
  top: 15px;
  left: 0;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  display: block;
  width: 1.2em;
  line-height: 1.2em;
  color: #fff;
  background-color: #ff69b4;
  font-style: normal;
  font-size: 32px;
  text-align: center;
}

/** ------------------------------
 * パンくずリスト
 */
.path {
  padding-bottom: 10px;
}

.path:before {
  margin-right: -0.2em;
  font-family: utIcon;
  content: "\e602";
}

.path li {
  display: inline-block;
}

.path li + li:before {
  content: ">";
  font-size: 10px;
}

.path li a {
  color: #ff69b4;
}
