@charset "UTF-8";
#page .campaign-hero__schedule {
  display: none;
}

#page .s-campaign-hero {
  padding: 0;
  background: url("/assets/pages/news/award/img/header_bg.jpg") no-repeat center top/auto 100% black;
}

#page .heading--m {
  background: url("/assets/pages/news/award/img/heading_bg.gif") no-repeat center;
  color: white;
  height: 60px;
  line-height: 60px;
  margin: 40px 0;
  padding: 0;
}

#page .ccm-page-list:nth-of-type(2) .l-inner ol {
  display: flex;
  justify-content: center;
  margin: 4rem 0;
}

#page .ccm-page-list:nth-of-type(2) .l-inner ol li {
  box-shadow: none;
  width: 100px;
  text-align: center;
  padding: 0;
  margin: 0;
  border-bottom: 4px solid black;
  border-radius: 0;
  transition: all 0.2s ease-in;
}

#page .ccm-page-list:nth-of-type(2) .l-inner ol li:hover {
  border-bottom: 4px solid #bf0000;
}

#page .ccm-page-list:nth-of-type(2) .l-inner ol li:first-of-type {
  border-bottom: 4px solid whitesmoke;
}

#page .ccm-page-list:nth-of-type(2) .l-inner ol li:nth-of-type(2):hover {
  border-bottom: 4px solid #bf0000;
}

#page .ccm-page-list:nth-of-type(2) .l-inner ol li a {
  color: black;
}

#page .ccm-page-list:nth-of-type(2) .l-inner ol li a figure {
  display: none;
}

#page .ccm-page-list .l-inner ol {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

#page .ccm-page-list .l-inner ol li {
  width: 50%;
  padding: 1rem;
}

#page .ccm-page-list .l-inner ol li a figure {
  transition: all 0.2s ease-in;
}

#page .ccm-page-list .l-inner ol li a figure img {
  width: 100%;
}

#page .ccm-page-list .l-inner ol li a h3 {
  font-size: 1.6rem;
  margin: 1.2rem 0;
}

#page .ccm-page-list .l-inner ol li a:hover figure {
  opacity: 0.8;
}

body.sp #page .heading--m {
  background: url("/assets/pages/news/award/img/heading_bg.gif") no-repeat center/90vw 100%;
}
body.sp #page .ccm-page-list .l-inner ol li {
  width: 100%;
}

/* ===== WordPress用の調整：サイト共通CSSの値を、本番(c5)の表示に合わせる ===== */
body #page .l-campaign-01,
body #page .l-campaign-03 {
  line-height: 1.5;
}

body #page .l-campaign-01 {
  font-size: 16px;
  letter-spacing: normal;
}

body #page .l-campaign-01 *,
body #page .l-campaign-03 * {
  letter-spacing: normal !important;
}

body #page .s-campaign-hero {
  padding-top: 0 !important;
  position: static !important;
}

/* 見出し(h2)：サイト共通の padding-top / line-height / 中央寄せに負けないようにする */
body #page .l-campaign-01 h2.heading.heading--m {
  line-height: 60px !important;
  padding-top: 0 !important;
}

body #page .ccm-page-list .l-inner ol li a h3.ccm-page-list-title {
  line-height: 24px;
  text-align: start;
}

body #page .ccm-page-list:nth-of-type(2) .l-inner ol li a h3.ccm-page-list-title {
  text-align: center;
}

/* 無料トライアルボタン：サイト共通の .btn-apply a / span.txt / svg の指定を打ち消し、本番のサイズに */
body.pc #page .l-campaign-01 > .btn-apply a span.txt {
  font-size: 20px !important;
  line-height: 26px !important;
}

body #page .l-campaign-01 > .btn-apply a svg {
  width: 17px !important;
  height: 17px !important;
}

body.pc #page .l-campaign-01 > .btn-apply .btn-apply--caption {
  font-size: 16px !important;
  line-height: 24px !important;
}

body #page .l-campaign-01 > .btn-apply .btn-apply--caption a {
  font-size: inherit !important;
  line-height: inherit !important;
}

/* 「楽天ミュージックとは」見出し・注釈 */
body.pc #page .l-campaign-01 h2.heading.heading--m {
  font-size: 24px !important;
  line-height: 60px !important;
  padding-top: 0 !important;
}

body #page .l-content .l-campaign-01 .stack-characteristic .l-inner .stack-characteristic--content + p.small {
  font-size: 16px !important;
  line-height: 24px !important;
}

/* 年タブ(SP)：本番は :nth-of-type(2) の幅100pxが勝つ（body.sp を付けた全幅100%に負けないように） */
body.sp #page .ccm-page-list:nth-of-type(2) .l-inner ol li {
  width: 100px;
}

/* ===== 開催中のお得なキャンペーン：サイト共通の !important に負けないようにして、本番の表示に ===== */
body #page .l-campaign-03 .s-campaign-list h2.heading.heading--m {
  line-height: 60px !important;
  padding-top: 0 !important;
}

body.pc #page .l-campaign-03 .s-campaign-list {
  padding-bottom: 48px;
}

body.sp #page .l-campaign-03 .s-campaign-list {
  padding-top: 24px;
  padding-bottom: 0;
}

body.pc #page .l-campaign-03 .campaign__item:nth-child(2n+1) {
  padding-right: 16px !important;
}

body.pc #page .l-campaign-03 .campaign__item:nth-child(2n) {
  padding-left: 16px !important;
}

body.pc #page .l-campaign-03 .campaign__item:nth-child(n+3) {
  padding-top: 40px !important;
}

body.sp #page .l-campaign-03 .campaign__item:nth-child(n+2) {
  padding-top: 24px !important;
}

/* 楽天ミュージックとは(SP) */
body.sp #page .stack-characteristic--content--features li img {
  width: 64px !important;
  height: auto !important;
}

body.sp #page .stack-characteristic--content--features li p:not(.features-lead) {
  line-height: 13.5px;
}

/* 最新配信曲(SP)：サイト共通の section の余白0に負けないようにする */
body.sp #page .s-delivery-list {
  padding-top: 24px;
}

/* 無料トライアルをはじめるボタン(SP)：左右にスペース */
body.sp #page .l-campaign-01 > .btn-apply > a.trial-btn {
  margin-left: 24px;
  margin-right: 24px;
}

/* ボタン下の注釈(SP)：左右にスペース・左揃え */
body.sp #page .l-campaign-01 > .btn-apply > .btn-apply--caption {
  box-sizing: border-box;
  padding-left: 24px;
  padding-right: 24px;
  text-align: left;
}
