@charset "utf-8";

/* --------------------- pc ------------------------------ */
.photo-article-title{
  width:880px;
  margin:0 auto 28px;
  border-bottom:solid 1px #ddd;
  padding-bottom:18px;
  font-weight:500;
}
.photo-article-title a{display:block;font-size:20px;color:#2379ca;position:relative;padding-left:25px;border-style:none !important;}
.photo-article-title a::before{content:"";display:block;position:absolute;top:4px;left:0;width:17px;height:17px;border-left:solid 3px #2379ca;border-bottom:solid 3px #2379ca;transform:rotate(45deg);line-height:1;}

/*body.article-normal .article-body{padding:0;width: 880px;}*/
/*#article-body-outer.photo .vertical-sns-bar{margin-left:-65px;}*/

/*#photo-main-block{position:relative;width: 880px;}*/
/*#photo-main-block .vertical-sns-bar{position:absolute;top:0;left:-40px;}*/
#photo-main-block #photo-main-carousel{overflow:hidden;}
#photo-main-block #photo-main-carousel ul{height:468px;max-width:750px;margin:0;position:relative;}
#photo-main-block #photo-main-carousel li{margin:0;padding:0;line-height:0;}
#photo-main-block #photo-main-carousel li::before{display:none;}
#photo-main-block figure.image-area{width:750px !important;margin:0 auto;}
#photo-main-block figure figcaption{color:#888;font-size:12px;margin-top:10px;}
#photo-main-block .image-block{position:relative;text-align:center;min-height:468px;}
#photo-main-block .image-block img{color:#fff;max-height: 540px;}
#photo-main-block .image-block .loading{width:100px;margin:0 auto;position:absolute;top:calc(50% - 84px);left:0;right:0;}
#photo-main-block .image-block .photo-num{position:absolute;bottom:10px;left:50%;display:inline-block;background:rgba(0,0,0,0.5);color:#fff;font-size:16px;border-radius:12px;height:24px;line-height:22px;padding:0 15px;letter-spacing:1px;transform:translate(-50%, -50%);-webkit-transform:translate(-50%, -50%);}
#photo-main-block .image-block .error{margin:0 auto;position:absolute;top:calc(50% - 48px);left:0;right:0;}

#photo-thumbnail{margin:48px auto 0;/*width:750px;*/}
#photo-thumbnail::after{content:"";display:block;clear:both;}
#photo-thumbnail div{display:block;float:left;width:64px;height:64px;position:relative;overflow:hidden;margin:0 12px 12px 0;box-sizing:border-box;}
#photo-thumbnail div:nth-child(10n){margin-right:0;}
#photo-thumbnail div:hover,#photo-thumbnail div.current{outline: solid 2px #e64b43;}
#photo-thumbnail div a{display:block;width:64px;height:64px;}
#photo-thumbnail div img{position:absolute;transform:translate(-50%, -50%);top:50%;left:50%;max-width:inherit;}

.provide-site.denshiban {
  margin-top: 30px;
}

.back-to-article{/*width:750px;*/margin:48px auto 0;box-sizing:border-box;}

.vertical-sns-bar{
  margin-right: 40px;
}
#article-body-outer.photo .article-body{
padding:0;
width:750px;
margin: 0 auto;
}
.prevnext-btn-lane-prev{
width:48px;
margin-left:40px;
margin-right:15px;
}
#article-body-outer.photo.fixed-top .prevnext-btn-lane-prev,
#article-body-outer.photo.fixed-bottom .prevnext-btn-lane-prev{
  margin-left:0px;
}
.prevnext-btn-lane-next{
width:48px;
margin-left:15px;
}

.prevnext-btn{
  position:absolute;
  top:225px;
  width:48px;
  height:48px;
  border-radius:50%;
  background:#000;
  opacity:0.4;
  z-index:100;
}

.prevnext-btn a{
  width:48px;
  height:48px;
  border-radius:48px;
  display:block;
  position:relative;
  text-indent:150%;
  overflow:hidden;
  white-space:nowrap;
  background-repeat:no-repeat;
  background-size:15px 26px;
  -webkit-background-size:15px 26px;
  -moz-background-size:15px 26px;
}
.prevnext-btn.a:hover{
  opacity:0.5;
}
.prevnext-btn.previous{
  left: -60px;
}
.prevnext-btn.next{
  right: -60px;
}
.prevnext-btn.previous a{
  background-image:url(/common/images/bunshun/v1/article/photo/icon_left.png);
  background-position:14px center;
}
.prevnext-btn.next a{
  background-image:url(/common/images/bunshun/v1/article/photo/icon_right.png);
  background-position:18px center;
}

/* バナー */
.books-bnr {
  max-width: 100%;
  margin: 20px 0 0;
}
.books-bnr a {
  display: block;
}
.books-bnr a:hover {
  opacity: 0.7;
}
.books-bnr img {
  display: block;
  width: 100%;
}
