/* CSS Document */
body {
	min-width: 768px;
}
#loadNow {
    position: absolute;
    top: 50%;
    left: 50%;
	z-index: 1000000;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
	/*background-color: #ebebeb;*/
}
#loadNow img {
	animation: loading 1.5s linear 0 infinite normal;
	-webkit-animation: loading 1.5s linear 0 infinite normal;
}
@keyframes loading {
	0% {transform: translateY(0);-webkit-transform: translateY(0);}
	50% {transform: translateY(-10px);-webkit-transform: translateY(-10px);}
	100% {transform: translateY(0);-webkit-transform: translateY(0);}
}
@-webkit-keyframes loading {
	0% {transform: translateY(0);-webkit-transform: translateY(0);}
	50% {transform: translateY(-10px);-webkit-transform: translateY(-10px);}
	100% {transform: translateY(0);-webkit-transform: translateY(0);}
}
.topBG {
    position: absolute;
    z-index: -1;
	width: 100%;
	height: 615px;
	/*画像のパスを今号のジャンプのimgに変更しました*/
	background: url(/j/weeklyshonenjump/img/headerBG.jpg) center center;
	
 background-repeat: no-repeat;
 background-color:#c70809;
	/*animation: fadeOut 1.5s ease-out 1s 1 both;
	-webkit-animation: fadeOut 1.5s ease-out 1s 1 both;
    opacity: 0;*/
}
@keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: .2;}
}
@-webkit-keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: .2;}
}
.wrapper.top {
	max-height: 615px;
	padding: 30px calc((100% - 1000px) / 2) 30px;
	box-sizing: border-box;
	/*animation: fadeIn 1.5s ease-out 1s 1 both;
	-webkit-animation: fadeIn 1.5s ease-out 1s 1 both;*/
	opacity: 0
}
@keyframes fadeIn {
	0% {opacity: 0}
	100% {opacity: 1;}
}
@-webkit-keyframes fadeIn {
	0% {opacity: 0}
	100% {opacity: 1;}
}
.wrapper.top div section {
    background: rgba(250, 250, 250, .7);
}
.lColumn {
    width: 50%;
}
.lColumn section {
	position: relative;
	padding: 0 0 25px;
 height: 540px;
}

.logo {
   	/* background: url(../img/fukidashi.png);*/
    background-size: cover;
}
.lColumn section .logo {
	position: absolute;
	bottom: 24px;
width: 150px;
	height: 130px;
}


.lColumn section .topbtn-Wrap {
 width: 90%;
 	position: absolute;
 text-align: center;
  z-index: 5;
  font-size: 0;

  right: 0;
  bottom: 11px;
  left: 0;
  margin: auto;
 
}

.lColumn section .topbtn {
 display: inline-block;

 margin: 0 1%;
 bottom: -16px;
 width: 45%;
	height: 34px;
 z-index: 10;
}
.lColumn section .topbtn2 {
 display: inline-block;

 bottom: -16px;
 width: 45%;
	height: 34px;
 z-index: 10;

}
.lColumn section .topbtn a,.lColumn section .topbtn2 a {
 color: #fff;
 min-width: 0;
 font-size: 12px;
  padding: 8px 0;
 display: block;
 width: 100%;
  background-color: #C60000;

}
.lColumn section .topbtn a:hover,.lColumn section .topbtn2 a:hover {
color: #ffff00;
   background-color: #981515;

}




.rColumn section .logo {
	position: absolute;
	bottom: -10px;
	left: -30px;
    width: 110px;
	height: 90px;
}
.logo img {
    /* width: 65%; */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
}
.newGiga .logo img {
    width: 90%;	
}
.newSaikyo .logo img {
    width: 90%;	
}
.newJC .logo img {
    width: 90%;	
}
.newplus .logo img {
    width: 100%;
}
.rColumn {
    display:flex;
    flex-wrap: wrap;
	justify-content: space-between;
	align-content: flex-start;
    width: 48%;
}
.rColumn h2 {
	margin-bottom: 8px;
}
.rColumn section {
	position: relative;
    width: 48%;
	margin-bottom: 20px;
    padding: 0 0 13px;
    box-sizing: border-box;
}
.rColumn section:nth-child(3),
.rColumn section:nth-child(4) {
	margin: 0;
}
.lColumn section h2{
	font-size: 1em;
}
.rColumn section h2 {
	font-size: .9em;
}
.lColumn section a img,
.rColumn section a img {
    display: block;
    margin: auto;
	box-shadow: 5px 5px 5px #aaa;
}
.lColumn section a {
	display: block;
    width: 64%;
	min-width: 251px;
	margin: auto;
}
.rColumn section a {
	display: block;
    width: 58%;
	margin: auto;
}
.lColumn section a img,
.rColumn section a img {
	width: 100%;
}

/* TOPスライダー */
.rensaijin{
	color:#fff;
	font-size:18px;
	width:990px;
	margin:0 0 8px 0;
	}
	
.slider {
	position: relative;
	background-image:url("/j/img/slideBG.jpg");
	background-size:cover;
}
.slider > img {
	width: 100%;
}
.slideSideL,
.slideSideR {
    position: relative;
    width: 18%;
    overflow: hidden;
}
.slideSideL img {
	width: 80%;
}
.slideSideL img:first-of-type {
	position: absolute;
	bottom: -30px;
	right: 0;
	z-index: 1;
}
.slideSideL img:last-of-type {
	position: absolute;
	bottom: 40px;
	right: 0;
}
.slideSideR img {
	width: 230%;
}

@media screen and (min-width:600px) and ( max-width:1050px) {

.slideMain {
	width: 100%;
 overflow: hidden;
	margin:0px auto;
	padding: 20px 0 0;
} 
}
.slideMain {
	position: relative;
	max-width: 1050px;
	margin:0px auto 0;
	padding: 20px 0 0;
}

.slideMainBG {
	padding-bottom: 11px;
	background: #FFF;
		/*background-image:url("/j/img/slideBG3.jpg");*/
	background-size:cover;
	font-size:0;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
}
.slider2 li img {
	border: 1px solid #e4e4e4;
}

.slider2 li img.no_border {
	border: 0px;
}

.slideMain2 {
	position: relative;
	margin:0px auto 0;
	padding: 20px 0 0;
}


 
.slideMain ul {
	display: flex;
	overflow: hidden;
	width:calc(100% - 90px);
	margin: 0 auto;
}
.slideMain ul li {
	margin-right: 10px;
}

.slider2 li {
    width: 146px;
    height:  auto;
}


.slideMain ul li a {
	display: block;
	background: #fff;
}
.slideMain ul li a:hover {
	opacity: 1;
}
.slideMain ul li a img {
	width: 100%;
}
.slideMain ul li a:first-of-type img {
	margin-bottom: 10px;
}
/*.slideMain ul li a:hover img {
	opacity: .5;
}*/
.slideMain ul li p {
    height: 6em;
	margin: 0;
    overflow: hidden;
	color: #fff;
	font-size: .8em;
}
.slideMain ul li p span{
	color:#3F0;
	padding-right:5px;  
}

#arrows {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    width: 100%;
}
#arrows .logo {
	position: absolute;
    width: 40px;
	height: 35px;
}
#arrows .logo img {
	width: 100%;
}
.slick-prev.slick-arrow {
    position: absolute;
    left: 0;
	z-index: 10000;
    width: 40px;
    height: 35px;
}
#arrows .logo.left {
    top: 50%;
	left: 0;
	-webkit-transform: translate(0,-50%);
	-ms-transform: translate(0,-50%);
	transform: translate(0,-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: 58%;
    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;
	-webkit-transform: translate(0,-50%);
	-ms-transform: translate(0,-50%);
	transform: translate(0,-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: 0;
	z-index: 10000;
    width: 40px;
    height: 35px;
}
.banner {
    width: 100%;
	margin: 10px 0 30px;
}
.banner a {
display:block;float:left;width:calc((100% - 20px) / 2); margin-right:20px; margin-bottom:10px;
}
.banner a img {
	display: block;
    width: 100%;
}
.banner a:nth-of-type(2n){margin-right:0;}
.jumpNews {
    display: flex;
    flex-wrap: wrap;
	padding: 0;
}
.jumpNews h2 {
	width: 100%;
    margin: 30px;
}
.jumpNews .newsContents .latestNews .continuation{
	display:none;
}
.jumpNews .newsContents .latestNews ul.more{
	display:block !important;
}
.newsNav {
    width: 159px;
    background: #fff;
}
.newsNav ul {
	flex-direction: column;
	border: none;
    	padding:0;
}
.newsNav ul li {
    width: 100%;
	margin-bottom: 20px;
	padding: .5em 0 .5em 1em;
	text-align: left;
}
.newsNav ul li:hover {
    cursor: pointer;
    opacity: .5;
}
.newsNav ul li:before,
.newsNav ul li:after {
    display: none;
}
.newsNav ul li.current {
	color: #fff;
    background: #C60000;
}
.newsContents {
    width: calc(100% - 159px);
    padding: 0 60px 0 27px;
    box-sizing: border-box;
}
.newsContents > div {
	display: none;
}
.newsContents .current {
	display: block;
}
.newsContents ul {
}
.newsContents ul li {
	margin-bottom: 30px;
}
.newsContents ul li a {
    display: flex;
	color: #000;
}
.newsContents ul li a img {
    width: 100%;
    border:1px solid #DEDEDE;
}
.newsContents ul li p {
    margin: 0;
	padding-left: 1em;
}
.newsContents ul li p time {
    display: block;
	color: #999;
 font-size: .8em;
}
label {
    display: none;
}
input[type="checkbox"] + div {
    height: auto;
}
.s_jump {
    display: none;
}


@media (max-width:910px) {
	nav ul li a {
		paddind: 1em .5em;
		font-size: 10px;
	}
}



/* -------------------------------------------------ローディングアニメーション */
.loader,
.loader:before,
.loader:after {
  border-radius: 50%;
  width: 1.3em;
  height: 1.3em;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: load7 1.8s infinite ease-in-out;
  animation: load7 1.8s infinite ease-in-out;
}
.loader {
  color: #ffffff;
  font-size: 8px;
  margin: 0 auto;
  position: relative;
  text-indent: -9999em;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
.loader:before,
.loader:after {
  content: '';
  position: absolute;
  top: 0;
}
.loader:before {
  left: -2.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.loader:after {
  left: 2.5em;
}
@-webkit-keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}
@keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}







