@charset "UTF-8";

/* CSS Document */


/* article */


/*
.banner {
	position: relative;
    width: 100%;
    height: 250px;
    background-image: url(../img/comicsBannerBg.jpg);
}
*/

.SP50th{margin:0 auto 20px;}
.SP50th img{width:100%;}

.wrapper#weeklyshonenjump .banner>img {
 width: 100%;
}

.wrapper#weeklyshonenjump .banner .banner_text {
 position: absolute;
 top: 0;
 width: 100%;
 text-align: center;
}

.wrapper#weeklyshonenjump .banner_item {
 position: absolute;
 bottom: 0;
 display: flex;
 flex-wrap: wrap;
 justify-content: space-around;
 align-items: flex-end;
 width: 100%;
 padding: 10px;
 box-sizing: border-box;
}

.wrapper#weeklyshonenjump .banner_item img {
 width: calc((100% / 6) - 9px);
}


/* article section */

.wrapper#weeklyshonenjump article section ul {
 display: flex;
 flex-wrap: wrap;
 justify-content: flex-start;
}

.wrapper#weeklyshonenjump article section ul li {
 position: relative;
 width: calc((100% - 4%) / 2);
 margin-bottom: 40px;
 box-sizing: border-box;
 margin-right: 2%;
}

.wrapper#weeklyshonenjump article section ul li:nth-child(2n) {
 margin-right: 0;
}

.wrapper#weeklyshonenjump article section ul li a img {
 width: 100%;
 /*height: 200px;*/
 background: #eee;
}

.wrapper#weeklyshonenjump article section ul li dl {
 display: flex;
 margin: 5px 0;
}


/*左*/

.wrapper#weeklyshonenjump article section ul li dl dt {
 width: 30%;
}

.wrapper#weeklyshonenjump article section ul li dl dt img {
 border: 1px solid #CCC;
}


/*右*/

.wrapper#weeklyshonenjump article section ul li dl dd {
 margin: 0 0 0 8px;
 font-size: 1.2rem;
 width: 70%;
}

.read {
 font-size: .9rem;
 display: block;
 color: #666;
}

.ttl {
 line-height: 1.4;
 color: #c60000;
 display: block;
 font-weight: bold;
}

.author {
 display: block;
}

.link {
 margin-top: 10px;
 font-size: .8rem;
}
 .link a{
  background-color: #f1f1f1;
  padding: 5px 10px;
  color: #333;
  display: inline-block;
  box-sizing: border-box;
  margin-right: 5px;

}

.wrapper#weeklyshonenjump .relation h2 {
 margin: .8rem;
}

.wrapper#weeklyshonenjump .relation ul {
 display: block;
}

.wrapper#weeklyshonenjump .relation ul li {
 width: 100%;
 margin: 0;
 padding: .8em;
 border-bottom: solid 1px #eee;
}

.wrapper#weeklyshonenjump .relation ul li a {
 color: #04c;
}

.wrapper#weeklyshonenjump .relation ul li a:before {
 content: "";
 display: inline-block;
 margin-right: 1em;
 border-top: solid 6px transparent;
 border-bottom: solid 6px transparent;
 border-left: solid 10px #000;
}


/*購入・試し読みボタン---------------------------------------------------*/
.wrapper#weeklyshonenjump article section.weeklyshonenjumpBtn .nextWjBtn{
 width: 98%;
 margin: 0 auto;
 text-align:center;
}
.wrapper#weeklyshonenjump article section.weeklyshonenjumpBtn .nextWjBtn a{
 width: 100%;
 text-decoration: none;
 display: block;
 background-color: #c60000;
 padding: 16px 0;
 color: #fff;
}

.wrapper#weeklyshonenjump article section.weeklyshonenjumpBtn ul {
 display: flex;
 flex-wrap: wrap;
}

.wrapper#weeklyshonenjump article section.weeklyshonenjumpBtn ul li{
 width:48%;
 margin: 1%;
 box-sizing: border-box;
 text-align:center;
}
.wrapper#weeklyshonenjump article section.weeklyshonenjumpBtn ul li a{
 width: 100%;
 text-decoration: none;
 display: block;
 background-color: #c60000;
 padding: 16px 0;
 color: #fff;
}
.wrapper#weeklyshonenjump article section.weeklyshonenjumpBtn p{
width: 90%;
 text-align:center;
 margin: 10px auto 0;
}


/*スライダー---------------------------------------------------*/

.slider {}

.slider>img {
 width: 100%;
}

.slideMain {}

.slideMain ul {}

.slideMain ul li {
 padding: 10px 5px;
 text-align: center;
 border: #CCC 1px solid;
 margin: 10px;
}

.slideMain ul li img {
 margin: 0 auto;
 display: block;
}

.slideMain ul li p {
 color: #000;
 margin: 0;
 padding: 10px 0 0 0;
}

#arrows {
 position: relative;
 top: 50%;
 left: 0;
 transform: translate(0, -250px);
 -webkit-transform: translate(0, -250px);
 width: 100%;
}

#arrows .logo {
 position: absolute;
 width: 40px;
 height: 35px;
}

#arrows .logo img {
 width: 100%;
}

.slick-prev.slick-arrow {
 position: absolute;
 left: -20px;
 z-index: 10000;
 width: 40px;
 height: 35px;
}

#arrows .logo.left {
 top: 50%;
 left: 0;
 transform: translate(-50%, -50%);
 -webkit-transform: translate(-50%, -50%);
}

#arrows .logo.left:before {
 content: "";
 display: inline-block;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 -webkit-transform: translate(-50%, -50%);
 z-index: 100;
 border-top: solid 5px transparent;
 border-right: solid 6px #000;
 border-bottom: solid 5px transparent;
}

#arrows .logo.left:after {
 content: "";
 display: inline-block;
 position: absolute;
 top: 50%;
 left: 56%;
 transform: translate(-50%, -50%);
 -webkit-transform: translate(-50%, -50%);
 z-index: 1000;
 border-top: solid 5px transparent;
 border-right: solid 6px #f3f297;
 border-bottom: solid 5px transparent;
}

#arrows .logo.right {
 top: 50%;
 right: 0;
 transform: translate(50%, -50%);
 -webkit-transform: translate(50%, -50%);
}

#arrows .logo.right:before {
 content: "";
 display: inline-block;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 -webkit-transform: translate(-50%, -50%);
 z-index: 100;
 border-top: solid 5px transparent;
 border-left: solid 6px #000;
 border-bottom: solid 5px transparent;
}

#arrows .logo.right:after {
 content: "";
 display: inline-block;
 position: absolute;
 top: 50%;
 left: 44%;
 transform: translate(-50%, -50%);
 -webkit-transform: translate(-50%, -50%);
 z-index: 1000;
 border-top: solid 5px transparent;
 border-left: solid 6px #f3f297;
 border-bottom: solid 5px transparent;
}

.slick-next.slick-arrow {
 position: absolute;
 right: -20px;
 z-index: 10000;
 width: 40px;
 height: 35px;
}