@charset "utf-8";
/*----------------------------------------
photo.css
2017.02.09 ver.1.01
----------------------------------------*/
/* 0.base
----------------------------------------*/
/* Link */
.photo-top a{
color:#a6a6a6;
}
.main-navi a {
    color: #cce3ef!important;
}

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

/* color */
.photo-top h2,
.photo-top a .keyword,
.photo-top .keyword a,
.photo-top .contents-end a,
.photo-top .photo-list a,
.photo-top #main .header-box li a,
.photo-top #sub .list-typeA li a,
.photo-top #sub .list-typeE li a,
.photo-top .list-bnr a,
.photo-top .ad a,
.photo-top .ad .ad-list li a{
color:#fff;
}

/* list
----------------------------------------*/
.photo article .list-typeA{

}

.photo #main .list-typeC li a{
border-top:none;
}

.list-bnr a:hover img{
opacity:0.8;
}


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



/*----------------------------------------
3.alert box
----------------------------------------*/
.photo-top .alert-box{
color:#222;
}


/*----------------------------------------
4.article
----------------------------------------*/
header h1.logo{
width:140px;
height:40px;
background-image:url(/vol1/images/pc/logo-photo_wh.svg);
background-size:140px auto;
background-position: 0 0;
background-repeat: no-repeat;
text-indent:100%;
overflow: hidden;
white-space: nowrap;
}


/* article end anchorlink
----------------------------------------*/
.photo-top #sub .typeC-line .keyword a,
.photo-top #sub .typeC-line a .keyword{
color:#222;
}



/*----------------------------------------
5.photo-top
----------------------------------------*/
#main .section{
background:none;
}

.photo-top div.header-box,
.section div.header-box{
background:none;
}

.photo-top header{
min-width:0;
}

.photo-top div.header-box ul.inline-list li{
border:none;
background-color:#838E93;
background-image:url("/vol1/images/pc/icon-arrow_gr.svg");
background-repeat: no-repeat;
background-size: 16px auto;
background-position: 100% -93px;
}
.photo-top div.header-box ul.inline-list li:hover{
border:none;
background-color:#0078c6;
background-image:url("/vol1/images/pc/icon-arrow_gr.svg");
background-repeat: no-repeat;
background-size: 16px auto;
background-position: 100% -93px;
}

.photo-top div.header-box ul.inline-list li.btn-sns{
width:32px;
height:32px;
padding:0;
border:none;
background:transparent none;
}

.photo-top div.header-box ul.inline-list li.btn-sns a{
display:block;
width:32px;
height:32px;
}

.photo-top div.header-box li.fb a{
background-image: url("/vol1/images/pc/icon-tool-fb.svg");
background-size: 38px auto;
background-position: -6px -4px;
background-repeat: no-repeat;
}

.photo-top div.header-box li.tw a{
background-image: url("/vol1/images/pc/icon-tool-tw.svg");
background-size: 34px auto;
background-position: center center;
background-repeat: no-repeat;
}

.photo-top div.header-box li.ig a{
background-image: url("/vol1/images/pc/icon-tool-insta.svg");
background-size: 24px auto;
background-position: center center;
background-repeat: no-repeat;
}

.photo-top div.header-box ul.inline-list li.btn-sns a:hover{
/*opacity:0.8;*/
background-color: #706e69;
}

.photo-top aside.nav li a {
background-color:#000;
background-image:url("/vol1/images/pc/icon-arrow_gr.svg");
background-repeat: no-repeat;
background-size: 16px auto;
background-position: 0 -44px;
border:1px solid #737373;
color:#fff;
}

.photo-top aside.nav li a:hover{
background-color:#2b2b2b;
background-image:url("/vol1/images/pc/icon-arrow_gr.svg");
background-repeat: no-repeat;
background-size: 16px auto;
background-position: 0 6px;
border:1px solid #737373;
color:#fff;
}

#main .photo-list li .thumb img.horizontal-photo{
max-height:none;
}

#main .photo-header{
background:none;
}
#main .photo-list {
justify-content: space-between;
}
#main .photo-list li {
padding: 0 8px;
}
.photo-list .thumb {
width: 100%;
height: 244px;
}


/* slide show
----------------------------------------*/
#slide{
text-align:center;
height:526px;
}

/* slide-list */
#slide #slide-list{
position:relative;
width:756px;
height:472px;
overflow:hidden;
}

#slide #slide-list li{
position:absolute;
display:none;
top:0;
left:0;
}

#slide #slide-list li:first-child{
display:block;
}

.slide-img{
width:765px;
height:433px;
}

.slide-img a{
color:#fff;
}

.thum-img{
width:765px;
height:433px;
overflow:hidden;
z-index:1;
}

.thum-img a{
display:block;
z-index:4;
}

.photo .thum-img img,
.thum-img img.horizontal-photo,
.thum-img img.vertical-photo {
width:auto;
height:433px;
max-height:none;
max-width:100%;
}

.slide-overlay{
position:absolute;
bottom:0;
width:756px;
padding:0 20px 20px;
text-align:left;
line-height:1.2;
z-index:3;
}

.photo-top .slide-overlay p{
font-weight:bold;
}

.photo-top .slide-overlay .title{
font-size:137.5%;
}

.slide-overlay .credit-name{
font-size:87.5%;
/*color:#fff;*/
}


.slide-title {
font-size:16px;
line-height:1.5;
text-align:center;
margin:10px 0 0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.slide-title .credit-name {
display:inline;
margin-left:1.5em;
}

/* slide-navi */
#slide #slide-navi{
margin:6px auto 24px;
display:inline-block;
*display:inline;
width:auto;
zoom:1;
}

#slide #slide-navi li{
display:inline-block;
margin:0 6px;
text-align:center;
}

#slide #slide-navi li a{
background:#454545;
display: inline-block;
height:12px;
width:12px;
-webkit-border-radius:50%;
-moz-border-radius:50%;
-ms-border-radius:50%;
-o-border-radius:50%;
border-radius:50%;
}

#slide #slide-navi li a.current{
background:#fff;
}

/* ranking
----------------------------------------*/
#sub .topranking .ranking h2 a{
color:#FFFFFF;
}

#sub .topranking .ranking ul.inline-list{
border-bottom:1px solid #e0e0e0;
}

#sub .topranking .ranking ul.inline-list li{
margin:0 0 6px 3px;
border:1px solid #4c4c4c;
background-color: transparent;
background-image: url("/vol1/images/pc/icon-arrow_gr.svg");
background-repeat: no-repeat;
background-position: 100% 7px;
}

#sub .topranking .ranking ul.inline-list li:first-child{
margin:0 0 6px 0;
}

#sub .topranking .ranking ul.inline-list li a{
color:#FFFFFF;
}

#sub .topranking .ranking ul.inline-list li.active{
margin:0 0 6px 0;
padding:7px 6px 7px 0;
border:none;
background:none;
font-weight:bold;
}

#sub .topranking .ranking ul.inline-list li:last-child.active{
padding:7px 0 7px 7px;
}

#sub .topranking .ranking .list-typeC .thumb{
border:0px solid #4c4c4c;
background:#121212;
}

#sub .topranking ol.ranking-list {
margin-bottom: 20px;
}

#sub .topranking ol.ranking-list li{
margin:10px 0 0 0;
border-bottom:1px solid #4c4c4c;
}

#sub .topranking ol.ranking-list li:last-child{
border-bottom:0px solid #4c4c4c;
}

#sub .topranking ol.ranking-list li a{
margin:0 45px 20px 45px;
border-top:0px solid #4c4c4c;
}

#sub .topranking .ranking a .keyword{
color:#a6a6a6;
padding-top:10px;
}

#sub .topranking .ranking a .midashi{
color:#FFFFFF;
}

#sub .topranking ol.ranking-list li:before{
color:#FFFFFF!important;
}

/*----------------------------------------
50.photo article
----------------------------------------*/
article .main-photo{
padding:20px 16px;
}

.main-photo .img a.prev-photo,
.main-photo .img a.next-photo{
display:block;
position:absolute;
top:0;
width:50%;
height:100%;
z-index:2;
}

a.prev-photo{
left:0;
background-color:transparent;
background-image:url(/vol1/images/pc/photo-prev.svg);
background-size: 50px auto;
background-repeat: no-repeat;
background-position: left 48%;
filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity:0;
-webkit-transition:opacity 0.6s;
-moz-transition:opacity 0.6s;
-o-transition:opacity 0.6s;
transition:opacity 0.6s;
}

a.next-photo{
background-color:transparent;
background-image:url(/vol1/images/pc/photo-next.svg);
background-size: 50px auto;
background-repeat: no-repeat;
background-position: right 48%;
left:50%;
filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity:0;
-webkit-transition:opacity 0.6s;
-moz-transition:opacity 0.6s;
-o-transition:opacity 0.6s;
transition:opacity 0.6s;
}

a.prev-photo:hover,
a.next-photo:hover{
filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
opacity:1;
}

/* for IE8 */
html>/**/body a.prev-photo:hover,
html>/**/body a.next-photo:hover{
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod="scale");
}

/* main-photo-navi */
.main-photo-navi{
float:right;
height:32px;
margin:4px 0 0;
font-size:75%;
position: relative;
z-index:1000;
}

.main-photo-navi .prev,
.main-photo-navi .next{
display:inline-block;
*display:block;
width:28px;
height:28px;
padding:0;
*zoom:1;
}

.main-photo-navi .prev{
background-color: transparent;
background-image: url("/vol1/images/pc/arrow-prev.svg");
background-size: 28px auto:
background-repeat: no-repeat;
background-position: 0 0;
}
.main-photo-navi .next{
background-color: transparent;
background-image: url("/vol1/images/pc/arrow-next.svg");
background-size: 28px auto:
background-repeat: no-repeat;
background-position: 0 0;
}

.main-photo-navi .prev:hover,
.main-photo-navi .next:hover{
opacity:0.8;
}

.main-photo-navi span{
vertical-align:10px;
}


/* photo-navi-list */
.photo-navi-list{
margin:0 auto 24px;
padding:0 0 0 16px;
}

.photo-navi-list li{
position:relative;
display:block;
float:left;
width:120px;
height:120px;
margin:0 2px 12px 0;
padding:0;
}

.photo-navi-list li .thumb{
display:table-cell;
width:110px;
height:110px;
background:#f8f8f8;
border:1px solid #ececec;
text-align:center;
vertical-align:middle;
overflow:hidden;
}

.photo-navi-list li .thumb img.horizontal-photo{
width:100px;
}

.photo-navi-list li .thumb img.vertical-photo,
.photo-navi-list li .thumb img.square-photo{
height:100px;
}

.photo-navi-list li .thumb:hover img{
opacity: 0.7;
}
.photo-navi-list li .thumb.current{
border:2px solid #b3b3b3;
}

a.tooltip .tooltip-txt{
position:absolute;
display:none;
top:100px;
left:5px;
width:150px;
padding:6px;
border:1px solid #dbdbdb;
background:#FFF;
border-radius:3px;
-moz-box-shadow:1px 1px 3px rgba(0,0,0,0.3);
-webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.3);
-o-box-shadow:1px 1px 3px rgba(0,0,0,0.3);
-ms-box-shadow:1px 1px 3px rgba(0,0,0,0.3);
box-shadow:1px 1px 3px rgba(0,0,0,0.3);
z-index:3;
}

a.tooltip:hover .tooltip-txt{
display:block;
}

.tooltip-txt:after,
.tooltip-txt::before{
position:absolute;
content:" ";
left:50%;
bottom:100%;
border:solid transparent;
pointer-events:none;
}
.tooltip-txt:after{
top: -30px;
margin-left: -10px;
border-width: 7px;
border-bottom: 7px solid #dbdbdb;
z-index: 1;
}

.tooltip-txt:before{
top: -24px;
margin-left: -8px;
border-width: 5px;
border-bottom: 5px solid #FFF;
z-index: 2;
}

a.tooltip .caption{
color:#222;
font-size:75%;
}

/* 関連記事リスト */
article .links h2{
margin:0 12px 12px;
}

article .links .list-typeA{
margin:0 0 24px;
padding:0 12px;
}


/*----------------------------------------
90.ad
----------------------------------------*/
.photo-top .txtad a:hover{
color:#fff;
background:#2a2a2a;
}

.photo-top .txtad a:hover,
.photo-top .ad-list li:hover,
.photo-top .ad .list-typeA li:hover,
.photo-top .ad .list-typeC li:hover,
.photo-top .ad .list-typeE li:hover{
background:#2a2a2a;
}

.photo-top .ad .list-typeA li a:hover,
.photo-top .ad .list-typeC li a:hover,
.photo-top .ad .list-typeE li a:hover{
text-decoration:none;
}

.photo-top .ad-list a span,
.photo-top #sub .ad .list-typeC li a,
.photo-top #sub .list-typeE li a span.txt{
color:#a6a6a6;
}

.photo-top #sub .ad .list-typeD li a{
color:#fff;
}

article aside.ad{
margin:0 16px 12px;
padding:6px 6px 6px 0;
background:#fff;
border-radius:3px;
}

article aside.ad .ad-list{
margin:0;
}

article aside.ad .ad-list li{
margin:0 0 0 47px;
}


/*----------------------------------------
99.hac
----------------------------------------*/
.clr:after,.cFix:after,
.slide-list:after,
.photo-navi-list:after{
content:".";
display:block;
clear:both;
height:0;
visibility:hidden;
overflow:hidden;
}

/* IE7 */
*:first-child+html .clr,*:first-child+html .cFix,
*:first-child+html .slide-list,
*:first-child+html .photo-navi-list{
display:inline-block;
zoom:1;
}

#main .photo-list li .thumb img.vertical-photo,
#main .photo-list li .thumb img.square-photo{width:auto; max-height:100%;}