ul,li{
	list-style:none;
}
.pc-only{
	display: block;
}
.sp-only{
	display: none;
}
.container{
  max-width: 976px;
  margin: 0 auto;
}
.contain{
	width:1200px;
	margin: auto;
}
.fadein-late,
.fadein {
	opacity : 0;
	transform : translate(0, 10px);
	transition : all 1500ms;
}
.fadein-late.scrollin,
.fadein.scrollin {
	opacity : 1;
	transform : translate(0, 0);
}
.main-page{
  background: #0a0d2b url(../img/bg_line_pc.png) no-repeat -20px 1000px;
  color: #fff;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif;
  text-align: center;
}
.main-page a:hover{
  opacity: 0.7;
}
#lead{
  margin: 50px auto;
}
#lead p{
  font-size: 22px;
  line-height: 2;
}
#link ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#link ul li{
  margin: 0 15px 15px;
}
#link ul li.spacer{
  width: 100%;
}
#innovation_01,
#innovation_02,
#innovation_03,
#innovation_04,
#innovation_05{
  padding-top: 100px;
}
.detail{
  text-align: left;
  background-image: url(../img/bg_detail_pc.png);
  background-repeat: repeat-y;
  padding-bottom: 30px;
  position: relative;
  padding-top: 240px;
}
#innovation_01 .detail{
  padding-top: 200px;
}
.detail h2{
  margin-bottom: 40px;
  position: absolute;
  top: -40px;
}
.detail p{
  font-size: 18px;
  line-height: 2;
}
.detail_img {
  margin-top: 20px;
}
.detail_img p{
  text-align: center;
}
.sub-detail {
  margin: 50px auto 0;
}
.sub-detail h3{
  margin-bottom: 30px;
}
.sub-detail p{
  font-size: 18px;
  line-height: 2;
}
.movie{
  width: 824px;
  margin: 50px auto 0;
  background: linear-gradient(90deg, rgba(10, 13, 43, 0.5), rgba(35, 38, 65, 0.7));
  padding: 20px;
}
.movie h3{
  margin-bottom: 50px;
}
.movie video {
  width: 100%;
}
.btn a {
  border: solid 1px #fff;
  padding: 10px;
  color: #fff;
  display: inline-block;
  background-color: rgba(35, 38, 65, 0.8);
  width: 300px;
  font-size: 20px;
  margin: 30px auto 10px;
}
_:-ms-input-placeholder .btn a, :root .btn a {
  padding: 15px 10px 10px;
}
.btn p {
  font-size: 14px;
}
.flex {
  display: flex;
}
.detail .flex p {
  margin-right: 20px;
}
.detail .flex  p.pr-box{
  border: solid 1px #fff;
  border-radius: 15px;
  width: 300px;
  font-size: 14px;
  padding: 10px;
  text-align: center;
  margin: 20px;
  background-color: #3b3e56;
}


#lineup {
  margin-top: 100px;
  padding-bottom: 100px;
}
#lineup h4{
  margin-bottom: 50px;
}
#lineup ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#lineup ul li{
  margin: 40px 20px;
}
#bnr{
  margin: 0 auto 50px;
}




@media only screen and (max-device-width: 1280px) and (max-width: 640px) {
  .pc-only{
    display: none;
  }
  .sp-only{
    display: block;
  }	
  .container{
    width: 95%;
    margin:auto;
  }
  .contain {
    width: auto;
  }
  .main-page {
    background: #0a0d2b url(../img/bg_line_pc.png) no-repeat 50% 700px;
  }
  #lead p img{
    max-width: 70%;
    margin-bottom: 30px;
  }
  #lead p{
    font-size: 15px;
  }
  #link ul li {
    margin: 0 5px 10px;
    width: 40%;
  }
  .detail{
    background-image: url(../img/bg_detail_sp.png);
    padding-top: 180px;
  }
  #innovation_01 .detail {
    padding-top: 140px;
  }
  .detail h2 img {
    height: 180px;
  }
  #innovation_01 .detail h2 img {
    height: 140px;
  }
  #innovation_01 .detail .detail_img .sp-only img,
  #innovation_03 .detail .detail_img img{
    max-width: 80%;
  }
  .detail p {
    font-size: 15px;
  }
  .detail h2{
    top: -20px;
  }
  .movie {
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
  }
  #lineup {
    padding-bottom: 50px;
  }
  #lineup ul{
    background: linear-gradient(rgba(10,13,43,0) 50%,rgba(10,13,43,1));
    padding-bottom: 100px;
  }
  #lineup ul li {
    margin: 20px 15px;
    width: 40%;
  }
  #lineup ul li:nth-child(3) {
    margin: 20px 50px;
  }
  #innovation_05 .movie.container{
    width: 100%;
  }
  .flex {
    flex-wrap: wrap;
  }
  .detail .flex p {
    margin-right: 0px;
  }
  .detail .flex p.pr-box{
    margin: 10px auto;
  }
  .sub-detail p {
    font-size: 15px;
    text-align: left;
  }
  #bnr img{
    width: 80%;
  }
}