@charset "utf-8";
/*----------------------------------------
movie.css
2016.05.31 ver.1.00
----------------------------------------*/
/* 0.base
----------------------------------------*/
/* Link */
.movies a{
color:#a6a6a6;
}

.movies .main a{
color:#fff;
}

/* grobal navi */
nav.main-navi li.active,
nav.main-navi li:hover{
background:url("/vol1/images/pc/gnav-main-selected_bk.png") no-repeat 50% 100%;
}

/* sns */

/*----------------------------------------
1.common
----------------------------------------*/
body.movies{
background:#121212;
color:#fff;
}

/* color */
.movies h1,
.movies h2,
.movies h1 a,
.movies h2 a,
p.txt a.btn:hover{
color:#fff;
}

/* link */
a:hover .thumb img{
opacity:0.8;
}

p.txt a.btn{
padding:3px 3px;;
background:transparent;
border:1px solid #696969;
color:#696969;
font-size:81.25%;
}


/* layout */
#main,.main{
position:relative;
float:left;
width:756px; /* 1080-300-24 */
margin:0 24px 0 0;
padding:0;
}

#sub,.sub{
position:relative;
float:left;
width:300px;
margin:0;
padding:0;
}

.section{
position:relative;
margin:0 0 24px;
padding:0 0 6px;
background:none;
}

.section h1{
font-size: 162.5%;
font-weight: normal;
}

.movie-top .movie{
margin:0 0 24px;
}

article .movie-inner{
position:relative;
width:756px;
height:425px;
}


/* list
----------------------------------------*/
/* pager */
.pager li{
background:transparent;
border:1px solid #ececec;
}

.pager li:hover,
.pager li.current,
.pager li.current:hover{
background:#696969;
}
.pager li a,
.pager li.current a,
.pager li:hover a{
color:#fff;
}

/*
----------------------------------------*/
/* movie-list */
.movie-list li{
display:block;
float:left;
width:50%;
margin:0 0 6px;
padding:0 6px 0 0;
}

.movie-list li .thumb{
float:left;
width:160px;
height:89px;
margin:0 6px 3px 0;
overflow:hidden;
}

.movie-list li .midashi a{
font-size:87.5%;
color:#fff;
line-height:1.25;
}

.movie-list li a .midashi{
color:#a6a6a6;
}

.movie-list li a:hover .midashi,
.movie-subbox a:hover .midashi{
color:#fff;
}

.movie-list li .date{
margin:0 0 6px;
color:#696969;
font-size:81.25%;
}

#main .movie-list li .date,
.main .movie-list li .date{
margin:0 0 6px 166px;
}

/* 4個 */
.movie-list li.col4{
width:25%;
padding:0 6px 12px;
}

.movie-list li.col4 .thumb{
float:none;
width:256px;
height:142px;
}

.movie-list li.col4 .thumb img{
width:256px;
height:142px;
}

/* 8個 */
.movie-list li.col8{
width:12.5%;
padding:0 6px 12px;
}

.movie-list li.col8 .thumb{
float:none;
width:100%;
}

.movie-list li.col8 .thumb img{
width:100%;
}




/*
----------------------------------------*/
/* movie-subbox */
.movie-subbox{
margin:0 0 12px;
padding:6px 0;
border-top:1px solid #e0e0e0;
}

.movie-subbox h3{
margin:0 0 3px;
}

.movie-subbox .thumb{
float:left;
width:100px;
height:67px;
margin:5px 6px 0 0;
overflow:hidden;
}

.movie-subbox .midashi{
font-size:87.5%;
line-height:1.15;
}

.movie-subbox .date{
margin:0 0 0 106px;
color: #696969;
font-size:81.25%;
}

.movie-subbox p.list-link{
float:right;
margin:0 0 0 6px;
font-size:75%; /* 12px */
line-height:30px;
}

/* movie-box */
.movielist .movie-box{
position:relative;
float:left;
width:264px;
margin:0 0 6px 6px;
padding:0 6px 0;
}

.movielist .movie-box h2{
font-size:125%;
overflow:hidden;
-o-text-overflow:ellipsis;
-webkit-text-overflow:ellipsis;
-moz-text-overflow:ellipsis;
text-overflow:ellipsis;
white-space:nowrap;
}

.movielist .movie-box li{
width:100%;
padding:0;
}

.movielist .movie-box li .thumb{
float:none;
width:246px;
height:139px;
}

.movielist .movie-box li .thumb img{
width:100%;
height:auto;
}

.movie-box .list-link{
display:block;
float:right;
margin:0;
padding:6px 6px 0;
}




/*----------------------------------------
2.global navi
----------------------------------------*/
/*nav.header-main li.video{
margin:2px 0 0 24px;
}

nav.header-main li.video a{
background:url("/vol1/images/pc/icon-video-l.png") no-repeat scroll 0 4px;
padding:0 0 0 30px;
font-size:125%;
}*/

nav.main-navi li.active,
nav.main-navi li:hover{
background:url(/vol1/images/pc/gnav-main-selected_bk.png) no-repeat 50% 100%;
}

nav.main-navi li.btn-sns{
float:right;
margin:0 0 0 6px;
padding:0;
width:32px;
height:42px;
padding:0;
border:none;
background:transparent none;
}

nav.main-navi li:hover.btn-sns{
background:none;
}

nav.main-navi li.btn-sns a{
display:block;
margin:7px 0 0;
padding:0;
width:32px;
height:32px;
}

nav.main-navi li.fb a{
background-image: url("/vol1/images/pc/icon-tool.png") !important;
background-position: 0 -253px !important;
}

nav.main-navi li.tw a{
background-image: url("/vol1/images/pc/icon-tool.png") !important;
background-position: 0 -300px !important;
}

nav.main-navi li.fb a:hover,
nav.main-navi li.tw a:hover{
opacity:0.8;
}


/*----------------------------------------
5.channel top
----------------------------------------*/
article,
section.channel-top{
position:relative;
margin:0 0 24px;
padding:0 0 24px;
background:url(/vol1/images/pc/line-stripe.png) repeat-x 0 100%;
}


/* header
----------------------------------------*/
article #sub .header-box,
.channel-top #sub .header-box{
height:400px;
background:none;
overflow:auto;
}

.channel-top h2{
color:#fff;
font-size:162.5%;
font-weight: normal;
}

.channel-top h3{
padding:0;
}

.channel-top .info-txt p.txt{
clear:both;
padding:0 6px 0 0;
font-size:87.5%;
}


/* share(sns) */
article .header-box ul.tool,
.channel-top .header-box ul.tool{
margin:0 0 6px 12px;
}

.article-infoBox{
margin:0 0 12px;
padding:0;
background:none;
}


/* movie-box
----------------------------------------*/
.movie-box{
margin:0 0 24px;
padding:0;
border-width:0 1px 1px 0;
border-style:solid;
border-color:#696969;
}


/* movie-playlist
----------------------------------------*/
.movie-playlist{
position:relative;
margin:0 0 6px;
}

.movie-playlist .header-box{
background:none;
}

.movie-playlist .header-box h3{
margin:0 0 0.25em;
}

.header-box ul.inline-list li{
border:1px solid #696969;
background-color:transparent;
}

.header-box ul.inline-list li:hover{
background-color:#838e93;
}

.header-box ul.inline-list li a{
color:#696969;
font-weight:normal;
}

.header-box ul.inline-list li:hover a,
.header-box ul.inline-list li a:hover{
color:#fff;
text-decoration:none;
}

.movie-playlist li{
padding:0 3px;
}

.movie-playlist li.active a{
color:#fff;
}

.movie-playlist li .midashi{
color:#737373;
font-size:81.25%; /* 13px */
}

.playlist-box {
width:706px;
margin:0 auto;
}

.playlist-box .thumb,
.playlist-box .thumb img{
width:230px!important;
height:129px!important;
}

.playlist-box a .midashi{
color:#737373!important;
font-size:81.25%!important; /* 13px */
}

.playlist-box a:hover .midashi{
color:#fff!important;
}

.playlist-box .swiper-button-prev,
.playlist-box .swiper-button-next {
  position: absolute;
  top: 125px!important;
  width: 12px!important;
  height: 22px!important;
  z-index: 10;
  cursor: pointer;
  -moz-background-size: 12px 22px!important;
  -webkit-background-size: 12px 22px!important;
  background-size: 12px 22px!important;
  background-position: center;
  background-repeat: no-repeat;
}

.playlist-box .swiper-button-prev {
background-image: url(/vol1/images/pc/icon_arrow_prev-ie.png)!important;
background-image: none,url(/vol1/images/pc/icon_arrow_prev.svg)!important;
left:5px!important;
}

.playlist-box .swiper-button-next {
background-image: url(/vol1/images/pc/icon_arrow_next-ie.png)!important;
background-image: none,url(/vol1/images/pc/icon_arrow_next.svg)!important;
right:5px!important;
}


/*----------------------------------------
5.movie top,channel
----------------------------------------*/
.movie-top #sub h2#topvideo-name{
color:#fff;
font-size:125%;
}

.movie-top #sub #publishedDate{
color:#696969;
font-size:75%;
}


/* SNS (channel用シェア数なし) */
.movie-share{
margin:6px 0;
text-align:right;
}

.movie-share li.btn-sns{
display:inline-block;
margin:0 6px 0 0;
}

.movie-share li a{
display:block;
width:32px;
height:32px;
background-color:#838e93;
background-image:url(/vol1/images/pc/icon-tool.png);
background-repeat:no-repeat;
-webkit-border-radius:50%;
-moz-border-radius:50%;
-ms-border-radius:50%;
-o-border-radius:50%;
border-radius:50%;
text-indent:-9999em;
}

.movie-share li.gp a{
background-position:0 -200px;
}

.movie-share li.gp .count{
display:none;
}

.movie-share li.gp a:hover{
background-color:#dc4e41;
}

.movie-share li.fb a{
background-position:0 -250px;
}

.movie-share li.fb a:hover{
background-color:#3c5998;
}

.movie-share li.tw a{
background-position:0 -300px;
}

.movie-share li.tw a:hover{
background-color:#55acee;
}

.movie-share li.tw a:hover{
background-color:#77bdf1;
}

.movie-share li.hb a{
background-position:0 -350px;
}

.movie-share li.hb a:hover{
background-color:#77bdf1;
}


/*----------------------------------------
50.movie article
----------------------------------------*/
article{
padding:12px 0;
}

article h1{
margin:0;
}


/*----------------------------------------
60.archive
----------------------------------------*/
.archive #main .header-box{
margin:12px 0 6px;
}


/*----------------------------------------
70.search
----------------------------------------*/
.search .section h1{
font-size: 150%;
}

.search .section h1 em{
font-size: 162.5%;
}



/*----------------------------------------
90.ad
----------------------------------------*/


/*----------------------------------------
99.hac
----------------------------------------*/
.clr:after,.cFix:after,
.movie-list:after,
.movie-list li:after,
.movie-subbox:after,
.movie-set:after,
.movie-share:after{
content:".";
display:block;
clear:both;
height:0;
visibility:hidden;
overflow:hidden;
}

/* IE7 */
*:first-child+html .clr,*:first-child+html .cFix,
*:first-child+html .movie-list,
*:first-child+html .movie-list li,
*:first-child+html .movie-set,
*:first-child+html .movie-share{
display:inline-block;
zoom:1;
}