@charset "UTF-8";
/*----------------------------------------------------
	リセット
----------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline;
}
html {
    line-height: 1;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    height: 100%;
}
ol, ul {
    list-style: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
caption, th, td {
    text-align: left;
    font-weight: normal;
    vertical-align: middle;
}
q, blockquote {
    quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after {
    content: "";
    content: none;
}
a img {
    border: none;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
    display: block;
}

/* 印刷禁止 */
@media print {
    body { display: none !important}
}
/* 右クリック禁止 */
img {
    pointer-events: none;
}

/*----------------------------------------------------
	共通
----------------------------------------------------*/
html {
    overflow-y: scroll;
/* スクロールバーの有無によるズレ対策 */
}

html, body {
    height: 100%;
}

body {
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6;
    color: #fff;
}
a {
    text-decoration: none;
    color: #395dcf;
}
a:hover {
    text-decoration: none;
    opacity: 0.65;
    filter: alpha(opacity=65);
    zoom: 1;
}
.to {
    font-size: 0;
    line-height: 0;
    overflow: hidden;
    white-space: nowrap;
    text-indent: 200%;
}
.clearfix {
    overflow: hidden;
    *zoom: 1;
}

.sp-br {
    display: none;
}
.staff-br{
    display: none;
}
/* 共通
----------------------------------------------------*/

.section_inner{
    padding: 100px 0;
    max-width: 960px;
    margin: 0 auto;
}
.section_title{
    margin: 0 auto 80px;
    transform: rotate(-5deg);
}
.section_subtitle{
    color: #ededed;
    font-size: 2.625rem; /*42px*/
    text-align: center;
    margin-bottom: 80px;
    position: relative;
    font-family: 'Noto Serif JP', serif;
    font-weight: 700;
}
.section_subtitle::after{
    content: "";
    display: block;
    background: #de007d;
    width: 30px;
    height: 2px;
    position: absolute;
    left: 50%;
    bottom: -10px;
    margin-left: -15px;
}
.content_list{
    margin-bottom: 30px;
}
.content_list dt{
    font-size: 1rem; /*16px*/
    font-weight: 700;
    color: #de007d;
    padding-bottom: 5px;
    border-bottom: solid 1px #de007d;
    margin-bottom: 20px;
}
.content_list dd{
    font-size: 1rem; /*16px*/
    padding-left: 1.5em;
    position: relative;
}
.content_list dd::before{
    content: "ー";
    color: #de007d;
    position: absolute;
    left: 0;
}

/* ジャニーズ対応 */
.img_blank{
    background: url(../images/img_blank.png);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
/* ヘッダー
----------------------------------------------------*/
.header{
    background: #fff;
    padding: 120px 0 100px;
}
.h1_logo{
    width: 100%;
    padding-bottom: 60px;
}
.h1_logo img{
    width: 100%;
}
.header .release_txt{
    background: #fff;
    padding: 20px 0 10px;
    width: 540px;
    margin: 0 auto;
}
.header .release_txt img{
    width: 100%;
}

/* ナビゲーション
----------------------------------------------------*/
.nav{
    background: #e3007f;
    padding: 0 1%;
}
.nav .nav_inner{
    width: 100%;
    max-width: 650px;
    text-align: center;
    margin: 0 auto;
    padding: 8px 0;
    display: flex;
    flex-wrap: wrap;
}
.nav .nav_inner li{
    width: 24%;
    margin: 0 .5%;
    background: linear-gradient(#f661a9, #e82a95);
}
.nav .nav_inner li:last-child{
    margin-right: 0;
}
.nav .nav_inner li a{
    display: block;
    padding: 33px 0 18px;
    position: relative;
    width: 100%;
    height: auto;
}
.nav .nav_inner li.nav_bddvd img{
    width: 78.8%;
    max-width: 134px;
}
.nav .nav_inner li.nav_intro img{
    width: 72.94%;
    max-width: 124px;
}
.nav .nav_inner li.nav_cast img{
    width: 35.29%;
    max-width: 60px;
}
.nav .nav_inner li.nav_staff img{
    width: 43.52%;
    max-width: 74px;
}
.nav .nav_inner li:hover{
    background: linear-gradient(#e82a95 ,#f661a9);
}

/* 装飾の写真
----------------------------------------------------*/
.loop_wrap {
    display: flex;
    width: 100%;
    height: 138px;
    overflow: hidden;
  }
  .screen{
    min-width: 1240px;
    height: 138px;
  }
  .loop_wrap .photo_l{
    background: url(../images/screen01.jpg) top left repeat-x;
    background-size: cover;
    animation: loop_l 20s linear infinite;
  }
  .loop_wrap .photo_r{
    background: url(../images/screen01.jpg) top left repeat-x;
    background-size: cover;
    animation: loop_r 20s linear infinite;
  }
  @keyframes loop_l {
    0% {
      transform: translateX(0);
    }
    to {
      transform: translateX(-1240px);
    }
  }
  @keyframes loop_r {
    0% {
      transform: translateX(-1240px);
    }
    to {
      transform: translateX(0);
    }
  }

/* MOVIE
----------------------------------------------------*/
.movie{
    background: rgba( 45,45,45,0.3 );
}
.movie .movie_title{
    width: 41.73%; /* 313/750 */
    max-width: 313px;
}
.movie_title img{
    width: 100%;
}
.movie .movie_box{
    width: 83.33%;
    max-width: 800px;
    margin: 0 auto;
    position: relative;
}
.movie .movie_frame {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 56.25%;
    margin: 0 auto;
    overflow: hidden;
}
.movie .movie_frame iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Blu-ray&DVD 商品情報
----------------------------------------------------*/
.bddvd{
    background: url(../images/filter.png);
}
.bddvd::before{
    background: url(../images/header_bg.png) no-repeat center top;
    display: block;
    position: fixed;
    background-size: cover;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: -1;
}
.bddvd_title{
    width: 55.33%; /* 415/750 */
    max-width: 415px;
}
.bddvd_title img{
    width: 100%;
}

.bddvd #special.contents_inner{
    background: rgba( 45,45,45,0.8 );
    padding-top: 80px;
    margin-bottom: 100px;
}
.bddvd #normal.contents_inner{
    background: rgba( 45,45,45,0.7 );
    padding-top: 80px;
    margin-bottom: 40px;
}
.disc_box {
    padding: 0 40px;
}
/* ジャケ写*/
.disc_box .disc_img{
    width: 36.36%;
    max-width: 320px;
    float: left;
    margin-bottom: 80px;
}

.bd_jk{
    background: url(../images/bd_jk.jpg) no-repeat center;
    padding-top: 141.875%;
    position: relative;
    background-size: contain;
    margin-bottom: 30px;
}
.dvd_jk{
    background: url(../images/dvd_jk.jpg) no-repeat center;
    padding-top: 141.875%;
    position: relative;
    background-size: contain;
    margin-bottom: 30px;
}
.bd_tenkai{
    background: url(../images/tenkai.png) no-repeat center;
    padding-top: 100%;
    position: relative;
    background-size: contain;
}
.dvd_tenkai{
    background: url(../images/tenkai.png) no-repeat center;
    padding-top: 100%;
    position: relative;
    background-size: contain;
}

.disc_box .disc_txt{
    float: left;
    margin-left: 3%;
    width: 60.22%;
    font-size: 1rem; /*16px*/
}
.disc_box .disc_txt h4{
    box-sizing: border-box;
    display: inline-block;
    margin-bottom: 20px;
    color: #de007d;
    font-size: 1.75rem; /*28px*/
    font-weight: 700;
}
.disc_box .disc_txt .disc_txt_price{
    font-size: 1.5rem; /*24px*/
    margin-bottom: 20px;
}
.disc_box .disc_txt .content_list dd{
    padding-left: 0em;
}
.disc_box .disc_txt .content_list dd::before{
    display: none;
}

.disc_box .disc_txt .btn_buy{
    border: solid 1px #de007d;
    padding: 3px;
    margin-bottom: 30px;
}
.disc_box .disc_txt .btn_buy a{
    display: inline-block;
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    background: #de007d;
    text-align: center;
    font-size: 1.5rem;/*24px*/
    letter-spacing: 1px;
    color: #fff;
}
/* アフェリエイト */
.affiliate li img { display: none;}
.disc_box .disc_txt .affiliate{
    margin-bottom: 80px;
    display: flex;
    flex-wrap: wrap;
}
.disc_box .disc_txt .affiliate li{
    margin-right: 1%;
    width: 32.66%;
    height: auto;
}
.disc_box .disc_txt .affiliate li:nth-child(3n){
    margin-right: 0;
}
.disc_box .disc_txt .affiliate li a{
    width: 100%;
    height:  0;
    padding-top: 46.666%;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center center;
    box-sizing: border-box;
    border: solid 1px #de007d;
	overflow: hidden;
}
.amazon a {
    background: url(../images/af/btn_amazon.gif) #ffffff;
    background-size: 80%;
}
.tower a {
    background: url(../images/af/btn_tower.gif) #fdd100;
    background-size: 80%;
}
.seven a {
    background: url(../images/af/btn_seven.gif) #ffffff;
    background-size: 80%;
}
.hmv a {
    background: url(../images/af/btn_hmv.gif) #ffffff;
    background-size: 80%;
}
.tsutaya a {
    background: url(../images/af/btn_tsutaya.gif) #ffffff;
    background-size: 80%;
}
.rakuten a {
    background: url(../images/af/btn_rakuten.gif) #ffffff;
    background-size: 80%;
}
.disc_tokuten{
    position: relative;
    background: rgba( 222,0,125,0.2 );
    padding: 90px 40px 40px;
}
.disc_tokuten h5{
    position: absolute;
    top: 0;
    left: 0;
    background: #de007d;
    padding: 4px 40px;
    font-size: 1.75rem;/*28px*/
    font-weight: 700;
}
.bddvd .note{
    font-size: 0.875rem;/*14px*/
    margin-bottom: 40px;
}
.bddvd .rental_txt{
    text-align: center;
    font-size: 2rem;/*30px*/
    font-weight: 700;
    color: #fff;
}

/* INTRODUCTION イントロダクション
----------------------------------------------------*/
.intro{
    background: #de007d;
    font-family: 'Noto Sans JP', sans-serif;
}
.intro .intro_inner{
    padding-top: 100px;
    padding-bottom: 100px;
}
.intro_title{
    width: 70.9%;
    max-width: 532px;
}
.intro_title img{
    width: 100%;
}
.intro .intro_img1{
    background: url(../images/intro_img_pc.png) no-repeat;
    background-size: cover;
    padding-top: 37.5%;
    position: relative;
}
.intro .intro_img2{
    display: none;
}
.intro .intro_leadtxt{
    width: 71.45%;
    max-width: 686px;
    margin: 0 auto;
    position: relative;
    top: -30px;
}
.intro .intro_leadtxt img{
    width: 100%;
}
.intro .intro_text{
    text-align: center;
    font-size: 1.25rem;/*20px*/
    line-height: 1.8;
    letter-spacing: 1.2;
}
.intro .intro_text span{
    font-size: 1.75rem;/*28px*/
    font-weight: 700;
}

/* CAST キャスト
----------------------------------------------------*/
.cast{
    background: rgba( 45,45,45,0.5);
}
.cast_title{
    width: 23.46%;
    max-width: 176px;
}
.cast_title img{
    width: 100%;
}

.cast .cast_list li{
    font-size: 1.5rem;/*24px*/
    margin-bottom: 30px;
    text-align: center;
}
.cast .cast_list li:last-child{
    margin-bottom: 0;
}

/* STAFF スタッフ
----------------------------------------------------*/
.staff{
    background: #de007d;
}
.staff_title{
    width: 25.6%;
    max-width: 192px;
}
.staff_title img{
    width: 100%;
}
.staff_list{
    display: flex;
    flex-wrap: wrap;
    font-size: 1.25rem; /*20px*/
}
.staff_list dt{
    width: 32%;
    text-align: right;
    margin-right: 4%;
}
.staff_list dd{
    width: 64%;
    line-height: 1.4;
    margin-bottom: 25px;
}
.staff_list dd:last-child{
    margin-bottom: 0;
}
.staff_list span{
    font-size: 1rem;/*16px*/
}

/* バナー
----------------------------------------------------*/
.banner{
    padding: 30px 0;
    background: #ffffff;
}
.banner .banner_inner{
    width: 89.3%;
    max-width: 670px;
    margin: 0 auto;
}
.banner .banner_inner a{
    display: block;
}
.banner .banner_inner img{
    width: 100%;
}

/* フッター
----------------------------------------------------*/
.footer{
    background: #2d2d2d;
    padding: 10px 20px 8px;
}
.footer .copy{
    font-size: 0.875rem;/*14px*/
    text-align: center;
}

/****************************************************************************
max-width:  960px
*****************************************************************************/
@media screen and (max-width: 960px) {
    /* 共通
    ----------------------------------------------------*/
    .contents_inner{
        margin: 0 40px;
    }
    /* ヘッダー
    ----------------------------------------------------*/
    .header{
        background: #fff;
    }
    
    /* INTRODUCTION イントロダクション
    ----------------------------------------------------*/
    .intro .intro_text{
        font-size: 1.125rem;/*18px*/
    }
    .intro .intro_text span{
        font-size: 1.5rem;/*24px*/
    }


}
/****************************************************************************
max-width: 768px
*****************************************************************************/
@media screen and (max-width: 768px) {
    .sp-br {
        display: block;
    }
    /* 共通
    ----------------------------------------------------*/
    .contents_inner{
        margin: 0 20px;
    }
      /* ヘッダー
    ----------------------------------------------------*/
    .header .release_txt{
        width: 80%;
    }
    /* Blu-ray&DVD
    ----------------------------------------------------*/
    .disc_box .disc_img{
        width: 100%;
        max-width: 360px;
        float: none;
        margin: 0 auto 30px;
    }
    .disc_box .disc_txt{
        float: none;
        margin-left: 0;
        width: 100%;
    }
    .disc_box .disc_txt .btn_buy a{
        padding: 15px;
        font-size: 1rem;
    }
    .disc_box {
        padding: 0 20px;
    }
    /* アフェリエイト */
    .disc_box .disc_txt .affiliate li{
        width: 24.15%;
    }
    .disc_box .disc_txt .affiliate li:nth-child(3n){
        margin-right: 1%;
    }
    .disc_box .disc_txt .affiliate li:nth-child(4n){
        margin-right: 0;
    }
    .disc_tokuten{
        padding: 90px 20px 40px;
    }

    /* INTRODUCTION イントロダクション
    ----------------------------------------------------*/
    .intro_title{
        width: 70.9%;
    }

    /* CAST キャスト
    ----------------------------------------------------*/
    .cast .cast_list li span{
        display: none;
    }



}
/****************************************************************************
max-width: 560px
*****************************************************************************/
@media screen and (max-width: 560px) {

    /* 共通
    ----------------------------------------------------*/
    .section_inner{
        padding: 50px 0;
    }
    .section_title{
        margin: 0 auto 50px;
    }
    .content_list dt{
        font-size: 0.875rem; /*14px*/
        margin-bottom: 10px;
    }
    .content_list dd{
        font-size: 0.875rem; /*14px*/
    }
    /* ヘッダー
    ----------------------------------------------------*/
    .header{
        padding: 130px 0 60px;
    }
    .h1_logo{
        padding-bottom: 40px;
    }

    /* ナビゲーション
    ----------------------------------------------------*/
    .nav .nav_inner li:hover{
        background: linear-gradient(#f661a9,#e82a95);
    }
    .nav .nav_inner li a:hover{
        opacity: 1;
    }

    /* 装飾の写真
    ----------------------------------------------------*/
    .loop_wrap {
        display: flex;
        width: 100vw;
        height: 125px;
        overflow: hidden;
    }
    .screen{
        min-width: 1125px;
        height: 125px;
    }
    @keyframes loop_l {
        0% {
        transform: translateX(0);
        }
        to {
        transform: translateX(-1125px);
        }
    }
    @keyframes loop_r {
        0% {
        transform: translateX(-1125px);
        }
        to {
        transform: translateX(0);
        }
    }
    /* MOVIE
    ----------------------------------------------------*/
    .movie .section_title.movie_title{
        margin-bottom: 30px;
    }
    .movie .movie_frame {
        width: 100%;
        height: 0;
        padding-top: 56.25%;
    }
    .movie .contents_inner {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    /* Blu-ray&DVD
    ----------------------------------------------------*/
    .disc_box .disc_img{
        max-width: 250px;
    }
    .bddvd .contents_inner h3{
        font-size: 1.5rem; /*24px*/
        margin-bottom: 50px;
    }
    .bddvd #special.contents_inner{
        padding-top: 40px;
        margin-bottom: 50px;
    }
    .bddvd #normal.contents_inner{
        padding-top: 40px;
        margin-bottom: 30px;
    }
    .disc_box .disc_txt h4{
        font-size: 1.25rem; /*20px*/
    }
    .disc_box .disc_txt{
        font-size: 0.875rem; /*14px*/
    }
    .disc_box .disc_txt .disc_txt_price{
        font-size: 1rem; /*16px*/
    }
    .disc_box .disc_txt .btn_buy {
        margin-bottom: 20px;
    }
    /*アフェリエイト*/
    .disc_box .disc_txt .affiliate li{
        width: 32.66%;
    }
    .disc_box .disc_txt .affiliate li:nth-child(3n){
        margin-right: 0;
    }
    .disc_box .disc_txt .affiliate li:nth-child(4n){
        margin-right: 1%;
    }
    .disc_tokuten h5{
        font-size: 1.125rem;/*18px*/
        padding: 4px 20px;
    }
    .bddvd .note{
        font-size: 0.75rem;/*12px*/
    }
    .bddvd .rental_txt{
        font-size: 1.25rem;/*20px*/
    }


    /* INTRODUCTION イントロダクション
    ----------------------------------------------------*/
    .intro .intro_inner{
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .intro .intro_leadtxt {
        width: 89.33%;
        top: -15px;
    }
    .intro .intro_img1{
        background: url(../images/intro_img_sp1.jpg) no-repeat;
        background-size: cover;
        padding-top: 66.8%;
        position: relative;
    }
    .intro .intro_img2{
        display: block;
        background: url(../images/intro_img_sp2.jpg) no-repeat;
        background-size: cover;
        padding-top: 66.8%;
        position: relative;
    }
    .intro .intro_text{
        font-size: 1rem;/*16px*/
    }
    .intro .intro_text span{
        font-size: 1.125rem;/*18px*/
    }

    /* CAST キャスト
    ----------------------------------------------------*/
    .cast .cast_list li{
        font-size: 1rem;/*16px*/
    }

    /* STAFF スタッフ
    ----------------------------------------------------*/
    .staff_list{
        font-size: 0.875rem; /*14px*/
    }
    .staff_list span{
        font-size: .75rem;/*12px*/
    }
    .staff_list dt{
        width: 26%;
        margin-right: 4%;
    }
    .staff_list dd{
        width: 70%;
    }
    /* フッター
    ----------------------------------------------------*/
    .footer{
        padding: 10px 20px 8px;
    }
    .footer .copy{
        font-size: 0.75rem;/*12px*/
    }

}

/****************************************************************************
max-width: 374px
*****************************************************************************/
@media screen and (max-width: 374px) {

  


}