@charset "utf-8";
/* CSS Document */

/* #c766ff purple
#ff6699 pink
#3399ff lt blue


 *//*----------------------------------------------------------------*/
div#sec_moon_rockers{
background:#000;
	width: 100%;
	min-height:700px;
	margin: 0 auto;
	padding:10px;
}

div#sec_moon_rockers div.sec_title,
div#sec_moon_rockers div.sec_titleh2 b.ft_st1,
div#sec_moon_rockers div.sec_title p,
div#sec_moon_rockers div.sec_title p span{
color:#ffffff;
}


.pc_dn{
display:none;
}

/*--@media 680px--------------------------------------------------------------*/

@media only screen and (min-width: 681px) {


div#sec_moon_rockers ul#inner_left_menu > li > a{
background-color:#000000;
color:#ffffff;
border:2px #ff6699 solid;
}
div#sec_moon_rockers ul#inner_left_menu > li > a:hover,
div#sec_moon_rockers ul#inner_left_menu > li.active > a{
background-color:#ff6699;
color:#ffffff;
}


div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(2) > a{
background-color:#000000;
color:#ffffff;
border:2px #c766ff solid;
}

div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(2) > a:hover,
div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(2).active > a{
background-color:#c766ff;
color:#ffffff;
}

div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(3) > a{
background-color:#000000;
color:#ffffff;
border:2px #3399ff solid;
}

div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(3) > a:hover,
div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(3).active > a{
background-color:#3399ff;
color:#ffffff;
}

div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(4) > a{
background-color:#000000;
color:#ffffff;
border:2px #3369ff solid;
}

div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(4) > a:hover,
div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(4).active > a{
background-color:#3369ff;
color:#ffffff;
}


div#sec_moon_rockers p{
color:#fff;
}
div#sec_moon_rockers span{
color:#fff;
}

/* ------------------------------------------------------------------- */


div#sec_moon_rockers div.sec_title{
width:80%;
margin:auto;
}

div#sec_moon_rockers div.sec_title p{
font-size:15px; line-height:1.5em; color:#fff;
}

div#sec_moon_rockers div.sec_title p span{
font-size:12px;
text-align:left;
display:block;
margin-top:10px;
}
/* ------------------------------------------------------------------- */

/* -----movie_list-------------------------------------- */
div#sec_moon_rockers div#main_contents{
width:100%;
/* max-width:1000px; */
margin:0px auto 50px;
padding:30px;
}

div#sec_moon_rockers div#main_contents h2{
color:#ffffff;
font-size:36px;
line-height:21px;
font-weight:700;
font-style: italic; 
margin-bottom:20px;
padding:5px 0;
}


div#sec_moon_rockers div#main_contents h3{
color:#fff;
font-size:24px;
line-height:21px;
font-weight:700;
font-style: italic; 
margin-bottom:20px;
padding:5px 0;
}

div#sec_moon_rockers div#main_contents h2.introduction_page{color:#ff6699;}
div#sec_moon_rockers div#main_contents h2.cast_page{color:#c766ff;}
div#sec_moon_rockers div#main_contents h2.movie_page{color:#3399ff;}


div.img_area{
width:100%;
display:block;
display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}

div.img_area img.left_img,
div.img_area img.right_img{
width:50%;
}

div.intro_text{
margin:40px 0 0;
padding:40px 0;
border-top:5px #c766ff solid;

}

div#sec_moon_rockers div#main_contents div.intro_text p{
font-size:15px;
color:#ffffff;
text-align:center;
}

div#sec_moon_rockers div#main_contents div.intro_text p span{
font-size:15px;
color:#ffffff;
text-align:center;
display:inline;
}

div#sec_moon_rockers div#main_contents div.intro_text p strong{
color:#3399ff;
font-size:130%;
line-height:1.75em;
text-align:center;
font-style: italic; 
display:block;
}

div#sec_moon_rockers div#main_contents div.intro_text p.jpn_txt{
margin-top:20px;
padding-top:20px;
border-top:1px #24304c solid;
}

div.img_gallery{
background:url(img/moon_rockers_plain_bk.jpg) no-repeat center center;
min-height:350px;
margin-top:40px;
border-top:5px #c766ff solid;
display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}


div.img_gallery div{
width:50%;
display:block;
}

div.img_gallery div:first-of-type{
width:45%;
margin-right:5%;
}


div.img_gallery div p{
color:#fff;
line-height:1.75em;
 text-shadow:
    #0f182c 2px 0px,  #0f182c -2px 0px,
    #0f182c 0px -2px, #0f182c 0px 2px,
    #0f182c 2px 2px , #0f182c -2px 2px,
    #0f182c 2px -2px, #0f182c -2px -2px,
    #0f182c 1px 2px,  #0f182c -1px 2px,
    #0f182c 1px -2px, #0f182c -1px -2px,
    #0f182c 2px 1px,  #0f182c -2px 1px,
    #0f182c 2px -1px, #0f182c -2px -1px; 
}

div.img_gallery div p:nth-of-type(2){
color:#ede8da;
font-size:80%;
}

div.img_gallery div p a{
color:#fff;
display:inline;
border-bottom:1px #fff dashed;
}
/* ---------------------------------------------- */
div#sec_moon_rockers div#main_contents ul.casting{
width:96%;
display:block;
margin:auto;
padding:0 0 50px;
}

div#sec_moon_rockers div#main_contents ul.casting li{
margin:20px 10px;
padding:20px 10px;
border-bottom:3px #24304c solid;
 display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center; 
}

div#sec_moon_rockers div#main_contents ul.casting li div.cast_img{
width:30%;
}


div#sec_moon_rockers div#main_contents ul.casting li div.cast_text{
width:68%;
margin-left:2%;
padding:10px;
}

div#sec_moon_rockers div#main_contents ul.casting li div.cast_text p{
color:#fff;
font-size:15px;
line-height:1.5em;
display:block;
}

div#sec_moon_rockers div#main_contents ul.casting li div.cast_text p:nth-of-type(2){
color:#ede8da;
font-size:80%;
}


div#sec_moon_rockers div#main_contents ul.casting li div.cast_img img{
width:100%;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;

}

div#sec_moon_rockers div#main_contents ul.casting li div.cast_text h3{
font-size:24px;
line-height:21px;
font-weight:700;
font-style: italic; 
margin-bottom:20px;
padding:5px 0;
}

div#sec_moon_rockers div#main_contents ul.casting li div.cast_text h3.pink{color:#ff6699;}
div#sec_moon_rockers div#main_contents ul.casting li div.cast_text h3.purple{color:#c766ff;}
div#sec_moon_rockers div#main_contents ul.casting li div.cast_text h3.blue{color:#3399ff;}
/* ---------------------------------------------- */
div.movie_area{
margin:50px 0 20px;
}

div#sec_moon_rockers div#main_contents div.movie_area p,
div#sec_moon_rockers div#main_contents div.movie_area p span{
font-size:13px;
color:#ffffff;
text-align:left;
margin-bottom:10px;
}


div#sec_moon_rockers div#main_contents div.movie_area h3{
background: #24304c;
color:#fff;
font-size:24px;
line-height:21px;
font-weight:700;
font-style: italic; 
width:100%;
display:block
margin:10px 0 5px;
padding:5px 0 5px 20px;
}



div.movie_area ul {
margin:10px auto 10px;
padding:5px;
 display: -webkit-flex;
    display: flex;
    -webkit-justify-content:start;
    justify-content:start;
    -webkit-align-items: flex-start;
    align-items:flex-start; 
}

div.movie_area ul li{
width:32%;
margin:0 1%;
}


div#sec_moon_rockers div#main_contents div.movie_area ul li p.movie_title{
color:#fff;
font-size:14px;
line-height:1.5em;
display:block;
margin:10px 0;
}

div#sec_moon_rockers div#main_contents div.movie_area ul li p.movie_title span{
color:#fafafa;
text-align:right;
font-size:11px;
font-weight:400;
display:block;
}

/* div.movie_area ul li strong span:before{
content:"-";
margin:0 10px;
} */

div.vimeo_video{
position:relative;
display:block;
width:100%;
padding:56.25% 0 0 0;
}

div.vimeo_video iframe{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
border:none;
}


/* --------------------------------------- */

div#sec_moon_rockers div#main_contents div.video_full{
display:block;
width:100%;
margin:50px auto;
}

div#sec_moon_rockers div#main_contents div.video_full div.vimeo_inner{
position:relative;
display:block;
width:100%;
padding:56.25% 0 0 0;
}

div#sec_moon_rockers div#main_contents div.video_full div.vimeo_inner iframe{
position:absolute;
top:0;left:0;
width:100%;
height:100%;
display:block;
border:none;
}
/* ----@media 680px 以上END--------------------------------------------------- */
}

/* ----@media 680px 以下--------------------------------------------------- */

@media only screen and (min-width: 0px) and (max-width: 680px){



div#sec_moon_rockers ul#inner_left_menu{
margin-bottom:20px;
}

div#sec_moon_rockers ul#inner_left_menu > li > a{
background-color:#000000;
color:#ffffff;
border:2px #ff6699 solid;
}
div#sec_moon_rockers ul#inner_left_menu > li > a:hover,
div#sec_moon_rockers ul#inner_left_menu > li.active > a{
background-color:#ff6699;
color:#ffffff;
}


div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(2) > a{
background-color:#000000;
color:#ffffff;
border:2px #c766ff solid;
}

div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(2) > a:hover,
div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(2).active > a{
background-color:#c766ff;
color:#ffffff;
}

div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(3) > a{
background-color:#000000;
color:#ffffff;
border:2px #3399ff solid;
}

div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(3) > a:hover,
div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(3).active > a{
background-color:#3399ff;
color:#ffffff;
}

div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(4) > a{
background-color:#000000;
color:#ffffff;
border:2px #3369ff solid;
}

div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(4) > a:hover,
div#sec_moon_rockers ul#inner_left_menu > li:nth-of-type(4).active > a{
background-color:#3369ff;
color:#ffffff;
}


/* ------------------------------------------------------------------- */
div#sec_moon_rockers p{
color:#fff;

}
div#sec_moon_rockers span{
color:#fff;
}
/* ------------------------------------------------------------------- */


div#sec_moon_rockers div.sec_title{
width:90%;
margin:auto;
}

div#sec_moon_rockers div.sec_title p{
font-size:13px; line-height:1.5em; color:#fff;
}

div#sec_moon_rockers div.sec_title p span{
font-size:12px;
text-align:left;
display:block;
margin-top:10px;
}
/* ------------------------------------------------------------------- */

/* -----movie_list-------------------------------------- */
div#sec_moon_rockers div#main_contents{
width:100%;
max-width:1000px;
margin:0px auto 30px;
}

div#sec_moon_rockers div#main_contents h2{
color:#ffffff;
font-size:24px;
line-height:21px;
font-weight:700;
font-style: italic; 
margin-bottom:20px;
padding:5px 0;
}


div#sec_moon_rockers div#main_contents h3{
color:#ff6699;
font-size:18px;
line-height:21px;
font-weight:700;
font-style: italic; 
margin-bottom:10px;
padding:5px 0;
}

div#sec_moon_rockers div#main_contents h2.introduction_page{color:#ff6699;}
div#sec_moon_rockers div#main_contents h2.cast_page{color:#c766ff;}
div#sec_moon_rockers div#main_contents h2.movie_page{color:#3399ff;}


div.img_area{
width:100%;
display:block;
padding:0;
/* display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center; */
}

div.img_area img.left_img,
div.img_area img.right_img{
width:100%;
}

div.intro_text{
margin:20px 0 0;
padding:20px 0;
border-top:3px #c766ff solid;

}


div#sec_moon_rockers div#main_contents div.intro_text p{
font-size:13px;
color:#ffffff;
text-align:center;
}

div#sec_moon_rockers div#main_contents div.intro_text p span{
font-size:13px;
color:#ffffff;
text-align:center;
display:block;
}

div#sec_moon_rockers div#main_contents div.intro_text p strong{
color:#3399ff;
font-size:130%;
line-height:1.75em;
text-align:center;
font-style: italic; 
display:block;
}

div#sec_moon_rockers div#main_contents div.intro_text p.jpn_txt{
margin-top:20px;
padding-top:20px;
border-top:1px #24304c solid;
}

div.img_gallery{
background:url(../../../../user/contents/moon_rockers/img/sp_moon_rockers_plain_bk.jpg) no-repeat center top -120px;
margin:20px auto 40px;
padding-bottom:20px;
border-top:3px #c766ff solid;
/* display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center; */
}


div.img_gallery div{
width:100%;
display:block;
padding-top:150px;
}

div.img_gallery div:first-of-type{
display:none;
}


div.img_gallery div p{
line-height:1.75em;
color:#fff;
width:96%;
display:block;
margin:auto;
 text-shadow:
    #0f182c 2px 0px,  #0f182c -2px 0px,
    #0f182c 0px -2px, #0f182c 0px 2px,
    #0f182c 2px 2px , #0f182c -2px 2px,
    #0f182c 2px -2px, #0f182c -2px -2px,
    #0f182c 1px 2px,  #0f182c -1px 2px,
    #0f182c 1px -2px, #0f182c -1px -2px,
    #0f182c 2px 1px,  #0f182c -2px 1px,
    #0f182c 2px -1px, #0f182c -2px -1px; 
}

div.img_gallery div p:nth-of-type(2){
color:#ede8da;
font-size:80%;
}

div.img_gallery div p a{
color:#fff;
display:inline;
border-bottom:1px #fff dashed;
}
/* ---------------------------------------------- */
div#sec_moon_rockers div#main_contents ul.casting{
width:98%;
display:block;
padding:0 0 50px;
}

div#sec_moon_rockers div#main_contents ul.casting li{
margin:10px;
padding:10px;
border-bottom:2px #24304c solid;
/*  display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;  */
}

div#sec_moon_rockers div#main_contents ul.casting li div.cast_img{
width:98%;
display:block;
margin:0 auto 10px;
}


div#sec_moon_rockers div#main_contents ul.casting li div.cast_text{
width:98%;
padding:10px;
}

div#sec_moon_rockers div#main_contents ul.casting li div.cast_text p{
color:#fff;
font-size:13px;
line-height:1.5em;
display:block;
}

div#sec_moon_rockers div#main_contents ul.casting li div.cast_text p:nth-of-type(2){
color:#ede8da;
font-size:80%;
}


div#sec_moon_rockers div#main_contents ul.casting li div.cast_img img{
width:90%;
margin:auto:
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;

}

div#sec_moon_rockers div#main_contents ul.casting li div.cast_text h3{
color:#ff6699;
font-size:18px;
line-height:21px;
font-weight:700;
font-style: italic; 
margin-bottom:10px;
padding:5px 0;
}
div#sec_moon_rockers div#main_contents ul.casting li div.cast_text h3.pink{color:#ff6699;}
div#sec_moon_rockers div#main_contents ul.casting li div.cast_text h3.purple{color:#c766ff;}
div#sec_moon_rockers div#main_contents ul.casting li div.cast_text h3.blue{color:#3399ff;}

/* ---------------------------------------------- */


div#sec_moon_rockers div#main_contents div.movie_area{
margin:20px 0 20px;
}

div#sec_moon_rockers div#main_contents div.movie_area p{
font-size:12px;
color:#ffffff;
text-align:left;
margin-bottom:20px;
}


div#sec_moon_rockers div#main_contents div.movie_area p span{
font-size:12px;
color:#ffffff;
text-align:left;
margin-bottom:20px;
}


div#sec_moon_rockers div#main_contents div.movie_area h3{
background: #24304c;
color:#fff;
font-size:18px;
line-height:21px;
font-weight:700;
font-style: italic; 
width:100%;
display:block
margin:10px 0 5px;
padding:5px 0 5px 20px;
}



div#sec_moon_rockers div#main_contents div.movie_area ul {
margin:10px auto;
padding:10px 10px;
/*  display: -webkit-flex;
    display: flex;
    -webkit-justify-content:start;
    justify-content:start;
    -webkit-align-items: flex-start;
    align-items:flex-start; 
} */

div#sec_moon_rockers div#main_contents div.movie_area ul li{
width:100%;
margin:0 auto;
}

div#sec_moon_rockers div#main_contents div.movie_area ul li p.movie_title{
color:#ffffff;
font-size:14px;
font-weight:700;
line-height:1.5em;
display:block;
margin:10px 0;
}

div#sec_moon_rockers div#main_contents div.movie_area ul li p.movie_title span{
color:#fafafa;
font-size:9px;
text-align:right;
font-weight:400;
display:block;
}

/* div.movie_area ul li strong span:before{
content:"-";
margin:0 10px;
} */

div#sec_moon_rockers div#main_contents div.movie_area ul li div.vimeo_video{
display:block;
width:100%;
padding:56.25% 0 0 0;
}

div#sec_moon_rockers div#main_contents div.movie_area ul li div.vimeo_video iframe{
position:absolute;
top:0;
left:2%;
display:block;
width:98%;
height:100%;
margin:auto;
border:none;
}

/* --------------------------------------- */

div#sec_moon_rockers div#main_contents div.video_full{
display:block;
width:100%;
margin:20px auto;
}

div#sec_moon_rockers div#main_contents div.video_full div.vimeo_inner{
position:relative;
display:block;
width:100%;
min-width:360px;
min-height:240px;
padding:56.25% 0 0 0;
}

div#sec_moon_rockers div#main_contents div.video_full div.vimeo_inner iframe{
position:absolute;
top:0;left:2%;
display:block;
width:98%;
height:100%;
margin:auto;
border:none;
}
/* ----@media 681px 以下END--------------------------------------------------- */
}