@charset "utf-8";
/* ===================================================================
CSS information
 file name : photostories.css

 Photo Stories撮影ストーリー トップ/記事
=================================================================== */

/*----------------------------------------------------
Headlines common
----------------------------------------------------*/
#mainContents h1 span.h1subtitle{
  margin-left: 22px;
  font-size: 18px;
}
#mainContents h2{
  font-size: 34px;
}
#mainContents .articleTitleBox{
  padding: 8px 0 23px;
}
#mainContents .articleTitleBox h1{
  padding-left: 20px;
  height: 52px;
  font-size: 32px;
  border-left: 10px solid #ffdb00;
}
#mainContents .toolbox:before,
#mainContents .toolbox:after {
  content: " ";
  display: table;
}
#mainContents .toolbox:after {
  clear: both;
}
#mainContents .toolbox{
  *zoom: 1;
}




/*----------------------------------------------------
　Photo Stories撮影ストーリーTOP
----------------------------------------------------*/
#storiesTop #newsListWrap{
  width:680px;
  background:#fff;
}
#storiesTop #newsListWrap .waiting{
  display:none;
  width:680px;
  clear:both;
  padding:10px 0 45px 0;
  text-align:center;
  font-size:14px;
  background:url(/nng/images/n/2013/common/loading.gif) center 35px no-repeat;
  margin:20px 0;
}
#storiesTop #newsListWrap ul{
  margin:0 0 15px 0;
}
#storiesTop #newsListWrap li{
  overflow:hidden;
  position:relative;
  border-bottom:1px dotted #bfbfbf;
  padding:15px 0;
  margin:0 15px;
}
#storiesTop #newsListWrap li a{
  color:#000;
}
#storiesTop #newsListWrap li a:hover img{
  opacity:0.7;
  filter:alpha(opacity=70);
  -ms-filter: "alpha( opacity=70 )";
}
#storiesTop #newsListWrap li .image{
  display:block;
  float:left;
  width:300px;
  overflow:hidden;
  margin:0 15px 0 0;
  text-align:center;
}
#storiesTop #newsListWrap li .image img{
  width:300px;
  height:auto;
}
#storiesTop #newsListWrap li h3{
  font-size:26px;
  line-height:1.4;
  font-weight:normal;
  margin:0 0 7px 0;
  padding:0;
}
#storiesTop #newsListWrap li p{
  font-size:12px;
  line-height:1.6;
  padding:0 0 20px 0;
  margin:0;
  overflow:hidden;
}
#storiesTop #newsListWrap li .genre{
  font-size:12px;
  line-height:1.4;
  position:absolute;
  left:165px;
  bottom:15px;
}
#storiesTop #newsListWrap li .date{
  font-size:12px;
  line-height:1.4;
  color:#a5a4a4;
  position:absolute;
  right:0px;
  bottom:15px;
}
#storiesTop #newsListPageNavi{
  width:680px;
  padding:10px 0 15px 0;
  font-weight:bold;
}
#storiesTop #newsListPageNavi .stay{
  font-size:14px;
  line-height:25px;
}
#storiesTop #newsListPageNavi .prev,
#storiesTop #newsListPageNavi .next{
  font-weight:normal;
}
#storiesTop #newsListWrap li.firstPageFirstItem{
  border:none;
  margin:0;
  padding:0 0 40px 0;
}
#storiesTop #newsListWrap li.firstPageFirstItem .image{
  width:680px;
  height:410px;
  max-height:410px;
  text-align:center;
  float:none;
  margin:0 0 15px 0;
  border:none;
}
#storiesTop #newsListWrap li.firstPageFirstItem .image img{
  width:auto;
  height:410px;
}
#storiesTop #newsListWrap li.firstPageFirstItem h3{
  margin:0 15px 7px 15px;
}
#storiesTop #newsListWrap li.firstPageFirstItem p{
  margin:0 15px;
  padding:0;
}
#storiesTop #newsListWrap li.firstPageFirstItem .genre{
  position:absolute;
  left:15px;
  bottom:15px;
}
#storiesTop #newsListWrap li.firstPageFirstItem .date{
  position:absolute;
  right:15px;
  bottom:15px;
}
#storiesTop #newsListWrap li.firstPageBorderItem{
  border-top:1px dotted #bfbfbf;
}

#storiesTop #newsListWrap {
  position: relative;
}



/*----------------------------------------------------
　記事用
----------------------------------------------------*/

/*----------------------------------------------------
articleTitleBox ps (Photo Stories)
----------------------------------------------------*/
#mainContents .articleTitleBox.ps{
  padding: 10px 0 0;
  width: 580px;
  margin: 0 auto;
}
#mainContents .articleTitleBox.ps h2{
  display: block;
  font-size: 49px;
  line-height: 1.4;
  margin: 33px 0 0;
}
#mainContents .articleTitleBox.ps .date{
  margin-top: 3px;
  text-align: right;
  font-size: 14px;
  color: #797979;
  line-height: 16px;
}
#mainContents .articleTitleBox.ps .toolbox{
  margin-top: 16px;
}


/*----------------------------------------------------
articleMainphotoBox(Photo Stories)
----------------------------------------------------*/
#mainContents .articleMainphotoBox.ps p.photographer{
  font-size: 12px;
  text-align: right;
}
#mainContents .articleMainphotoBox.ps .bpimage_center{
  margin-bottom: 4px;
}


/*----------------------------------------------------
articleInner (Photo Stories)
----------------------------------------------------*/
#mainContents .articleInner.ps{
  padding: 68px 0 40px;
}
#mainContents .articleInner.ps p{
  display: block;
  width: 580px;
  margin: 0 auto 20px;
  font-size: 16px;
}
#mainContents .articleInner.ps p.author {
  color: #777;
  font-size: 12px;
}

#mainContents .articleInner.ps .bpbox_center{
  padding: 48px 0 30px;
}
#mainContents .articleInner.ps .bpimage_center{
  color: #373737;
  background-color: transparent;
}
#mainContents .articleInner.ps .bpimage_center .bpimage_click,
#mainContents .articleInner.ps .bpimage_double .bpimage_click{
  float:right;
  margin-top:10px;
}
#mainContents .articleInner.ps .bpimage_center .bpimage_click a,
#mainContents .articleInner.ps .bpimage_double .bpimage_click a {
  display:block;
  padding-right: 35px;
  line-height: 24px;
  font-size: 12px;
  color: #003660;
  background: url(/nng/images/n/2016/photo/icon_zoom.gif) no-repeat right center;
}
#mainContents .articleInner.ps .bpimage_center .bpimage_caption{
  width: 400px;
  margin: 10px auto 0;
  font-size: 13px;
  line-height: 1.76;
}
#mainContents .articleInner.ps .bpimage_double .bpimage_caption{
  width: 330px;
  margin: 10px 0 0;
  font-size: 13px;
  line-height: 1.76;
  clear: none;
}
#mainContents .articleInner.ps .bpimage_center .bpimage_title{
  width: 400px;
  margin: 10px auto 0;
  font-size: 13px;
  line-height: 1.76;
}
#mainContents .articleInner.ps .toolbox{
  width: 580px;
  margin: 60px auto 0 auto;
}
#mainContents .articleInner.ps .bpimage_double .bpimage_left,
#mainContents .articleInner.ps .bpimage_double .bpimage_right,
#mainContents .articleInner.ps .bpimage_double .bpimage_center,
#mainContents .articleInner.ps .bpimage_double .captionOne {
    background: none;
    color: #666666;
}

/*-------------------------
Book infomation (Photo of the Day/Photo Storys)
-------------------------*/
#mainContents .bookinfobox{
  margin: 50px 0 30px;
  padding: 30px;
  background-color: #fff;
  overflow:hidden;
}
#mainContents .bookinfobox p{
  margin: 0;
  font-size: 14px;
}
#mainContents .bookinfobox p.bookimg {
  display: block;
  float: left;
  margin: 0 30px 30px 0;
  width: 181px;
}
#mainContents .bookinfobox p.bookimg img {
  max-width: 181px;
}
.articleBody .bookinfobox h4 {
  line-height: 1;
  font-size: 18px;
  font-weight: bold;
  margin:0;
}
.articleBody .bookinfobox h5 {
  margin-top: 2px;
  font-size: 14px;
}
#mainContents .bookinfobox .notes{
  margin-top: 12px;
  line-height: 1.7;
}
#mainContents .btn {
  float: right;
  margin-top: 14px;
  overflow: hidden;
  width: 385px;
}
#mainContents .btn_ecnikkeibp,
#mainContents .btn_amazon{
  display: block;
  float: left;
  width: 180px;
  height: 44px;
  line-height: 44px;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
}
#mainContents a.btn_ecnikkeibp:link,
#mainContents a.btn_ecnikkeibp:visited,
#mainContents a.btn_amazon:link,
#mainContents a.btn_amazon:visited{
  color: #000;
  text-decoration: none;
}
#mainContents a.btn_ecnikkeibp:hover,
#mainContents a.btn_amazon:hover{
  color: #666;
  text-decoration: none;
}
#mainContents .btn_ecnikkeibp{
  background-color: #ffdb00;
  margin-right:20px;
}
#mainContents .btn_amazon{
  background-color: #f9a02c;
}

/*-------------------------
Book infomation (Photo Storys)
-------------------------*/
#mainContents #stories .bookinfobox{
  margin: 50px auto 30px;
  overflow: hidden;
  padding: 30px 30px 10px;
  width: 600px;
}
#mainContents #stories .bookinfobox p {
  margin: 0 0 20px;
  font-size: 14px;
}
#mainContents #stories .bookinfobox p.bookimg {
  margin: 0 30px 30px 0;
  width: 181px;
}
#mainContents #stories .bookinfobox h4 {
  font-size: 16px;
  font-weight: bold;
  line-height: 1;
  margin: 0 0 20px;
}
#mainContents #stories .bookinfobox h5 {
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
  margin: 0 0 10px;
}
#mainContents #stories .bookinfobox p.clear {
  clear:both;
}
#mainContents #stories .bookinfobox p a:link {
    text-decoration: underline;
}
#mainContents #stories .bookinfobox p a:hover {
    text-decoration: none;
}


/*----------------------------------------------------
bottomAdArea (Photo Stories)
----------------------------------------------------*/
#contents #mainContents .bottomAdArea.ps .logly{
  float: left;
  width: 682px;
}
#contents #mainContents .bottomAdArea.ps .sideBanner{
  float: right;
  width: 300px;
  padding-top: 54px;
}

/* 一覧へ戻る */
#mainContents .articleBody p.linkIndex {
  margin: 20px auto 0;
  text-align: center;
  padding:0 0 20px
}
.linkIndex a {
  background-color: #ffd502;
  display: inline-block;
  padding: 10px 40px 8px;
  color:#333;
  font-weight:bold;
  font-size: 25px;
}
.linkIndex a:link,
.linkIndex a:visited {
  color:#333;
  text-decoration: none;
}
.linkIndex a:hover {
  color:#666;
  text-decoration: none;
}

/*  */
.psnavi.foot {
  padding-top:20px;
}