/* ==========================================================================
    reset
   ========================================================================== */
.l-monthlyPrime {
    line-height: 1.5;
}

.l-monthlyPrime * {
    list-style: none;
    margin: 0;
    padding: 0;
}

.l-monthlyPrime.is-r18 .m-mainVisual .mainVisual__btn {
    left: 70px;
}

.l-monthlyPrime.is-com .m-productsList .productsList__img img {
    padding: 3px;
    border: 1px solid #ccc;
}

.l-monthlyPrime.is-com .m-detailProductsList .detailProductsList__img {
    box-sizing: border-box;
    padding: 3px;
    border: 1px solid #ccc;
}

.l-monthlyPrime.is-com .m-detailProductsList .detailProductsList__img img {
    width: 100%;
    margin: 0;
}

.l-monthlyPrime.is-com .m-detailProductsList .detailProductsList__img + b {
    margin-top: 5px;
}

.l-monthlyPrime.is-com .m-recommendList .recommendList__img img {
    padding: 3px;
    border: 1px solid #ccc;
}

/* ==========================================================================
    common
   ========================================================================== */
a:link {
    color: #005fc0;
}

a:hover {
    color: #df0331;
    text-decoration: underline;
}

[class*="__listItem"] a:hover,
[class*="__list"] a:hover {
    text-decoration: none;
}

[class*="__listItem"] a:hover b,
[class*="__list"] a:hover b {
    text-decoration: underline;
}

.crs_full,
a:link.crs_full {
    cursor: url("//p.dmm.com/p/title/crs_full.cur"), auto;
}

#prime-localnav {
    background: #404849 url("//p.dmm.com/p/ds/common/bg_localnav.png") repeat 0 0;
}

#prime-localnav a,
#prime-localnav span {
    display: block;
    padding: 11px 20px;
    color: #fff;
    font-size: 14px;
    line-height: 1;
}

#prime-localnav a.is-r18:hover,
#prime-localnav span.is-r18:hover {
    background-color: #cd0303;
}

#prime-localnav a.is-general:hover,
#prime-localnav span.is-general:hover {
    background-color: #3eaeda;
}

#prime-localnav ul {
    padding-right: 20px;
}

#prime-localnav ul li {
    float: left;
}

#prime-localnav ul li.on a,
#prime-localnav ul li.on span {
    font-weight: bold;
}

#prime-localnav ul li.on .is-r18 {
    background-color: #cd0303;
}

#prime-localnav ul li.on .is-general {
    background-color: #3eaeda;
}

#prime-localnav .sub-nav {
    float: right;
}

#prime-localnav .sub-nav a {
    padding-left: 36px;
    background: url("//p.dmm.com/p/ds/common/ico_localnav_subnav.png") no-repeat 20px 50%;
}

#side-l .side-pickup .inner.is-guest dt {
    background-position: 0 -313px;
    font-size: 16px;
}

#side-l .side-pickup .inner.is-guest dd > .price-line-through {
    color: #fff;
    text-decoration: line-through;
}

#side-l .side-pickup .inner.is-guest dd > .price-line-through .price-color {
    color: #ec3448;
    font-size: 12px;
}

#side-l .side-pickup .inner.is-guest .box-bt a.free-regist {
    background: #ffebba;
    background: linear-gradient(to bottom, #ffebba 0%, #ffd675 50%, #ffc119 50%, #ffb800 100%);
    color: #333;
    font-weight: bold !important;
    line-height: 23px;
    text-decoration: none;
    word-break: normal !important;
    text-align: center;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebba', endColorstr='#ffb800', GradientType=0);
}

#side-l .side-pickup .inner.is-guest .box-bt a.free-regist:hover {
    background: #fff1cf;
    background: linear-gradient(to bottom, #fff1cf 0%, #fff1cf 50%, #ffc119 51%, #ffd648 51%, #ffd648 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff1cf', endColorstr='#ffd648', GradientType=0);
}

#side-l .side-pickup .inner.is-guest .box-bt a.free-regist:before {
    position: absolute;
    left: 23px;
    color: #e9291b;
    font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
    font-size: 12px;
    line-height: 2em;
    letter-spacing: -2px;
    content: "￥0";
}

#side-l .side-pickup .inner.is-guest .box-bt a.free-regist .tx-free {
    display: block;
    position: relative;
    z-index: 0 !important;
    left: 3px;
}

#side-l .side-pickup .inner.is-experience dt {
    background-position: 0 -315px;
}

#side-l .side-pickup .inner.is-experience dd .price-color {
    color: #ec3448;
    font-size: 12px;
}

#side-l .side-pickup .inner.is-experience .box-bt a.free-regist {
    position: relative;
    background: #fdfdfd;
    background: linear-gradient(to bottom, #fff 0%, #fdfdfd 50%, #ebebeb 50%, #d8d8d8 100%);
    color: #333;
    font-weight: bold !important;
    line-height: 23px;
    text-decoration: none;
    word-break: normal !important;
    text-align: center;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdfdfd', endColorstr='#d8d8d8', GradientType=0);
}

#side-l .side-pickup .inner.is-experience .box-bt a.free-regist:hover {
    background: #fdfdfd;
    background: linear-gradient(to bottom, #fff 0%, #fdfdfd 50%, #efefef 51%, #efefef 51%, #e0e0e0 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdfdfd', endColorstr='#e0e0e0', GradientType=0);
}

#side-l .side-pickup .inner.is-experience .box-bt a.free-regist:before {
    position: absolute;
    top: 3px;
    left: 8px;
    width: 15px;
    height: 14px;
    background: url("//p.dmm.com/p/mt_prime/ico_experienceRegist_red01.png") left top no-repeat;
    content: "";
}

#side-l .side-pickup .inner.is-experience .box-bt a.free-regist .tx-free {
    display: block;
    position: relative;
    z-index: 0 !important;
    left: 3px;
}

#side-l .side-cancel {
    margin: 30px 0 6px;
    padding: 15px 10px;
    border: 1px solid #737373;
}

#side-l .side-cancel a:before {
    content: "▶";
}

/*
    左ナビ
    お気に入りボタン、視聴履歴ボタン
 */
#side-l .side-pickup .inner .box-bt a.ds-bkm-g {
    background-image: url(//p.dmm.co.jp/p/common/side/worldwide/bt_bkm_guest.gif);
}

#side-l .side-pickup .inner .box-bt a.ds-his-m {
    background-image: url(//p.dmm.co.jp/p/common/side/worldwide/bt_his_member.gif);
}

#side-l .side-pickup .inner .box-bt-bkm {
    margin: 6px 0 0;
}

#side-l .side-pickup .inner .box-bt-bkm span.status {
    display: block;
    position: absolute;
    top: 3px;
    right: 11px;
    line-height: 16px;
    font-family: Arial, sans-serif;
    font-weight: bold;
    font-size: 11px;
    color: #ff355f !important;
}

#side-l .side-pickup .inner .box-bt-bkm .ds-bkm-m {
    display: block;
    position: relative;
    height: 23px;
    background-image: url(//p.dmm.co.jp/p/common/side/worldwide/bt_bkm_member.gif);
}

#side-l .side-pickup .inner .box-bt-bkm .ds-bkm-m span.tx-bkm {
    visibility: hidden;
}

#side-l .side-pickup .inner .box-bt-bkm p.bkm-babble {
    position: relative;
    height: 20px;
    line-height: 20px;
    margin-bottom: 4px;
    padding-top: 2px;
    border-radius: 3px;
    text-align: center;
    background-color: #fffdd4;
    color: #000;
    font-size: 11px;
    font-weight: bold;
    z-index: 1;
}

#side-l .side-pickup .inner .box-bt-bkm p.bkm-babble span {
    color: #ff355f;
}

#side-l .side-pickup .inner .box-bt-bkm p.bkm-babble:before {
    position: absolute;
    right: 15px;
    bottom: -7px;
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 7px 0 7px;
    border-color: #fffdd4 transparent transparent transparent;
    z-index: 2;
}

#side-l .side-pickup .inner .box-bt-bkm p.bkm-babble:after {
    position: absolute;
    right: 13px;
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 9px 0 9px;
    border-color: #000 transparent transparent transparent;
}

.m-listBox {
    /*overflow: hidden;*/
    margin: 0 0 40px;
}

.m-listBox .listBox__heading {
    overflow: hidden;
    max-width: 1400px;
    height: 22px;
    margin: 0 auto 10px;
    line-height: 22px;
}

.m-listBox .listBox__heading h2 {
    float: left;
    font-size: 18px;
    font-weight: normal;
}

.m-listBox .listBox__heading p {
    float: left;
    margin: 0 0 0 15px;
    font-size: 16px;
}

.m-listBox .listBox__heading p a {
    font-size: 14px;
}

.m-listBox .listBox__heading--detail {
    max-width: 1330px;
    margin: 0 0 10px;
}

.m-listBox--closing .listBox__heading p {
    float: left;
}

.m-serviceInfo {
    max-width: 1400px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 40px;
    padding: 0 50px;
}

.m-serviceInfo .serviceInfo__heading {
    margin-bottom: 10px;
    font-size: 24px;
    font-weight: normal;
}

.m-serviceInfo .serviceInfo__detail {
    padding: 30px 5%;
    border-radius: 10px;
    background-color: #faf9e0;
}

.m-serviceInfo .serviceInfo__txt {
    line-height: 2.2em;
    font-size: 14px;
}

.m-serviceInfo .serviceInfo__txt span {
    color: #c10000;
    font-size: 20px;
    font-weight: bold;
}

.m-serviceInfo .serviceInfo__price {
    margin-top: 15px;
    font-size: 14px;
    text-align: center;
}

.m-serviceInfo .serviceInfo__price > * {
    display: inline-block;
    font-size: 18px;
    vertical-align: middle;
}

.m-serviceInfo .serviceInfo__price .serviceInfo__aside > span {
    margin: 0 1em;
    color: #c10000;
    font-weight: bold;
}

.m-serviceInfo .serviceInfo__price .serviceInfo__aside > span > span {
    font-size: 20px;
}

.m-detailTable .detailTable__review {
    vertical-align: middle;
}

.m-detailTable th {
    padding: 0 12px 4px 0;
    font-weight: normal;
    vertical-align: top;
    white-space: nowrap;
    text-align: right;
}

.m-detailTable td {
    padding: 0 0 9px;
}
.m-detail .m-detailTable td {
    padding-bottom: 4px;
}

.m-detailTable tr:last-child td,
.m-detailTable tr:last-child th {
    padding-bottom: 0;
}

.m-detailTable td a {
    margin: 0 .25em;
}

.m-detailTable td a:first-child {
    margin: 0 .25em 0 0;
}

.m-detailTable td span {
    margin: 0 .25em 0 0;
    white-space: nowrap;
}

.m-detailTable td.d-review [class^="d-rating"] {
    background-color: transparent;
}

/*
    button
    ボタンのラッパー
    ここでサイズ指定を行う
 */
.primeBtnWrapper {
    width: 272px;
    height: 47px;
    line-height: 47px;
}

.primeBtnWrapperSmall {
    width: 272px;
    height: 36px;
    line-height: 36px;
}

.primeBtnWrapperSmall02 {
    width: 120px;
    height: 47px;
    line-height: 47px;
}

.favoriteBtnWrapper {
    width: 100%;
    height: 36px;
    margin: 0 auto;
    line-height: 36px;
}

/* 共通ボタンのベース定義 */
.primeBtn {
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border-radius: 6px;
    text-decoration: none !important;
}

.primeBtn:hover {
    top: 2px;
    opacity: .75;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
}

.primeBtn > span {
    display: inline-block;
}

/* 共通ボタンのmodifier */
.primeBtn--top,
.primeBtn--admission {
    border-bottom: 3px solid #a15b00;
    background-color: #ff8105;
    color: #fff !important;
    font-size: 18px;
    line-height: inherit;
    text-align: center;
}

.primeBtn--play {
    border-bottom: 3px solid #3e5e85;
    background-color: #3c88e6;
    color: #fff !important;
    font-size: 18px;
    line-height: inherit;
    text-align: center;
}

.primeBtn--playSample {
    border-bottom: 3px solid #999;
    background-color: #d2d2d2;
    color: #333 !important;
    font-size: 13px;
    font-weight: bold;
    line-height: inherit;
    text-align: center;
}

.primeBtn--playSample > span:before {
    display: inline-block;
    width: 21px;
    height: 20px;
    margin-right: .25em;
    background: url("//p.dmm.com/p/mt_prime/ico_playSample.png") no-repeat;
    vertical-align: -4px;
    content: "";
}

.primeBtn--end {
    background-color: #858585;
    color: #bbb;
    font-size: 18px;
    line-height: inherit;
    text-align: center;
}

.primeBtn--end:hover {
    top: 0;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.primeBtn--join {
    background-color: #ff8200;
    color: #fff !important;
    font-size: 18px;
    line-height: inherit;
    text-align: center;
    border-bottom: 3px solid #a15b00;
}

/* お気に入りボタン */

/* 一部のブラウザは親からfont-familyやfont-sizeを継承しないため */
.m-products button, .m-products input, .m-products select, .m-products textarea {
    font-family: inherit;
    font-size: 100%;
}

.prime-favorite-btn {
    display: block;
    margin-bottom: 10px;
    padding: 7px 0 6px 14px;
    color: #575757;
    font-size: 14px!important;
    width: 100%;
    text-align:center;
    background-color: #fff;
    background-image: url(//p.dmm.co.jp/p/monthly/common/ico/ico_star_sm.png);
    background-repeat: no-repeat;
    background-position: 40px center;
    border: 1px solid #cfcfcf;
    border-radius: 4px;
    box-sizing: border-box;
    cursor: pointer !important;
}

.prime-favorite-btn:hover {
    opacity: .8;
    text-decoration: none;
}

span.prime-favorite-btn {
    opacity: .6;
    padding: 0;
    cursor: default !important;
    background-position: 7px center;
}

.prime-favorite-btn:hover {
    opacity: .6;
    cursor: default;
}


/* お気に入り登録後 */
span.favoriteBtn {
    opacity: .6;
}

.favoriteBtn > span {
    display: inline-block;
}

.favoriteBtn > span:before {
    content: '★';
    display: inline-block;
    margin-right: 6px;
    color: #f66;
    margin-right: .25em;
}

/*
    page nation
    ページネーションのコンテナ
*/
.boxPagenation {
    padding: 12px;
}

.boxPagenation:before,
.boxPagenation:after {
    display: table;
    content: "";
}

.boxPagenation:after {
    clear: both;
}

.boxPagenation.is-bottom {
    margin: 0 0 16px;
    background: #eee;
}

.boxPagenation__list {
    list-style: none;
    float: right;
}

.boxPagenation__list:before,
.boxPagenation__list:after {
    display: table;
    content: "";
}

.boxPagenation__list:after {
    clear: both;
}

.boxPagenation__listItem {
    float: left;
    margin-left: 6px;
    font-size: 14px;
}

.boxPagenation__listItem:first-child {
    margin-left: 0;
}

.boxPagenation__listItem--terminal {
    margin-left: 28px;
}

.boxPagenation__listItem--terminal:first-child {
    margin-left: 0;
}

.boxPagenation__listItem--terminal:first-child + .boxPagenation__listItem {
    margin-left: 28px;
}

.boxPagenation__btn {
    display: block;
    box-sizing: border-box;
    min-width: 40px;
    height: 20px;
    padding: 0 1em;
    border: 1px solid #333;
    background-color: #fff;
    color: #333;
    font-size: 12px;
    line-height: 18px;
    text-decoration: none;
    text-align: center;
}

.boxPagenation__listItem--terminal > .boxPagenation__btn {
    padding: 0 1.5em;
}

.boxPagenation__btn:link,
.boxPagenation__btn:visited {
    color: #333;
    text-decoration: none;
}

.boxPagenation__btn:hover {
    background-color: #959595;
    color: #fff !important;
}

.boxPagenation__btn.is-current {
    background-color: #333;
    color: #fff !important;
}

.boxPagenation__ellipses {
    position: relative;
    top: -.25em;
}

/* ==========================================================================
    m-mainVisual
   ========================================================================== */
.m-mainVisual {
    width: 100%;
}

.m-mainVisual .mainVisual__outer {
    background: #ccc;
}

.m-mainVisual .mainVisual__wrap {
    position: relative;
    overflow: hidden;
    max-width: 1200px;
    height: 300px;
    margin: 0 auto 30px;
    border: none;
    background: #eee;
    text-align: center;
}

.m-mainVisual .mainVisual__wrap.is-member {
    overflow: visible;
    width: 100%;
    height: auto;
    margin: 0 auto 50px;
    padding: 0;
    text-align: center;
}

.m-mainVisual .mainVisual__img {
    overflow: hidden;
}

.m-mainVisual .mainVisual__img img {
    margin: 0 -236px;
}

.m-mainVisual .mainVisual__heading {
    position: relative;
    height: 300px;
}

.m-mainVisual .mainVisual__txt {
    margin: 0 0 5px;
    padding: 25px 0 0;
}

.m-mainVisual .mainVisual__btn {
    position: absolute;
    bottom: 102px;
    width: 100%;
    color: #ff8150;
    text-align: center;
}

.m-mainVisual .mainVisual__btn p {
    font-size: 20px;
}

.m-mainVisual .mainVisual__btn .is-topBnr {
    position: absolute;
    right: -100%;
    bottom: -82px;
    left: -100%;
    margin: 0 auto;
    border-radius: 6px;
    background: #eeeced;
    font-size: 20px;
}

.m-mainVisual .mainVisual__btn .is-topBnr:hover {
    bottom: -84px;
}

.m-mainVisual .mainVisual__btn .is-topBnr a {
    vertical-align: top;
}

.m-mainVisual .mainVisual__btn .is-topBnr a:hover {
    top: 0;
}

.m-mainVisual .mainVisual__list:before,
.m-mainVisual .mainVisual__list:after {
    display: table;
    content: "";
}

.m-mainVisual .mainVisual__list:after {
    clear: both;
}

.m-mainVisual .mainVisual__listItem a {
    display: block;
    overflow: hidden;
}

.m-mainVisual .mainVisual__listItem img {
    margin: 0 -236px;
}

.m-mainVisual .bx-controls {
    position: absolute;
    bottom: -30px;
    width: 100%;
}

.m-mainVisual .bx-pager-item {
    display: inline-block;
    margin: 0 5px;
}

.m-mainVisual .bx-pager-item a {
    display: block;
    width: 8px;
    height: 8px;
    border: 1px solid #ccc;
    border-radius: 5px;
    background: #fff;
    text-indent: -9999px;
}

.m-mainVisual .bx-pager-item a:hover {
    overflow: visible;
}

.m-mainVisual .bx-pager-item a.active {
    border: 1px solid #ccc;
    background: #ccc;
}

.m-mainVisual .bx-controls-direction a {
    position: absolute;
    top: -186px;
    background-color: rgba(0, 0, 0, .1);
    background-image: url('//p.dmm.com/p/mt_prime/ico_rotationCtrl.png');
    background-repeat: no-repeat;
    width: 50px;
    height: 50px;
}

.m-mainVisual .bx-controls-direction a:hover {
    background-color: rgba(0, 0, 0, .5);
}

.m-mainVisual .bx-controls-direction .bx-prev {
    left: 0;
    background-position: left 0;
}

.m-mainVisual .bx-controls-direction .bx-next {
    right: 0;
    background-position: left -50px;
}

/* ==========================================================================
    m-appeal
   ========================================================================== */
.m-appeal {
    margin: 0 0 40px;
}

.m-appeal .appeal__list {
    width: 670px;
    margin: 0 auto;
}

@media only screen and (min-width: 1540px) {
    .m-appeal .appeal__list {
        width: 1340px;
        text-align: center;
    }
}

.m-appeal .appeal__list:before,
.m-appeal .appeal__list:after {
    display: table;
    content: "";
}

.m-appeal .appeal__list:after {
    clear: both;
}

.m-appeal .appeal__list.is-r18 .is-device {
    background: url("//p.dmm.com/p/mt_prime/ico_deviceView_r18.png") left center no-repeat;
}

.m-appeal .appeal__list.is-r18 .is-price {
    background: url("//p.dmm.com/p/mt_prime/ico_moneyYen_r18.png") 10px center no-repeat;
}

.m-appeal .appeal__list.is-r18 .is-month {
    background: url("//p.dmm.com/p/mt_prime/ico_endMonth_r18.png") left center no-repeat;
}

.m-appeal .appeal__list.is-r18 .is-peace {
    background: url("//p.dmm.com/p/mt_prime/ico_cancel_r18.png") left center no-repeat;
}

.m-appeal .appeal__list.is-r18 .is-free {
    background: url("//p.dmm.com/p/mt_prime/ico_moneyFree_r18.png") 7px center no-repeat;
}

.m-appeal .appeal__list.is-general .is-device {
    background: url("//p.dmm.com/p/mt_prime/ico_deviceView_general.png") left center no-repeat;
}

.m-appeal .appeal__list.is-general .is-price {
    background: url("//p.dmm.com/p/mt_prime/ico_moneyYen_general.png") 10px center no-repeat;
}

.m-appeal .appeal__list.is-general .is-month {
    background: url("//p.dmm.com/p/mt_prime/ico_endMonth_general.png") left center no-repeat;
}

.m-appeal .appeal__list.is-general .is-peace {
    background: url("//p.dmm.com/p/mt_prime/ico_cancel_general.png") left center no-repeat;
}

.m-appeal .appeal__list.is-general .is-free {
    background: url("//p.dmm.com/p/mt_prime/ico_moneyFree_general.png") 7px center no-repeat;
}

.m-appeal .appeal__listItem {
    float: left;
    width: 335px;
    margin: 0 0 20px;
    color: #333;
}

@media only screen and (min-width: 1540px) {
    .m-appeal .appeal__listItem {
        display: inline-block;
        float: none;
        width: 310px;
        margin: 10px 10px 30px;
        vertical-align: top;
        text-align: left;
    }
}

.m-appeal .appeal__listItem b {
    font-size: 14px;
}

.m-appeal .appeal__txt {
    padding: 0 0 0 70px;
}

.m-appeal .appeal__aside {
    width: 100%;
    min-height: 30px;
    background: #eee;
    font-size: 13px;
    line-height: 30px;
    text-align: center;
}

.m-appeal .appeal__asideNum {
    font-size: 18px;
    font-weight: bold;
}

/* 注釈(海外アクセス制限用) */
.m-appeal .notes-foreign {
    display: flex;
    justify-content: center;
    margin-top: -10px;
}

/* ==========================================================================
    m-recommendBox
   ========================================================================== */
.m-recommendBox {
    max-width: 1400px;
    margin: 0 auto;
}

.m-recommendBox .recommendBox__list {
    overflow: hidden;
    height: 260px;
    margin: 0 auto 24px;
}

.m-recommendBox .recommendBox__list:before,
.m-recommendBox .recommendBox__list:after {
    display: table;
    content: "";
}

.m-recommendBox .recommendBox__list:after {
    clear: both;
}

.m-recommendBox .recommendBox__list li {
    float: left;
    width: 23%;
    margin: 10px;
}

.m-recommendBox .recommendBox__list li a {
    display: block;
    width: 100%;
    max-width: 147px;
    margin: 0 auto;
    text-align: center;
}

.m-recommendBox .recommendBox__list li img {
    width: 100%;
    padding: 5px 3px;
    border: 1px solid #ccc;
}

.m-recommendBox .recommendBox__list li b {
    display: block;
    overflow: hidden;
    width: 100%;
    height: 2.8em;
    margin: 0 auto;
    font-weight: normal;
    line-height: 1.4;
    text-align: left;
}

.m-recommendBox .recommendBox__img {
    display: table-cell;
    width: 147px;
    height: 200px;
    padding: 0 0 5px;
    vertical-align: middle;
}

/* ==========================================================================
    m-productsList
   ========================================================================== */
.m-productsList {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 50px;
}

.m-productsList .productsList__list {
    margin: 0 auto;
}

.m-productsList .productsList__list:before,
.m-productsList .productsList__list:after {
    display: table;
    content: "";
}

.m-productsList .productsList__list:after {
    clear: both;
}

.m-productsList .productsList__list.col-2 li {
    width: 50%;
}

.m-productsList .productsList__list.col-3 li {
    width: 33.3%;
}

.m-productsList .productsList__list.col-4 li {
    width: 25%;
}

.m-productsList .productsList__list.col-5 li {
    width: 20%;
}

.m-productsList .productsList__list.col-6 li {
    width: 16.6%;
}

.m-productsList .productsList__list.col-7 li {
    width: 14.2%;
}

.m-productsList .productsList__list.col-8 li {
    width: 12.5%;
}

.m-productsList .productsList__list.col-9 li {
    width: 11.1%;
}

.m-productsList .productsList__list.col-10 li {
    width: 10%;
}

.m-productsList .productsList__list.col-11 li {
    width: 9%;
}

.m-productsList .productsList__list.col-12 li {
    width: 8.3%;
}

.m-productsList .productsList__list.col-13 li {
    width: 7.6%;
}

.m-productsList .productsList__listItem {
    float: left;
    width: 10%;
    height: 241px;
}

.m-productsList .productsList__listItem a {
    display: block;
    width: 147px;
    margin: 0 auto;
    text-align: center;
}

.m-productsList .productsList__listItem img {
    margin: 0 0 5px;
}

.m-productsList .productsList__listItem b {
    display: block;
    overflow: hidden;
    width: 147px;
    height: 2.8em;
    margin: 0 auto;
    font-weight: normal;
    line-height: 1.4;
    text-align: left;
}

.m-productsList .productsList__listItem--more a {
    padding: 75px 0;
}

.m-productsList .productsList__listItem--more a img {
    width: 37px;
    height: 50px;
}

.m-productsList .productsList__listItem--more a b {
    color: #999;
    text-align: center;
}

.m-productsList .productsList__listItem--more a:hover {
    opacity: .7;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    text-decoration: none;
}

.m-productsList .productsList__img {
    display: table-cell;
    width: 147px;
    height: 200px;
    padding: 0 0 3px;
    vertical-align: middle;
}

.m-productsList .productsList__img img {
    max-width: 100%;
    max-height: 100%;
    margin: 0;
}

/* ==========================================================================
    m-notice
   ========================================================================== */
.m-notice .notice__caution {
    margin: 0 0 15px;
    text-align: center;
}

.m-notice .notice__caution p {
    display: inline-block;
    font-size: 15px;
    line-height: 17px;
}

.m-notice .notice__caution p span {
    color: #c00;
    font-weight: bold;
}

.m-notice .notice__caution p:first-child {
    margin: 0 30px 0 0;
    background: url("//p.dmm.com/p/mt_prime/ico_exclamation_red01.png") left center no-repeat;
    text-indent: 20px;
}

.m-notice .notice__topBtn {
    position: relative;
    margin: 0 0 15px;
}

.m-notice .notice__topBtn a {
    display: block;
    overflow: hidden;
    padding: 15px 10px 15px 30px;
    border-bottom-width: 4px;
    border-bottom-style: solid;
    border-radius: 5px;
}

.m-notice .notice__topBtn a:hover {
    position: relative;
    top: 2px;
    margin: 0 0 17px;
    border-bottom-width: 2px;
}

.m-notice .notice__topBtn.is-end a {
    padding: 15px 15px 15px 20px;
    border-bottom-color: #950020;
    background: #c00;
    color: #fff;
}

.m-notice .notice__topBtn.is-end .notice__link {
    padding: 10px 25px;
    border-left: 1px solid #fe666c;
    background: url("//p.dmm.com/p/mt_prime/ico_arrowWht_r01.png") right center no-repeat;
    font-weight: bold;
}

.m-notice .notice__topBtn.is-end .notice__link span {
    border-bottom: 1px solid #fff;
}

.m-notice .notice__topBtn.is-appeal a {
    padding: 10px 10px 10px 20px;
    border-bottom-color: #f5db46;
    background: #fff989;
    color: #333;
}

.m-notice .notice__topBtn.is-appeal a:hover {
    color: #c00;
}

.m-notice .notice__topBtn.is-appeal a:hover .notice__link {
    background-image: url("//p.dmm.com/p/mt_prime/ico_arrowRed_r02.png");
    color: #c00;
}

.m-notice .notice__topBtn.is-appeal a:hover .notice__link span {
    border-bottom-color: #c00;
}

.m-notice .notice__topBtn.is-appeal .notice__txt {
    padding: 0 0 0 40px;
    background: url("//p.dmm.com/p/mt_prime/ico_info_red01.png") left center no-repeat;
    font-size: 16px;
    font-weight: bold;
    line-height: 22px;
}

.m-notice .notice__topBtn.is-appeal .notice__txt span {
    color: #c00;
    font-size: 20px;
}

.m-notice .notice__topBtn.is-appeal .notice__link {
    padding: 0 25px;
    border-left: 1px solid #f6d962;
    background: url("//p.dmm.com/p/mt_prime/ico_arrowBlu_r02.png") right center no-repeat;
    color: #005fc0;
    font-weight: normal;
}

.m-notice .notice__topBtn.is-appeal .notice__link span {
    border-bottom: 1px solid #005fc0;
}

.m-notice .notice__middleBtn {
    position: relative;
    margin: 0 0 50px;
}

.m-notice .notice__middleBtn a {
    display: block;
    overflow: hidden;
    padding: 10px 10px 10px 30px;
    border-bottom-width: 4px;
    border-bottom-style: solid;
    border-radius: 5px;
}

.m-notice .notice__middleBtn a:hover {
    position: relative;
    top: 2px;
    margin: 0 0 52px;
    border-bottom-width: 2px;
}

.m-notice .notice__middleBtn.is-end a {
    border-bottom-color: #950020;
    background: #c00;
    color: #fff;
}

.m-notice .notice__middleBtn.is-end .notice__link {
    padding: 0 25px;
    border-left: 1px solid #fe666c;
    background: url("//p.dmm.com/p/mt_prime/ico_arrowWht_r01.png") right 10px center no-repeat;
}

.m-notice .notice__middleBtn.is-end .notice__link span {
    border-bottom: 1px solid #fff;
}

.m-notice .notice__middleBtn.is-appeal a {
    padding: 10px 10px 10px 20px;
    border-bottom-color: #f5db46;
    background: #fff989;
    color: #000;
}

.m-notice .notice__middleBtn.is-appeal a:hover {
    color: #c00;
}

.m-notice .notice__middleBtn.is-appeal a:hover .notice__link {
    background-image: url("//p.dmm.com/p/mt_prime/ico_arrowRed_r02.png");
    color: #c00;
}

.m-notice .notice__middleBtn.is-appeal a:hover .notice__link span {
    border-bottom-color: #c00;
}

.m-notice .notice__middleBtn.is-appeal .notice__txt {
    padding: 0 0 0 40px;
    background: url("//p.dmm.com/p/mt_prime/ico_info_red01.png") left center no-repeat;
    font-size: 16px;
    font-weight: bold;
    line-height: 22px;
}

.m-notice .notice__middleBtn.is-appeal .notice__txt span {
    color: #c00;
    font-size: 20px;
}

.m-notice .notice__middleBtn.is-appeal .notice__link {
    padding: 0 25px;
    border-left: 1px solid #f6d962;
    background: url("//p.dmm.com/p/mt_prime/ico_arrowBlu_r02.png") right center no-repeat;
    color: #005fc0;
    font-weight: normal;
}

.m-notice .notice__middleBtn.is-appeal .notice__link span {
    border-bottom: 1px solid #005fc0;
}

.m-notice .notice__txt {
    float: left;
    font-size: 14px;
}

.m-notice .notice__txt span {
    font-size: 18px;
    font-weight: bold;
}

.m-notice .notice__link {
    float: right;
    font-size: 16px;
    font-weight: bold;
}

.m-notice .notice__link span {
    display: inline-block;
    line-height: 1.5;
}

/*
    末端「今なら２週間無料！」の告知
 */
.m-noticeJoin {
    margin: 14px 0 0;
    padding: 20px 50px;
    border: 1px solid #cfcfcf;
    border-radius: 4px;
    background: #fffee1;
    text-align: center;
}
.m-noticeJoin + .products__wrap {
    margin-top: 14px;
}
.m-noticeJoin > * {
    display: inline-block;
}
.m-noticeJoin .m-noticeJoin__txt {
    margin-right: 8px;
    font-size: 18px;
    color: #ff8300;
}

/*
    「配信開始!」の告知
 */
.m-noticeWarn {
    margin-bottom: 12px;
    padding: 10px 0;
    border: 1px solid #e0160f;
    border-radius: 4px;
    text-align: center;
}
.m-noticeWarn .m-noticeWarn__txt {
    color: #e0160f;
    font-size: 14px;
    line-height: 1;
}
.m-noticeWarn .m-noticeWarn__txt.m-noticeWarn__txt--em {
    font-weight: bold;
}
.m-noticeWarn .m-noticeWarn__txt.m-noticeWarn__txt--sm {
    font-size: 12px;
}

/* ==========================================================================
    m-products
   ========================================================================== */
.m-tableBox {
    width: 100%;
    display: table;
}

.m-tableBox .tableBox__item {
    display: table-cell;
    vertical-align: top;
}

.m-tableBox .tableBox__item--main {
    padding-right: 22px;
}

.m-tableBox .tableBox__item--carousel {
    width: 155px;
}

.m-products {
    overflow: hidden;
    margin: 0 0 40px;
}

.m-products .products__heading {
    margin: 0 0 15px;
}

.m-products .products__heading h1 {
    margin: 0;
    font-weight: bold;
}

.m-products .products__wrap {
    display: table;
    width: 100%;
    background: #f5f5f5;
    border-collapse: separate;
    border-spacing: 0;
    vertical-align: top;
}
.m-products .products__item {
    position: relative;
    display: table-cell;
    padding: 16px;
    vertical-align: top;
}
.m-products .products__item--left {
    width: auto;
    border-radius: 4px 0 0 4px;
    border: 1px solid #cfcfcf;
    border-right: none;
}
.m-products .products__item--left:before {
    content: '';
    position: absolute;
    padding: 16px 0;
    top: 16px;
    right: 0;
    bottom: 16px;
    border-right: 1px dotted #cfcfcf;
}

.m-products .products__item--right {
    width: 226px;
    border-radius: 0 4px 4px 0;
    border: 1px solid #cfcfcf;
    border-left: none;
}

.m-products .products__img {
    display: table-cell;
    width: 90px;
    padding: 0 12px 0 0;
    vertical-align: top;
    text-align: center;
}
.m-products .products__img img {
    width: 90px;
    height: 122px;
}

.m-products .products__img a {
    display: inline-block;
    overflow: hidden;
}

/* イメージを拡大 */
.m-products .products__img > div {
    margin-bottom: 8px;
    line-height: 1;
}

/* 詳細を見る */
.m-products .products__img > p {
    margin-top: 8px;
    text-align: center;
}
.m-products .products__img > p a:hover {
    text-decoration: none;
}
.m-products .products__img > p a:hover:before {
    background: url(//p.dmm.co.jp/p/mt_prime/ico_arrowCirclePin.png);
}
.m-products .products__img > p a:before {
    content: '';
    display: inline-block;
    margin: 0 6px -3px 0;
    width: 16px;
    height: 16px;
    background: url(//p.dmm.co.jp/p/mt_prime/ico_arrowCircleBlu.png);
}

.m-products .products__txt {
    display: table-cell;
    overflow: hidden;
    vertical-align: top;
}

.m-products .products__txt p {
    margin: 10px 0 0;
    text-align: right;
}

.m-products .products__txt--rate {
    font-size: 12px;
}

.m-products .products__function {
    width: 100%;
    float: right;
}

.m-products .products__function .primeBtnWrapper {
    width: 100%;
}

.m-products .products__play {
    margin: 0 0 15px;
}

.m-products .products__play.is-win {
    margin: 0 0 20px;
    padding: 15px 0 0;
    border-top: 1px solid #666;
}

.m-products .products__play b {
    display: block;
    font-size: 14px;
}

.m-products .products__play b.products__guestTxt {
    margin: 0 0 5px;
    color: #ff8105;
    font-size: 18px;
    text-align: center;
}

.m-products .products__play small {
    display: block;
    font-size: 12px;
}

.m-products .products__play small a:before {
    margin: 0 5px 0 0;
    color: #ccc;
    content: "▶";
}

.m-products .products__play .primeBtnWrapper {
    margin: 0 0 7px;
}

.m-products .products__preRelease {
    margin: 0 0 30px;
}

.m-products .products__preRelease p {
    border-radius: 6px;
}

.m-products .products__favorite {
    margin: 0 0 15px;
    text-align: right;
}

.m-products .products__favorite__txt {
    position: relative;
    display: inline-block;
    margin-top: 8px;
    height: 14px;
    padding: 0 20px 0 0;
    font-size: 12px;
    line-height: 1;
    vertical-align: middle;
}

.m-products .products__favorite__txt:before {
    content: '';
    display: block;
    position: absolute;
    top: -2px;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 13px;
    height: 13px;
    background: url(//p.dmm.co.jp/p/monthly/common/ico/ico_arrow_dot.png) no-repeat right center;
    -webkit-transition: .1s linear transform;
    transition: .1s linear transform;
}

.m-products .products__favorite__txt:hover {
    text-decoration: none;
}

.m-products .products__favorite__txt:hover:before {
    transform: translateX(3px);
    background-image: url(//p.dmm.co.jp/p/monthly/common/ico/ico_arrow_dot_active.png);
}

.m-products .products__device {
    padding: 10px 12px;
    border-radius: 10px;
    background: #fff;
}

.m-products .products__device b {
    display: block;
    margin: 0 0 10px;
    font-size: 12px;
    font-weight: normal;
    line-height: 1;
    text-align: center;
}

.m-products .products__device ul {
    margin: 0 auto;
    width: 206px;
    font-size: 0;
}

.m-products .products__device li {
    display: inline-block;
    margin: 10px 10px 0 0;
    vertical-align: bottom;
}

.m-products .products__device li:nth-child(4n) {
    margin-right: 0;
}

.m-products .products__device li:nth-child(-n+4) {
    margin-top: 0;
}

.m-products .products__device .products__device_item_off {
    opacity: .1;
}

.m-products .products__device li img {
    width: 44px;
    height: 44px;
}
.m-products .products__device--notice {
    margin-top: 20px;
    text-decoration: underline;
    color: #C00;
    font-size: 10px;
    font-weight: bold;
}
.m-products .products__device--notice > a {
    color: inherit;
}
.m-products .products__device__text {
    font-size: 8px;
    color: #898a8c;
    margin: .7em 0 0;
}
/* ▼ ipad と silverlightプレイヤーのみ表示される再生ボタンパターン ▼ */
.m-products .products__playerTitle {
    margin-bottom: 11px;
    line-height: 1;
    font-size: 16px;
}

.m-products .products__playerSelect {
    margin-bottom: 20px;
}

.m-products .products__playerSelectBtn {
    margin-bottom: 7px;
}

.m-products .products__oldPlayer:before {
    content: '';
    display: inline-block;
    margin-right: 5px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 5px;
    border-color: transparent transparent transparent #007bff;
}

/*
  詳細情報パネル内定義のルールセット

  ipad時の動画再生ボタン・・・・・・・#nativePlayer_panel
  silverlight時の動画再生ボタン・・・#silverlight_panel
 */
.m-products #nativePlayer_panel ul,
.m-products #sliverlight_panel ul {
    overflow: hidden;
}

.m-products #nativePlayer_panel li,
.m-products #sliverlight_panel li {
    position: relative;
    float: left;
    margin: 0 4px 4px 0;
}

.m-products #nativePlayer_panel li:only-child a,
.m-products #nativePlayer_panel li:only-child,
.m-products #sliverlight_panel li:only-child a,
.m-products #sliverlight_panel li:only-child {
    width: 100%;
}

.m-products .prime-play-btn a,
.m-products .prime-play-btn a:visited,
.m-products .prime-play-btn a:link {
    display: inline-block;
    width: 49px;
    height: 34px;
    line-height: 34px;
    background: #fff;
    font-weight: normal;
    border-radius: 4px;
    border: 1px solid #cfcfcf;
    text-align: center;
    color: #575757;
    box-sizing: border-box;
}
.m-products .prime-play-btn a:hover {
    position: relative; /* IE11以下時の疑似要素表示バグ対策 */
    text-decoration: none;
    opacity: .6;
}

.m-products #nativePlayer_panel li:only-child a:before,
.m-products #sliverlight_panel li:only-child a:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 136px;
    height: 17px;
    background: url(//p.dmm.co.jp/p/monthly/common/ico/ico_play.png) no-repeat left #fff;
}

.m-products #nativePlayer_panel li:only-child a:after,
.m-products #sliverlight_panel li:only-child a:after {
    content: '再生';
    position: relative;
    color: #575757;
    font-size: 14px;
    background: #fff;
}
/* ▲ ipad と silverlightプレイヤーのみ表示される再生ボタンパターン ▲ */

/* ==========================================================================
    m-episodeList
   ========================================================================== */
.m-episodeList .episodeList__controller {
    margin: 0 0 15px;
    padding: 7px 10px 7px 20px;
    background: #eeeced;
}

.m-episodeList .episodeList__controller:before,
.m-episodeList .episodeList__controller:after {
    display: table;
    content: "";
}

.m-episodeList .episodeList__controller:after {
    clear: both;
}

.m-episodeList .episodeList__check {
    position: relative;
    float: left;
    border: 1px solid #bbb;
    border-radius: 5px;
    background: #fff;
    font-size: 13px;
    line-height: 29px;
}

.m-episodeList .episodeList__check label {
    display: block;
    overflow: hidden;
    height: 29px;
    padding: 0 5px 0 23px;
    background: url("//p.dmm.com/p/mt_prime/ico_checkbox_off.png") 8px 9px no-repeat;
    cursor: pointer;
}

.m-episodeList .episodeList__check label.is-current {
    background: url("//p.dmm.com/p/mt_prime/ico_checkbox_on.png") 8px 7px no-repeat;
}

.m-episodeList .episodeList__check input {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border: none;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.m-episodeList .episodeList__sort {
    float: right;
    font-size: 15px;
    line-height: 32px;
    vertical-align: middle;
}

.m-episodeList .episodeList__sort .sort__txt {
    display: inline-block;
    line-height: 32px;
    vertical-align: top;
}

.m-episodeList .episodeList__sort .sort__wrap {
    display: inline-block;
    position: relative;
    overflow: hidden;
    width: 115px;
    border: 1px solid #bbb;
    border-radius: 5px;
    background: #fff url("//p.dmm.com/p/mt_prime/ico_arrowBlk_b01.png") 95px center no-repeat;
    vertical-align: top;
}

.m-episodeList .episodeList__sort .sort__wrap select {
    display: block;
    width: 155%;
    padding: 5px 40px 5px 15px;
    border: none;
    background: transparent;
    font-size: 13px;
    text-align: left;
    cursor: pointer;
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
}

.m-episodeList .episodeList__notice {
    margin: 0 0 15px;
    padding: 0 0 0 10px;
    color: #c00;
    font-size: 14px;
    font-weight: bold;
}

.m-episodeList .episodeList__list {
    padding: 0 0 0 10px;
}

.m-episodeList .episodeList__listItem {
    padding: 7px 10px 7px 0;
    border-bottom: 1px dashed #000;
}

.m-episodeList .episodeList__listItem > div {
    display: table;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 2.8em;
}

.m-episodeList .episodeList__listItem b {
    display: table-cell;
    width: 40%;
    padding: 0 30px 0 50px;
    vertical-align: middle;
}

.m-episodeList .episodeList__listItem b a {
    font-size: 14px;
    font-weight: bold;
}

.m-episodeList .episodeList__listItem p {
    display: table-cell;
    width: 60%;
    line-height: 1.8;
    vertical-align: middle;
}

.m-episodeList .episodeList__listItem.is-single span {
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 40px;
    margin: -11px 0 0;
    padding: 2px 0;
    background: #c00;
    color: #fff;
    line-height: 18px;
    text-align: center;
}

.m-episodeList .episodeList__listItem.is-prime span {
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 40px;
    margin: -11px 0 0;
    padding: 2px 0;
    background: #355bff;
    color: #fff;
    font-size: 11px;
    line-height: 18px;
    text-align: center;
}

/* ==========================================================================
    m-detailProductsList
   ========================================================================== */
.m-detailProductsList .detailProductsList__wrap {
    display: block;
    width: 100%;
    margin: 0 -22px 0 0;
}

/* 末端 d-carousel.jsによるカルーセルを2カラムにする */
@media only screen and (min-width: 1040px) {
    .m-detailProductsList .d-boxslidelist {
        margin-bottom: 0 !important;
    }

    /* monthlyとsingleが横並びになった時、縦幅を揃えるため */
    .detailProductsList__inner.detailProductsList__inner--monthly .d-boxslidelist {
        height: 182px !important;
    }
    .m-detailProductsList .detailProductsList__listItem--more a {
        padding: 45px 0 !important;
    }

    .m-detailProductsList .detailProductsList__wrap {
        display: table;
        width: 100%;
    }

    .m-detailProductsList .detailProductsList__wrap > *:first-child {
        padding-right: 10px;
    }

    .m-detailProductsList .detailProductsList__wrap > *:last-child {
        padding-left: 10px;
    }

    .m-detailProductsList .detailProductsList__wrap > * {
        display: table-cell;
        width: 50%;
    }
}

.m-detailProductsList .detailProductsList__inner--monthly h3 {
    background: #355bff;
}

.m-detailProductsList .detailProductsList__inner--monthly .detailProductsList__heading:after {
    border-color: #355bff;
}

.m-detailProductsList .detailProductsList__inner--single h3 {
    background: #c00;
}

.m-detailProductsList .detailProductsList__inner--single .detailProductsList__heading:after {
    border-color: #c00;
}

.m-detailProductsList .detailProductsList__inner--single .single__ico {
    position: absolute;
    top: 0;
    left: 0;
    width: 35%;
}

.m-detailProductsList .detailProductsList__heading {
    position: relative;
    height: 18px;
    margin: 0 0 10px 0;
}

.m-detailProductsList .detailProductsList__heading:before {
    display: table;
    content: "";
}

.m-detailProductsList .detailProductsList__heading:after {
    position: absolute;
    z-index: 1;
    top: 16px;
    left: 0;
    clear: both;
    width: 100%;
    height: 0;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    content: "";
}

.m-detailProductsList .detailProductsList__heading h3 {
    float: left;
    margin: 0 7px 0 0;
    padding: 0 3px;
    color: #fff;
    font-size: 12px;
    font-weight: normal;
    line-height: 16px;
}

/*「もっと見る」のテキスト + 矢印 */
.m-detailProductsList .detailProductsList__heading a {
    float: right;
    position: relative;
    margin-top: -2px;
    padding-right: 18px;
    background: #fff;
    font-size: 12px;
    line-height: 16px;
}

.m-detailProductsList .detailProductsList__heading a:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 13px;
    height: 13px;
    background: url(//p.dmm.co.jp/p/monthly/common/ico/ico_arrow_dot.png) no-repeat right center;
    -webkit-transition: .1s linear transform;
    transition: .1s linear transform;
}

.m-detailProductsList .detailProductsList__heading a:hover {
    text-decoration: none;
}

.m-detailProductsList .detailProductsList__heading a:hover:before {
    transform: translateX(3px);
    background-image: url(//p.dmm.co.jp/p/monthly/common/ico/ico_arrow_dot_active.png);
}

/* ==========================================================================
    m-detail
   ========================================================================== */
.m-detail {
    padding: 0 10px;
}

.m-detail .detail__heading {
    overflow: hidden;
    margin: 0 0 5px;
}

.m-detail .detail__heading h3 {
    float: left;
    margin: 0 10px 0 0;
    font-size: 16px;
    font-weight: bold;
    line-height: 20px;
}

.m-detail .detail__heading p {
    float: left;
    line-height: 20px;
}

.m-detail .detail__item {
    margin: 0 0 40px;
}

.m-sample .sample__list:before,
.m-sample .sample__list:after {
    display: table;
    content: "";
}

.m-sample .sample__list:after {
    clear: both;
}

.m-sample .sample__listItem {
    float: left;
    margin: 5px 10px 5px 0;
}

.m-sample .sample__listItem a {
    display: inline-block;
    overflow: visible;
}

.m-sample .sample__listItem a[name] img {
    z-index: 1;
    transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1);
    transition: transform .3s cubic-bezier(.215, .61, .355, 1);
}

.m-sample .sample__listItem a[name] img:hover {
    z-index: 2;
    -webkit-transform: scale(1.2, 1.2);
    -ms-transform: scale(1.2, 1.2);
    transform: scale(1.2, 1.2);
}

.m-sample .sample__listItem a[name] img:hover:not(:target) {
    -webkit-transform: scale(1) \9;
    -ms-transform: scale(1) \9;
    transform: scale(1) \9;
}

.m-sample .sample__noScript {
    margin: 15px 0 0;
}

.m-sample .sample__noScript p {
    margin: 0 0 5px;
    color: #c00;
    font-size: 14px;
}

.m-sample .sample__noScript a:before {
    margin: 0 3px 0 0;
    color: #ccc;
    content: "▶";
}

.m-sample .sample__modal {
    width: 100%;
    background: #fff;
    text-align: center;
}

.m-sample .sample__modal .cont-smplex {
    margin: 0 auto;
    border: 1px #666 solid;
}

.m-sample .sample__modal .cont-smplex div {
    padding: 10px;
    background: #fff;
}

.m-sample .sample__modal .cont-smplex div img {
    cursor: pointer;
}

.m-sample .sample__modal .cont-smplex div p {
    margin: 6px 0 0;
    padding: 0;
}

.m-sample .sample__modal .cont-smplex div p.pic-capt {
    margin: 0 0 6px;
    text-align: left;
}

.m-sample .sample__modal .cont-smplex div a {
    display: inline-block;
    overflow: hidden;
}

.m-sample .sample__modal .cont-smplex div.bt-smplex {
    width: 12em;
    margin: 10px auto 0;
    padding: 0;
}

.m-sample .sample__modal .cont-smplex div.bt-smplex ul {
    overflow: hidden;
    height: 1.5em;
    margin: 0;
    padding: 0;
}

.m-sample .sample__modal .cont-smplex div.bt-smplex li {
    float: left;
    width: 4em;
    margin: 0;
    padding: 0;
}

/* m-comment */
.m-comment .comment__txt {
    margin: 0 0 25px;
    line-height: 1.6;
}

.m-comment .comment__special {
    padding: 0 0 0 25px;
}

.m-comment .comment__special th {
    width: 3em;
    padding: 0 10px 0 0;
    vertical-align: top;
}

.m-comment .comment__special td li {
    margin: 4px 0 0;
}

.m-comment .comment__special td li:first-child {
    margin: 0;
}

/* m-info */
.m-info {
    position: relative;
}

.m-info .info__table {
    width: 100%;
}

.m-info .info__table th {
    width: 60px;
    vertical-align: top;
}

.m-info .info__triggerActor {
    white-space: nowrap;
}

/* ==========================================================================
    m-review
   ========================================================================== */
.m-review .review__heading {
    margin: 0 0 5px;
}

.m-review .review__heading h2 {
    font-size: 18px;
    font-weight: bold;
}

.m-review #review {
    margin-top: 0;
}

/* ==========================================================================
    m-recommend
   ========================================================================== */
.m-recommend {
    margin: 0 0 50px;
    padding: 0 10px;
}

.m-recommend .recommend__heading {
    margin: 0 0 5px;
}

.m-recommend .recommend__heading h2 {
    font-size: 18px;
    font-weight: bold;
}

.m-recommendList {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 50px;
}

/* ==========================================================================
    d-boxslidelist
    d-carousel.js共通CSS
   ========================================================================== */
.d-boxslidelist > ul {
    margin: 0 auto;
}

.d-boxslidelist > ul:before,
.d-boxslidelist > ul:after {
    display: table;
    content: "";
}

.d-boxslidelist > ul:after {
    clear: both;
}

.d-boxslidelist > ul.col-2 li {
    width: 50%;
}

.d-boxslidelist > ul.col-3 li {
    width: 33.3%;
}
.d-boxslidelist > ul.col-4 li {
    width: 25%;
}
.d-boxslidelist > ul.col-5 li {
    width: 20%;
}
.d-boxslidelist > ul.col-6 li {
    width: 16.6%;
}
.d-boxslidelist > ul.col-7 li {
    width: 14.2%;
}
.d-boxslidelist > ul.col-8 li {
    width: 12.5%;
}
.d-boxslidelist > ul.col-9 li {
    width: 11.1%;
}
.d-boxslidelist > ul.col-10 li {
    width: 10%;
}
.d-boxslidelist > ul.col-11 li {
    width: 9%;
}
.d-boxslidelist > ul.col-12 li {
    width: 8.3%;
}
.d-boxslidelist > ul.col-13 li {
    width: 7.6%;
}

.d-boxslidelist > ul > li {
    float: left;
    width: 10%;
}

.d-boxslidelist li a {
    display: block;
    margin: 0 auto;
    text-align: center;
}

.l-monthlyPrime.is-com .d-boxslidelist img {
    margin: 0;
}

.l-monthlyPrime.is-r18 .d-boxslidelist img {
    margin: 0 0 5px;
}

.d-boxslidelist b {
    display: block;
    overflow: hidden;
    height: 2.8em;
    margin: 0 auto;
    font-weight: normal;
    line-height: 1.4;
    text-align: left;
}

/* 配信開始リストの画像の調整用に追記 */
.page-monthly .d-area .d-boxslidelist li img {
    padding-bottom: 3.6em;
}

/* d-carousel.jsのloading機能　なくても良いためdisplay: none */
.d-boxslidelist .loading {
    display: none;
}

/*
    .m-recommendList 末端最下部の「最近チェックした商品」のclass
    .m-detailProductsList__carousel 末端 「見放題作品」「単品作品」のclass
    カルーセル種類別のCSS
 */
/*　最近チェックした商品　*/
.m-recommendList .recommendList__listItem {
    height: 241px;
}
.m-recommendList .recommendList__listItem a,
.m-recommendList .recommendList__listItem b {
    width: 147px;
}
.m-recommendList .recommendList__img {
    display: table-cell;
    width: 147px;
    height: 200px;
    padding: 0 0 3px;
    vertical-align: middle;
}
.m-recommendList .recommendList__img img {
    max-width: 100%;
    margin: 0;
}
.m-recommendList .recommendList__img {
    display: table-cell;
    width: 90px;
    height: 122px;
    padding: 0 0 3px;
    vertical-align: middle;
}

.l-monthlyPrime.is-com .m-recommendList .recommendList__listItem img {
    margin-bottom: 2px;
    padding: 3px;
    border: 1px solid #ccc;
}

/*　「見放題作品」「単品作品」　*/
.m-detailProductsList .detailProductsList__listItem {
    width: 90px;
}
.detailProductsList__inner.detailProductsList__inner--monthly .d-boxslidelist {
    height: 161px;
}
/* 値段のpタグがあるため、monthlyとheightが違う */
.detailProductsList__inner.detailProductsList__inner--single .d-boxslidelist {
    height: 182px;
}
.m-detailProductsList .detailProductsList__listItem a {
    position: relative;
}
.m-detailProductsList .detailProductsList__listItem a,
.m-detailProductsList .detailProductsList__listItem b {
    width: 90px;
}
.m-detailProductsList .detailProductsList__listItem p {
    color: #c00;
    text-align: left;
}

/* もっと見る */
.m-detailProductsList .detailProductsList__listItem--more a {
    padding: 35px 0;
}
.m-detailProductsList .detailProductsList__inner.detailProductsList__inner--single .detailProductsList__listItem--more a {
    padding: 45px 0;
}

.m-detailProductsList .detailProductsList__listItem--more a img {
    width: 37px;
    height: 50px;
}

.m-detailProductsList .detailProductsList__listItem--more a b {
    color: #999;
    text-align: center;
}

.m-detailProductsList .detailProductsList__listItem--more a:hover {
    opacity: .7;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    text-decoration: none;
}

/* モーダル */
.date-modal-available .m-modal {
    display: none;
}

.m-modal {
    z-index: 1501;
    box-sizing: border-box;
    border: 1px solid #333;
    border-radius: 5px;
    background: #fff;
}

.modal__layer {
    position: absolute;
    z-index: 1500;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(200, 200, 200, .4);
}

.modal__content {
    box-sizing: border-box;
    padding: 10px 15px 15px;
    border-radius: 5px;
    background: #fff;
    text-align: center;
}

.modal__content b {
    display: block;
    margin: 0 0 10px;
    font-size: 14px;
}

.modal__list {
    display: inline-block;
    list-style: none;
    overflow: hidden;
}

.modal__listItem {
    float: left;
    margin: 0 10px 10px 0;
}

.modal__listItem:nth-child(5n+1) {
    clear: both;
}

.modal__btn--close {
    position: absolute;
    top: -15px;
    right: -13px;
    padding: 9px;
    border: 1px #333 solid;
    border-radius: 50%;
    background: #fff;
    line-height: 1;
}

/*
    slick.js ライブラリCSS
 */
.slick-slider {
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
     user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}
.slick-list {
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus {
    outline: none;
}
.slick-list.dragging {
    cursor: pointer;
    cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
}
.slick-track {
    position: relative;
    top: 0;
    left: 0;

    display: block;
}
.slick-track:before,
.slick-track:after {
    display: table;

    content: '';
}
.slick-track:after {
    clear: both;
}
.slick-loading .slick-track {
    visibility: hidden;
}
.slick-slide {
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide {
    float: right;
}
.slick-slide img {
    display: block;
}
.slick-slide.slick-loading img {
    display: none;
}
.slick-slide.dragging img {
    pointer-events: none;
}
.slick-initialized .slick-slide {
    display: block;
}
.slick-loading .slick-slide {
    visibility: hidden;
}
.slick-vertical .slick-slide {
    display: block;
    height: auto;
}
.slick-arrow.slick-hidden {
    display: none;
}

/* ==========================================================================
    末端動画Player
   ========================================================================== */
/*　HTML5プレイヤーの枠　*/
.bx-detail-player {
    position: relative;
    width: 100%;
    height: 460px;
}
.bx-detail-player #container {
    min-width: inherit;
    min-height: inherit;
}

/*
    Player下テキスト
 */
.bx-detail-player-sub {
    margin-bottom: 4px;
    text-align: right;
}
.bx-detail-player-sub .tx-oldPlayerPlay {
    margin: 3px 0;
    font-size: 10px;
}

/*
    先頭に三角形のアイコンが付くテキスト
    ▶ ~~~
 */
.dgm-tx-icoHeadArrow:before {
    content: '';
    display: inline-block;
    margin-right: 5px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 5px;
    border-color: transparent transparent transparent #007bff;
}
.dgm-tx-icoHeadArrow:hover:before {
    border-color: transparent transparent transparent #df0331;
}

/*
    プレイヤーサイズ
 */
@media screen and (max-width:1365px) {
    .bx-detail-player {
        height: 460px;
    }
}
@media screen and (min-width:1366px) and (max-width:1535px) {
    .bx-detail-player {
        height: 510px;
    }
}
@media screen and (min-width:1536px) {
    .bx-detail-player {
        height: 600px;
    }
}

/*
    縦カルーセル
    月額動画 商品末端で共通
 */
.dgm-verticalCarousel {
    border: 2px solid #cfcfcf;
    border-radius: 4px;
}

 /* 縦カルーセル ヘッダー部分 */
.dgm-verticalCarousel .dgm-bx-verticalCarousel-header {
    padding: 8px 0 1px;
    border-bottom: 1px solid #cfcfcf;
}

/* タイトル */
.dgm-verticalCarousel .dgm-ttl-verticalCarousel {
    margin-bottom: 6px;
    font-size: 14px;
    color: #575757;
    text-align: center;
    line-height: 1;
}

/* ナビゲーション */
.dgm-verticalCarousel .dgm-bx-verticalCarousel-nav {
    text-align: center;
}
.dgm-verticalCarousel .dgm-bx-verticalCarousel-nav span {
    position: relative;
    display: inline-block;
    margin-right: 4px;
    width: 62px;
    height: 15px;
    cursor: pointer;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    background: #f2f4f7;
}
.dgm-verticalCarousel .dgm-bx-verticalCarousel-nav span:last-child {
    margin-right: 0;
}
.dgm-verticalCarousel .dgm-bx-verticalCarousel-nav span:before {
    content: '';
    display: block;
    position: absolute;
    margin: auto;
    width: 12px;
    height: 9px;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-repeat: no-repeat;
}
.dgm-verticalCarousel .dgm-bx-verticalCarousel-nav .dgm-ico-verticalCarousel-prev:before {
    background: url(//p.dmm.co.jp/p/monthly/detail/ico_vertical_carousel_tp.png);
}
.dgm-verticalCarousel .dgm-bx-verticalCarousel-nav .dgm-ico-verticalCarousel-next:before {
    top: 1px;
    background: url(//p.dmm.co.jp/p/monthly/detail/ico_vertical_carousel_bt.png);
}
.dgm-verticalCarousel .dgm-bx-verticalCarousel-nav .dgm-ico-verticalCarousel-prev:hover:before {
    background: url(//p.dmm.co.jp/p/monthly/detail/ico_vertical_carousel_tp_active.png);
}
.dgm-verticalCarousel .dgm-bx-verticalCarousel-nav .dgm-ico-verticalCarousel-next:hover:before {
    background: url(//p.dmm.co.jp/p/monthly/detail/ico_vertical_carousel_bt_active.png);
}

/* 末尾の要素のborder-bottomを見えないようにする */
.dgm-bx-verticalCarousel-content {
    margin-bottom: -1px;
}
.dgm-verticalCarousel .dgm-item-verticalCarousel {
    padding: 10px 0;
    border-bottom: 1px dotted #cfcfcf;
}
.dgm-verticalCarousel .dgm-item-verticalCarousel a {
    outline: none;
}
.dgm-verticalCarousel .dgm-item-verticalCarousel a:hover {
    text-decoration: none;
}
.dgm-verticalCarousel .dgm-item-verticalCarousel a:hover img {
    opacity: .8;
}
.dgm-verticalCarousel .dgm-bx-verticalCarouselImg {
    margin-bottom: 10px;
}
/* 素人の100 x 100も90 x 122内におさめる */
.dgm-verticalCarousel .dgm-bx-verticalCarouselImg {
    position: relative;
    margin: 0 auto 10px;
    width: 90px;
    height: 122px;
}
.dgm-verticalCarousel .dgm-bx-verticalCarouselImg img {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 100%;
    height: auto;
}
.dgm-verticalCarousel .dgm-bx-verticalCarouselInfo {
    height: 30px;
    padding: 0 12px;
    overflow: hidden;
    line-height: 1.3;
}
.dgm-verticalCarousel .dgm-bx-verticalCarouselInfo p {
    margin: 0;
    font-size: 12px;
}

/* 縦カルーセルボーダー追加 */
.l-monthlyPrime.is-com .dgm-verticalCarousel .dgm-bx-verticalCarouselImg {
    border: 1px solid #ccc;
}

.l-monthlyPrime.is-com .dgm-verticalCarousel .dgm-bx-verticalCarouselImg img {
    box-sizing: border-box;
    padding: 3px;
}

/*
    HTML5 Player再生ボタンとパッケージ画像
    月額動画 商品末端で共通
 */
.dgm-playerCover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.dgm-playerCover .dgm-inner-playerCover {
    position: relative;
    width: 100%;
    height: 100%;
}

/* 状態変更 */
.dgm-playerCover.is-inactive {
    display: none;
}
/* 中央に再生マーク */
.dgm-playerCover.is-play .dgm-btn-playerCover.dgm-btn-playerCover--replay {
    display: none;
}
/* 中央にリプレイマーク */
.dgm-playerCover.is-replay .dgm-btn-playerCover.dgm-btn-playerCover--play {
    display: none;
}
.dgm-playerCover.is-replay .dgm-bx-playerCoverPic,
.dgm-playerCover.is-replay .dgm-bx-playerCoverTx {
    display: none;
}

/* パッケージ画像 */
.dgm-playerCover .dgm-bx-playerCoverPic {
    width: 100%;
    height: 100%;
    background: #000;
    font-size: 0;
    text-align: center;
}
.dgm-playerCover .dgm-bx-playerCoverPic:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}
.dgm-playerCover .dgm-bx-playerCoverPic img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    vertical-align: middle;
}

/* パッケージ画像がなくテキストが入る場合 */
.dgm-playerCover .dgm-bx-playerCoverTx {
    display: table;
    width: 100%;
    height: 100%;
    background: #000;
    text-align: center;
}
.dgm-playerCover .dgm-inner-playerCoverTx {
    display: table-cell;
    vertical-align: middle;
}
.dgm-playerCover .dgm-inner-playerCoverTx p {
    margin-bottom: 15px;
    font-size: 24px;
    color: #fff;
}
.dgm-playerCover .dgm-inner-playerCoverTx p:last-child {
    margin-bottom: 0;
}

/* 再生ボタン */
.dgm-wrap-playerCoverBtn {
    width: 100%;
    height: 100%;
}
.dgm-wrap-playerCoverBtn .dgm-btn-playerCover {
    position: absolute;
    width: 136px;
    height: 136px;
    top: 0;
    bottom: 66px;
    right: 0;
    left: 0;
    margin: auto;
    cursor: pointer;
}
/* 再生ボタン周りのローディング */
.dgm-btn-playerCover.dgm-btn-playerCover--loading img {
    animation: spin 1.3s linear infinite;
}