/* CSS Document */

body {
  background-color: #333;
}
#viewerPc {
  background: #333;
  color: #FFF;
}
#viewerPc h2 {
  font-size: 1.6em;
  color: #aaa;
}
#viewerPc .inner-delivery-contents {
  padding: 0;
}
#viewerPc .inner-delivery-contents .box {
  padding: 0;
  margin-top: 25px;
}
#viewerPc .container-headerArea {
  margin-bottom: 25px;
  font-size: 2rem;
  line-height: 3.5rem;
  font-weight: bold;
}
#viewerPc .container-headerArea h2 {
  font-size: 2rem;
  color: #aaaaaa;
  padding: 0;
  font-weight: bold;
  margin-bottom: 10px;
}
#viewerPc .container-headerArea span {
  font-weight: bold;
}
#viewerPc .container-headerArea .watitle {
  color: #FFFFFF;
  font-weight: bold;
  padding: 0;
  font-size: 2rem;
}
/*Link Button*/

.viewerbtn {
  display: flex;
  border: solid 2px #fff;
  border-radius: 10px;
  margin: 25px auto;
  width: 800px;
  background-color: #A6A6A6;
}
.viewerbtn .viewerbtn_toBack, .viewerbtn .viewerbtn_toTop, .viewerbtn .viewerbtn_toNext {
  display: block;
  color: #ffffff;
  box-sizing: border-box;
  width: 33.333333333%;
  position: relative;
  border-right: solid 2px #fff;
}
.viewerbtn .viewerbtn_toBack a, .viewerbtn .viewerbtn_toTop a, .viewerbtn .viewerbtn_toNext a {
  display: block;
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: bold;
  padding: 1.7rem;
  text-align: center;
}
.viewerbtn .viewerbtn_toNext {
  border-right: none;
}
.viewerbtn .viewerbtn_toBack a i {
  font-family: 'FontAwesome';
  color: #ffffff;
  position: absolute;
  left: 15px;
  top: 18px;
}
.viewerbtn .viewerbtn_toNext a i {
  font-family: 'FontAwesome';
  color: #ffffff;
  position: absolute;
  right: 15px;
  top: 18px;
}
.viewerbtn_b {
  display: block;
  color: #fff;
  -webkit-border-radius: 7;
  -moz-border-radius: 7;
  border-radius: 7px;
  box-sizing: border-box;
  margin: 10px auto;
  background-color: #A6A6A6;
  width: 38%;
  text-align: center;
}
.viewerbtn_b>a {
  display: block;
  color: #fff;
  font-size: 1.2rem;
  font-weight: 700;
  padding: 1.2rem 1.2rem 1.2rem .5rem;
  text-align: center;
}
.viewerbtn_b>a>i {
  font-family: 'FontAwesome';
  color: #fff;
  font-size: 1.2rem;
  left: 0;
  padding: .3rem;
  box-sizing: border-box;
  margin: -.1rem .3rem 0 .2rem;
  vertical-align: top;
}
#viewerPc .inline-block {
  text-align: center;
  padding-top: 20px;
}
#viewerPc .inline-block li {
  display: inline-block;
  margin: 10px 2% 20px 0;
}
#viewerPc .spacer {
  position: absolute;
  z-index: 1;
  width: 800px;
  height: 100%;
  margin: 0 auto;
}
div.lazy-container {
  text-align: center;
}
img.lazy {
  width: 800px;
  height: auto;
}
.footer-sns-PC {
  width: 800px;
  margin: 25px auto 50px;
  padding: 40px;
  background-color: #fff;
}
.footer-sns-PC .btn-mypage {
  margin: 0 auto 40px;
}
.footer-sns-PC .btn-mypage .favorite-btn {
  margin: 0 auto;
}
.footer-sns-PC .inline-block li {
  margin: 0 10px;
}
.lazy-container a:hover {
  opacity: 1;
}
img.viewerFixedImage {
  width: 800px;
}
.bnr-sakuhin-info {
  margin: 50px auto 25px;
}
.bnr-sakuhin-info a {
  display: block;
}
/*誘導部分*/

.yudobox {
  background: #FCF0DB;
  margin: 25px 0 0;
  width: 800px;
  padding: 5.5rem 0 6.4rem 0;
  position: relative;
  display: inline-block;
  height: auto;
}
#viewerPc .inner-delivery-contents .yudobox .box {
  padding: 0;
  padding-bottom: 10px;
}
.yudobox .inner-contents {
  margin: 0 1.5rem;
  padding: 1.5rem 1.5rem 1.5rem 1.5rem;
  background-color: #fff;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}
.yudoimg {
  border: 1px #bbbbbb solid;
}
.yudo_t {
  font-size: 2.1rem;
  font-weight: bold;
  color: #FF5AB4;
  line-height: 150%;
  padding: 5px 0 24px 0
}
.yudoleft {
  width: 26%;
  position: relative;
  top: -90px;
  float: left;
}
.yudoright {
  width: 73%;
  padding: 0 0 0 20px;
  position: relative;
  text-align: left;
  top: -60px;
  float: left;
  margin-bottom: -1rem;
}
.yudoright h3 {
  font-size: 2.2rem;
  font-weight: bold;
  line-height: 150%;
}
.yudobox .inner {
  float: left;
  margin-bottom: -5rem;
}
.yudobox .btn {
  margin: 0 0 0 0;
  width: 100%;
}
.yudobox .description {
  font-size: 1.5rem;
}
.yudobox .btn>a {
  padding: 1.7rem 3rem 1.7rem 1.5rem;
}
.yudobox .purchase {
  margin: 15px 0 0 0;
}
.yudobox .purchase-title {
  font-weight: bold;
  margin: 0 0 10px 0;
}
/*誘導部分　オススメ作品*/

.yudobox02 {
  padding: 0;
  margin: 25px auto 0;
  background-color: #FFFFFF;
  border: solid 0.5rem #ff5ab4;
}
.yudobox02-tmca {
  border: solid 0.5rem #016AB7;
}
.yudobox02 .yudo_t {
  font-size: 1.8rem;
  padding: 0.25rem 0 0.75rem;
  color: #FFFFFF;
  background-color: #FF5AB4;
  margin-bottom: 1rem;
}
.yudobox02 .yudo_t-tmca {
  background-color: #016AB7;
}
.yudobox02 .yudo_t i {
  margin-right: 0.5rem;
}
.yudobox02 .displayFlex {
  align-items: flex-start;
}
.yudobox02 .displayFlex .item {
  margin: 1rem;
  width: 177px;
}
.yudobox02 .displayFlex .item a:hover {
  opacity: 1.0;
}
.yudobox02 .displayFlex .item img {
  border: solid 1px #ddd;
}
.yudobox02 h4 {
  font-weight: bold;
  font-size: 1.4rem;
  text-align: left;
  margin: 0.5rem 0;
  line-height: 1.4;
  padding: 0.25rem;
}
.viewerbtn_b02 a {
  padding: 1.2rem 0.5rem 1.2rem 1.2rem;
  margin-bottom: 50px;
}
.yudobox02 .btn {
  position: relative;
  width: 50%;
  margin: 10px auto 25px;
}
/*応援*/

.ouen {
  padding: 15px;
  background-color: #4DB087;
  margin-bottom: 15px;
  width: 800px;
  margin: 25px auto;
}
.ouen h3 {
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  padding: 2.5rem 0 3rem;
}
.ouen p {
  color: #fff;
  padding: 0;
  margin: 2.5rem 18rem 1.5rem;
  font-size: 1.5rem;
  text-align: center;
}
.ouen p a {
  font-weight: bold;
  text-decoration: underline;
}
.ouen i {
  color: #4DB087;
  font-size: 5rem;
  background-color: #fff;
  display: inline-block;
  width: 100px;
  height: 100px;
  border-radius: 100%;
  padding: 24px;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.1);
  cursor: pointer;
}
/*誘導部分　同じジャンルのおすすめ作品*/

.yudobox03 {
  padding: 0 0 1rem 0;
  margin: 50px auto 10px;
  background: #fcf0db;
  border: solid 0.5rem #fcf0db;
}
.yudobox03 .yudo_t {
  padding: 1rem 0;
  color: #E50012;
  background-color: #fcf0db;
  margin: 0;
}
.yudobox03 .label {
  width: 90px;
}
/*次回更新予定日*/

.scheduled-date {
  background-color: #FFF;
  margin: 0 auto;
  width: 800px;
  display: -webkit-flex;
  display: flex;
}
.scheduled-date p {
  font-size: 1.8rem;
  font-weight: bold;
  color: #FFF;
  background-color: #333;
  margin: 15px auto;
  padding: 5px 15px;
  border-radius: 100px;
  line-height: 30px;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  max-width: 95%;
}
.scheduled-date p .fa-arrow-circle-right {
  display: inline-block;
  font-size: 30px;
  padding-right: 5px;
}