@charset "UTF-8";

/*COMMON*/

body,
html {
  text-align: left;
  text-decoration: none;
}


a {
  color:#3fa9f5;
}
/*デバイス用*/
@media only screen and (min-device-width: 720px) and (max-device-width: 1050px) {

  body,
  html {
    text-align: left;
    text-decoration: none;
    min-width: 1060px;
  }
}

@media screen and (max-width: 769px) {
  body {
    min-width: initial;
  }
}

body {
  -webkit-font-smoothing: antialiased
}

#wrapper {
  overflow-x: hidden;
  overflow-y: hidden;
  background-color: #000;
}

img {
  -webkit-backface-visibility: hidden;
}


@-ms-viewport {
  width: auto;
  initial-scale: 1
}

@viewport {
  width: device-width;
  initial-scale: 1
}

div,
h1,
h2,
h3,
h4,
p {
  font-family: Noto Sans Japanese, sans-serif
}


.loading {
  margin-top: 0;
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 5800;
}

@media screen and (min-width:320px) and (max-width:1050px) {
	body:before {
  content: "";
  width: 115%;
    height: 100vh;
  display: block;
   position: fixed;
  background: url(https://www.snk-corp.co.jp/pre-launch/img/main/mainback_2x.jpg) center no-repeat;
  background-size: cover;
  z-index: -1;
}
  .loading {
    margin-top: 0;
    position: fixed;
    width: 100vw;
    height: 100vh;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: 5800;
  }
}


.textarea_ss {
  font-weight: 400;
  line-height: 1.7em;
  color: #000;
  font-size: 1vw;
}

.textarea_sss {
  font-weight: 400;
  line-height: 1.7em;
  color: #666;
  font-size: 1.3rem;
}

.textarea_s {
  line-height: 1.7em;
  font-size: 1.5rem;

}

.textarea_m {
  line-height: 1.7em;
  font-size: 1.6rem;

}
.textarea_mh {
  line-height: 1.7em;
  font-size: 1.6rem;

}

.textarea_ml {
  line-height: 1.7em;
  font-size: 1.4vw;

}

.textarea_mls {
  line-height: 1.7em;
  font-size: 1.8rem;

}

.textarea_ls {
  font-size: 3rem;
}

.textarea_l {
  font-size: 2.5rem;
}

.textarea_ll {
  font-size: 1.8vw;
}

.textarea_lx {
  color: #000;
  font-size: 2.0vw;
  margin-bottom: 0;
}

.textarea_lxx {
  font-weight: 600;
  line-height: 1.4em;
  color: #000;
  font-size: 1.7vw;
}

.textarea_lxxx {
  font-weight: 600;
  line-height: 1.7em;
  color: #000;
  font-size: 3.0vw;
  margin-bottom: 0;
}

.textarea_lb {
  font-weight: 800;
  line-height: 1.7em;
  color: #000;
  font-size: 2.3rem;
  margin-bottom: 0;
}

@media screen and (min-width:320px) and (max-width:1050px) {
  .textarea_mh {
  line-height: 1.7em;
  font-size: 1.8rem;

}
  .textarea_ls {
    font-size: 5.7vw;
  }

  .textarea_lb {
    font-weight: 800;
    line-height: 1.7em;
    color: #000;
    font-size: 3.8vw;
    margin-bottom: 0;
  }

  .textarea_lxx {
    font-weight: 600;
    line-height: 1.4em;
    color: #000;
    font-size: 4.5vw;
  }

  .textarea_ll {
    font-weight: 600;
    text-align: left;
    line-height: 1.2em;
    color: #000;
    font-size: 4.5vw;
  }

  .textarea_ss {
    font-weight: 600;
    line-height: 1.7em;
    color: #000;
    font-size: 3.4vw;
  }

  .textarea_sss {
    font-weight: 400;
    line-height: 1.3em;
    color: #666;
    font-size: 2rem;
  }

  .textarea_s {
    line-height: 1.7em;
    font-size: 2rem;

  }

  .textarea_m {
    line-height: 1.7em;
    font-size: 1.6rem;

  }

  .textarea_ml {
    line-height: 1.7em;
    font-size: 3.4vw;

  }

  .textarea_mls {
    line-height: 1.7em;
    font-size: 3.4vw;

  }

  .textarea_l {
    font-weight: 600;
    line-height: 2em;
    color: #555;
    font-size: 4.5vw;
		margin-bottom: 0.5em;
  }

  .textarea_lx {
    font-weight: 600;
    line-height: 1.7em;
    color: #fff;
    font-size: 4vw;
  }

  .textarea_lxxx {
    font-weight: 600;
    line-height: 1.7em;
    color: #fff;


  }
}
@media screen and (min-width:720px) and (max-width:1050px) {
	.textarea_ll {
  font-size: 2.8vw;
}
}

.contents_inner {
  position: relative;
  margin-top: 0;
  width: 80%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
}

/*デバイス用*/
@media only screen and (min-device-width: 720px) and (max-device-width: 1050px) {
  .contents_inner {
    position: relative;
    width: 100vw;
    padding-bottom: 0%;
    margin-bottom: 0;
    height: auto;
  }

}


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

  .contents_inner {
    position: relative;
    text-align: justify;
    width: 85%;
    margin-left: auto;
    margin-right: auto;

  }
}




.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden
}

.clearfix {
  min-height: 1px
}

.wdt100 {
  width: 100%
}

@media screen and (min-width:320px) and (max-width:1050px) {
  .rspsv {
    width: 100%
  }
}

.rightbox {
  float: right;
  height: auto;

}

.leftbox {
  float: left;
  height: auto
}

#trigger1 {
  position: absolute;
  margin-top: -300px;
}



.pagetopact {
  position: fixed;

  right: 20px;
  bottom: 20px;
  z-index: 4000;
}

.tac {
  text-align: center;
}

p.indent-1 {
  padding-left: 2em;
  text-indent: -2em;
}

.indent-2 {
  padding-left: 1em;
  text-indent: -1em;
}

p.indent-2 {
  padding-left: 2em;
  text-indent: -1em;
}

img {
  image-rendering: -webkit-optimize-contrast;
}

.header {
  position: fixed;
  margin-top: 0;
  height: 30px;
  width: 100%;

  z-index: 1100;
}


/*UNIQ*/


@media screen and (min-width:320px) and (max-width:1050px) {
  .header {
    position: relative;
    margin-top: 0;
    height: 60px;
    width: 100%;
    z-index: 1100;
    background-color: none;

  }
}

.spperfectsplash {
  position: absolute;
  width: 20%;
  margin-left: 42%;
  margin-top: -1%;
}

.noticetextarea {
  text-align: center;
  color: #fff;
  margin-bottom: 5%;
}

#section1 {
  position: relative;
  width: 100%;
  height: 100vh;
  background-color: #000;
  z-index: 200;

}


.borderline {
  border-top: 1px solid #fff;
  width: 30%;
  margin: 5% auto;
}


/*RESPONSIVE*/

@media screen and (min-width:320px) and (max-width:1050px) {
  #section1 {
    position: relative;
    width: 100%;
    height: auto;
    padding-bottom: 2%;
    margin-top: -15%;
  }

  .borderline {
    border-top: 1px solid #fff;
  }

  .pagetopact {
    position: fixed;

    right: 20px;
    bottom: 20px;
    z-index: 4000;
    width: 15%;
  }
}

.backimg {
  position: fixed;
  width: 100%;
  height: 100vh;
  background-color: #000;
  background-image: url(https://www.snk-corp.co.jp/pre-launch/img/tgs_backimg.jpg);
  background-repeat: no-repeat;
  background-size: 100%;
}

.titlogo {
  width: 80%;
  margin: 35% auto;
  margin-bottom: 0;

}

.headcopy {
  text-align: center;
  margin-top: 3%;
}


.textarea_mainlead_h {
  font-weight: 600;
  color: #fff;
  text-align: center;
  letter-spacing: -0.08em;
}

.textarea_mainlead {
  font-weight: 500;
  color: #fff;
  text-align: justify;
  line-height: 1.75em;
}

.contentswrp {
  border: 1px solid #fff;
  padding: 3em 3em;

}

#section2 {
  position: relative;
  width: 100vw;
  height: 100vh;
  padding-bottom: 5%;

}

.textarea_contentsdate {
  font-weight: 800;
  color: #3fa9f5;
  text-align: left;
  margin-bottom: 0;
}

.textarea_contentstit {
  font-weight: 800;
  color: #fff;
  padding-bottom: 0.5em;
  margin-bottom: 0.8em;
  border-bottom: 1px solid #fff;
}

.sec2left {
  width: 55%;
}

.sec2right {
  width: 40%;
}

.sec2right .wb {
  border: thin solid #fff;
}

.textarea_mainlead_u {
  font-weight: 600;
  color: #fff;

}

.textarea_mainlead_f {
  font-weight: 600;
  color: #fff;
  text-align: center;
}

.overlay {
  position: fixed;
  width: 100%;
  height: 100vh;
  background: #000;
  opacity: 0.8;
}

#section3 {
  width: 100%;
  height: auto;
  padding-top: 0%;
  padding-bottom: 8%;
  
 overflow: hidden;
	  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}
}

.textarea_mainlead_red {
  margin-top: 4%;
  border: 1px solid red;
  padding: 1em 1em;
  color: #fff;
}

#section4 {
  position: relative;
  width: 100%;
  height: auto;
  background-color: #fff;
  padding-top: 12%;
  padding-bottom: 5%;


}

.textarea_notice {
  color: #555;
	font-weight: 500;
	font-size: 1.3rem;
	text-align: center;

}

.campimg {
  margin-bottom: 2em;
}

.textarea_ft {
  color: #fff;
  font-weight: 800;
  text-align: center;
  margin-top: 5%;
}

.kofbnr {
  margin-top: 10%;
  width: 60%;
  margin: 10% auto;
  margin-bottom: 2%;
}

.textarea_ft_credit {
  text-align: center;
  color: #333;
  font-weight: 500;
  font-size: 1.2rem;
}

.snklogo {
  position: absolute;
  margin-top: -5px;
  margin-left: 1%;
z-index: 100;
}

.tgslogo {
  position: absolute;
  right: 1%;
  margin-top: 1%;
}

.kofcopy {
  position: relative;
  margin-top: 1%;
  width: 30%;
  margin: 0 auto;
}


/*RESPONSIVE*/

@media screen and (min-width:320px) and (max-width:1050px) {
	.textarea_notice {
  color: #555;
	font-weight: 500;
	font-size: 3vw;
	text-align: center;
		line-height: 1.5em;

}
	.textarea_ft_credit {
  text-align: center;
  color: #333;
  font-weight: 500;
  font-size: 1.4rem;
	z-index: 100;
}


  #section3 {
    position: relative;
  width: 100%;
  height: auto;
  padding-top: 0;
  padding-bottom: 21%;
  
 overflow: hidden;

  }



  .kofbnr {
    text-align: center;
    margin-top: 10%;
    width: 70%;
  }

  .textarea_ft {
    color: #fff;
    font-weight: 800;
    text-align: center;
    margin-top: 3%;
  }

  .textarea_mainlead_red {
    margin-top: 4%;
    border: 2px solid red;
    padding: 1em 1em;
    color: #fff;
  }

  .textarea_mainlead_u {
    margin-top: 1em;
    font-weight: 600;
    color: #fff;
    word-break: break-all;
  }

  .sec2left {
    width: 100%;
    margin-bottom: 5%;
  }

  .sec2right {
    width: 100%;
  }

  .textarea_contentstit br {
    display: block;
  }

  .kofcopy {
    position: relative;
    margin-top: 1%;
    width: 80%;
    margin: 0 auto;
  }

  .snklogo {
  position: absolute;
  margin-left: 2%;
  margin-top: 2%;
	width: 23%;
	z-index: 100;
  }

  #trigger1 {
    position: absolute;
    margin-top: -50px;
  }

  .titlogo {
    width: 100%;
    margin: 35% auto;
    margin-bottom: 0;

  }

  .textarea_mainlead_h {
    font-weight: 600;
    color: #fff;
    text-align: justify;
  }
}


.h_snslist {
  width: 10%;
  margin: 4% auto;
  margin-bottom: 5%;
}

.h_snslist li {
  float: left;
  margin-right: 16%;
}

.h_snslist li:last-child {
  margin-right: -20%;
}

.tgskofhushtag {
  width: 80%;
  margin: -3.3% auto;
}


@media screen and (min-width:320px) and (max-width:1050px) {
  .tgskofhushtag {
    width: 110%;
    margin: 8% auto;
    margin-bottom: 8%;
    margin-left: -5%;
  }

  .h_snslist {
    width: 20%;
    margin: 2% auto;
  }

  .h_snslist li {
    float: left;
    margin-right: 16%;
  }

  .h_snslist li:last-child {
    margin-right: -20%;
  }
}



#top {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 100%;

  padding-bottom: 0% !important;

  top: 0px;

}

.history_tit {
  position: relative;
}



.snkback2 {
  position: absolute;
  opacity: 1;
  width: 100%;

  z-index: 50;
}

.snkback {
  position: relative;
  top: 0;
}



.top_info_box {
  position: absolute;
  width: 50vw;
  height: 90vh;

  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  z-index: 250 !important;
}

.infobox_infowrp {
  position: relative;
  margin-left: 0;
  width: 50%;
  height: auto;
  text-align: center;
}

@media screen and (min-width:320px) and (max-width:1050px) {
.top_info_box {
  position: absolute;
  width: 50vw;
  height: 60vh;

  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  z-index: 250 !important;
}

.infobox_infowrp {
  position: relative;
  margin-top: 45%;
  margin-left: 0;
  width: 80%;
  height: auto;
  text-align: center;
}

}


#topsub {
  position: relative;
  width: 100%;
  height: 500px;
  background-color: #fff;
}



#loading-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

#loading-spinner {
  width: 50px;
  height: 50px;
  border: 5px solid #000;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 1s infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

#content-container.loaded {
  display: block;
}

.move {
  position: absolute;
  width: 100vw;
  height: 100vh;
  background-color: #fff;
  z-index: 50;
  padding-bottom: 0%;



}

.mask-img {
  mask-image: url("https://www.snk-corp.co.jp/pre-launch/img/main/snkback.svg");
  mask-repeat: no-repeat;
  mask-position: center center;
  mask-object-size: 100%;
  /* Chrome, Safari用 */
  -webkit-mask-image: url("https://www.snk-corp.co.jp/pre-launch/img/main/snkback.svg");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  -webkit-mask-size: 100%;
}

@media screen and (min-width:320px) and (max-width:1050px) {
  .move {
    position: relative;
    width: 100vw;
    height: 100vh;
    z-index: 50;
    background-color: transparent;
    background-size: 170%;
    background-image: url(https://www.snk-corp.co.jp/pre-launch/img/main/snkback_s.svg);
    background-repeat: no-repeat;
    background-position: center center;

  }

  .mask-img {

    display: none;
  }
}

.trigger1 {
  position: absolute;
  margin-top: 12%;
  height: 200px;
}



.move2 {
  width: 100vw;
  height: 100vh;
  position: absolute;
  background-image: url("https://www.snk-corp.co.jp/pre-launch/img/main/snkback2.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100%;

  z-index: 1000 !important;

}

.trigger2 {
  position: absolute;
  margin-top: 10%;
  height: 200px;
  z-index: 1100;
}


.is-active {
  background-color: #fff;
  width: 100%;
  height: 1000px;
}



.move3 {
  position: absolute;
  width: 100vw;
  height: 100vh;
  position: absolute;
  background-image: url("https://www.snk-corp.co.jp/pre-launch/img/main/snkback_arrow_blue.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100%;
  z-index: 500;
}
.move3_o {
  position: absolute;
  width: 100vw;
  height: 100vh;
  position: absolute;
  background-image: url("https://www.snk-corp.co.jp/pre-launch/img/main/snkback_arrow_orange.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100%;
  z-index: 500;
}

.move4 {
  position: absolute;
  width: 100vw;
  height: 100vh;
  position: absolute;
  background-image: url("https://www.snk-corp.co.jp/pre-launch/img/main/snkcopy.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100%;
  z-index: 500;
}

.move5 {
  position: absolute;
  width: 80%;
  margin-top: 0;
  margin-left: 10%;

}


@media screen and (min-width:320px) and (max-width:1050px) {
  .trigger2 {
  position: absolute;
  margin-top: 40%;
  height: 200px;
  z-index: 1100;
}
  .move5 {
    position: absolute;
    width: 90%;
    margin-top: 15vw;
    margin-left: 4%;

  }

  .move2 {
    position: absolute;
    width: 120%;
    margin-top: 20vw;
    z-index: 1000;
  }

}

.textarea_sec3 {
  font-weight: 600;
  color: #fff;
  text-align: center;
  padding-top: 8%;
}

.endtrigger1 {
  position: absolute;

  z-index: 100;
}

.sec4_tit {
  position: relative;
  width: 35%;
  margin: 0 auto;
  padding-top: 11%;
  margin-bottom: 2%;
  z-index: 250;
  
}

.textarea_sec4lead {
  margin-top: 0%;
  margin-bottom: 0;
  font-weight: 600;
  text-align: center;
  line-height: 1.7em;
  color: #fff;
	font-style: italic;
text-shadow: #000 1px 0 10px;

}

@media screen and (min-width:320px) and (max-width:1050px) {
  .sec4_tit {
  position: relative;
  width: 70%;
  margin: 0 auto;
  padding-top: 20%;
  margin-bottom: 2%;
  z-index: 250;
  
}
  .textarea_sec4lead {
  margin-top: 2%;
  margin-bottom: 0;
  font-weight: 600;
  text-align: center;
  line-height: 1.6em;
  color: #fff;
	font-style: italic;
text-shadow: #000 1px 0 10px;

}
}

.sec4_img1 {
  margin-top: 3%;
  margin-left: 7%;
}

.sec4_img2 {
  margin-top: 3%;
  margin-left: 7%;
}

.sec4_histimg {
  position: absolute;

  width: 18%;
}

.sec4_histimg img {
  position: relative;
}

.sec4_img3 {
  margin-top: 3%;
  right: 7%;
}

.sec4_img4 {
  margin-top: 3%;
  right: 7%;
}

.sec4_histarrow {
  width: 100%;

}

.sec4_histarrow li {
  float: left;
  width: 59%;
  margin-right: -20%;
}

.sec4_histarrow li:nth-child(2) {
  margin-left: 1%;
  margin-right: -40%;
  width: 61.5%;
}


.sec4_arrowrp_b {
  width: 100%;
}

.sec4_arrowrp_o {
  width: 100%;
}

.sec3copywrp {
  position: relative;
}

.sec3_movimg {
  position: absolute;
  width: 25%;
  z-index: 50;

}




.sec3_moveimg1 {
  margin-top: -8%;
  left: -1%;
  width: 32%;
}

.sec3_moveimg2 {
  margin-top: 5%;

  left: 2%;
}

.sec3_moveimg3 {
  margin-top: 16%;
  width: 26%;
}

.sec3_moveimg4 {
  right: 14%;
  margin-top: -7%;
}

.sec3_moveimg5 {
  margin-top: -8%;
  right: 0;
  width: 35%;
}

.sec3_moveimg6 {
  right: 3%;
  margin-top: 13%;
}

.sec3_movimg_b {
  position: absolute;

}

.sec3_imgwrp img {
  width: 92%;
  margin: 0% auto;
  margin-left: 5%;
}

.sec4_arrowrp_era_b {
  position: absolute;
  width: 17%;
  margin-top: 4%;
  margin-left: 26%;
  z-index: 60;
}

.sec4_arrowrp_era_o {
  position: absolute;
  width: 17%;
  margin-top: 4%;
  right: 27%;
  z-index: 60;
}

.histarrowbase_b {}

.trigger0 {
  position: absolute;

}


.shadow_01_box {
  display: inline-block;
  transition: all .2s ease-in-out;

}

.shadow_01_box img {
  display: block;
}

.shadow_01_box:hover {
  box-shadow: 10px 10px 10px rgba(0, 0, 0, .2);
}
.sec4_arrowrp_neraarrow_b {
	position: absolute;
	width: 10%;
	margin-left: 40%;
	z-index: 50;

}
.sec4_arrowrp_neraarrow_b2 {
	position: absolute;
	width: 10%;
	margin-left: 25%;
	z-index: 50;
}
.sec4_arrowrp_neraarrow_o {
	position: absolute;
	width: 10%;
	margin-top: 8.4%;
	right: 41.3%;
	z-index: 50;
 
}
.sec4_arrowrp_neraarrow_o2 {
	position: absolute;
	width: 10%;
	margin-top: 8.4%;
	right: 23%;
	z-index: 50;
}


@media screen and (min-width:320px) and (max-width:1050px) {
  .sec4_histarrow {
  width: 222%;
  margin-left: -62%;

}
  .sec4_arrowrp_era_b {
  position: absolute;
  width: 40%;
  margin-top: 9%;
  margin-left: 56%;
  z-index: 60;
}
  .sec4_arrowrp_era_o {
  position: absolute;
  width: 40%;
  margin-top: 9%;
  right: -5%;
  z-index: 60;
}
  .sec4_arrowrp_neraarrow_b {
	position: absolute;
    margin-top: 2%;
	width: 25%;
	margin-left: 84%;
	z-index: 50;
}
  .sec4_arrowrp_neraarrow_b2 {
	position: absolute;
	width: 25%;
	margin-left: 36%;
	z-index: 50;
}
.sec4_arrowrp_neraarrow_o {
	position: absolute;
	width: 25%;
	margin-top: 13%;
	right: 27%;
	z-index: 50;
}
  .sec4_arrowrp_neraarrow_o2 {
	position: absolute;
	width: 25%;
	margin-top:13%;
	right: -35%;
	z-index: 50;
}
}

.histnenpyolist {
  position: relative;
  width: 100%;
  height: auto;
  z-index: 52;

}

.histnenpyolist li {
  float: left;
  width: 7.5%;
  margin-right: -2%;
}

.histnenpyolist li:last-child {
  margin-right: -30%;
}



.eraline {
  position: absolute;
	margin-top: 9.2vw;
  width: 100%;
  border-top: 1px solid #B3B3B3;
  z-index: 51;
}

.eralist {
  position: relative;
}


.sec4_nenpyotit {
  width: 20%;
  margin: 5% auto;
  margin-bottom: 0;
}

.trigger3 {
  position: absolute;
  height: 100px;
}

.eralist {
  position: relative;
}

.eralist li {
  float: left;
  width: 23%;
  margin-right: 3.2%;
}

.eralist li:last-child {
  margin-right: -20%;
}

.eraline_eraselect {
  width: 132%;
  margin-left: -15%;
}

.trigger4 {
  position: absolute;
  margin-top: 10%;
  height: 100px;
}

.sec3_moveimg1_b {
  width: 117%;
  margin-left: -2.8%;
}

.sec3_moveimg2_b {
  width: 120%;
  margin-top: 2%;
	margin-left: -8%;
}

.sec3_moveimg3_b {
  margin-top: 4%;
  width: 111%;
  margin-left: -5%;
}

.sec3_moveimg4_b {
  width: 100%;
  margin-left: 0%;
  margin-top: 4%;
}

.sec3_imgwrp {
  position: relative;
	margin-top: -4%;
  width: 95%;
  margin-left: -0%;
 
}


.sec3_imga_01 {
  position: absolute;
  margin-top: 2%;
  width: 30%;
  right:0;
}

.sec3_imga_02 {
  position: absolute;
  margin-top: 20%;
   width: 20%;
  right:10%;
}

.sec3_imgb_01 {
  position: absolute;
  margin-top: 3%;
  width: 20%;
  left:-3%;
}

.sec3_imgb_02 {
  position: absolute;
  width: 50%;
  left:-15%;
}

.sec3_imgc_01 {
  position: absolute;
  margin-top: 10%;
  width: 40%;
  right:-15%;
}

.sec3_imgc_02 {
  position: absolute;
  margin-top: 20%;
  width: 40%;
  left:-15%;
}


@media screen and (min-width:320px) and (max-width:1050px) {
  
  
.sec3_imga_01 {
  position: absolute;
  margin-top: -5%;
  width: 70%;
  right:-30%;
}

.sec3_imga_02 {
  position: absolute;
  margin-top: 20%;
   width: 20%;
  right:10%;
}

.sec3_imgb_01 {
  position: absolute;
  margin-top:-6%;
  width: 55%;
  left:-18%;
}

.sec3_imgb_02 {
  position: absolute;
  margin-top: 40%;
  width: 70%;
  left:-32%;
}

.sec3_imgc_01 {
  position: absolute;
  margin-top: 72%;
  width: 82%;
  right:-15%;
}

.sec3_imgc_02 {
  position: absolute;
  margin-top: 90%;
  width: 60%;
  left:-5%;
}

  .sec4_nenpyotit {
  width: 80%;
  margin: 7% auto;
  margin-bottom: 5%;
}
  .eralist {
  position: relative;
}

.eralist li {
  float: left;
  width: 48%;
  margin-right: 3.2%;
  margin-bottom: 5%;
}

.eralist li:last-child {
  margin-right: 0%;
}
.eralist li:nth-child(2n) {
  margin-right: -20%;
}
}


.bl_header__nav_ul {
  background-color: #fff;
  display: flex;
  justify-content: space-around;
  padding-top: 8px;
  height: 40px;
  width: 100%;
  position: fixed;

}

.el_header-nav_a {
  color: black;
  font-weight: 600;

  text-decoration: none;
  transition: 0.3s all;
}

.el_header-nav_a:hover {
  text-decoration: none;
  color: #3fa9f5;
}
.el_header-nav_a:hover {
  text-decoration: none;
  color: #3fa9f5;
}

.el_header-nav_a:visited {
  text-decoration: none;
  color: #3fa9f5;
}

.active {
  color: #3fa9f5;
  transition: 0.3s all;
}

.bg-blue {
  background-color: #3fa9f5;
}

ul {
  list-style: none;
}

li {
  padding-left: 0;
}




.bl_header__nav {
  position: relative;
  z-index: 1000;
}

@media screen and (min-width:320px) and (max-width:1050px) {
  .sec3_imgwrp {
  position: relative;
  width: 110%;
  margin-left: -10%;
 
}
  .bl_header__nav_ul {
    background-color: #fff;
    display: inline-block;
    justify-content: space-around;
    padding-top: 8px;
    height: 45px;
    width: 100%;
    position: fixed;
    padding-left: 0.5%;

  }

  .bl_header__nav_ul li {
    display: inline-block;
    width: 23.5%;
    margin-right: 1%;

    text-align: center;
  }

  .bl_header__nav_ul li:last-child {
    margin-right: -20%;
  }

  .bl_header__nav_ul li span {
    display: none;
  }

}



.histtitimg {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
@media screen and (min-width:320px) and (max-width:1050px) {
  .histtitimg {
  position: relative;
  width: 170%;
  height: auto;
    margin-left: -33%;
  overflow: hidden;
}
}

.histpicktits2 {
  font-size: 3rem;
  font-weight: 600;
  margin-top: 0;
}
.histpicktits2 span {
  font-size: 75%;
}


.textara_l {
  font-size: 3.5rem;
}

.hist_picktitimg {
  position: relative;
  margin-bottom: 4%;
  width: 100%;

}


.textara_ll {
  font-size: 5.5rem;
}
@media screen and (min-width:720px) and (max-width:1050px) {
	.textara_ll {
  font-size: 7.5rem;
}
}

.textarea_histpicktitsub {
  padding-top: 2%;
  font-weight: 600;
}


.histpicktits1 span {
  font-size: 50%;
  letter-spacing: -0em;
  font-weight: 600;
  font-family: Noto Sans Japanese, sans-serif
}

.textarea_histlist {
  font-weight: 400;
	color:#333;

}

.textarea_histlist::before {
  content: '';
  /*何も入れない*/
  display: inline-block;
  width: 30px;
  /*画像の幅*/
  height: 15px;
  /*画像の高さ*/
  background-image: url(https://www.snk-corp.co.jp/pre-launch/history/img/nenpyodot.svg);
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
}

.histlist {
  margin-left: -0.5em;
}

.histlist li {
  margin-bottom: 2%;
}
.histlist li a:link {
  color:#0080e2;
}
.histlist li a {
  text-decoration: underline;
}

.histlistwrp {
  margin-top: 3%;
  margin-bottom: 3%;
  margin-left: 5%;
  padding-top: 3%;
  padding-bottom: 2%;

  border-left: 1px dotted #333;
}

.pictitwrp {
  margin-top: 5%;
  margin-bottom: 10%;
}

.textarea_histpickcatch {
  font-weight: 600;
  text-align: center;
	margin-bottom: 2%;
}

.textarea_histpicklead_l {
  font-weight: 400;
  line-height: 1.9em;
  text-align: justify;
  width: 100%;
  margin: 0 auto;
font-size:1.8rem;

}

.textarea_histpicklead {
  font-weight: 400;
  line-height: 1.9em;
  text-align: justify;

}

.textarea_lh {
  font-size: 3.2rem;
}

.pictsume {
  position: relative;
  margin-bottom: 0%;
}

.columntume {
  position: relative;
  margin-top: 10%;
  margin-bottom: 0;
  width: 100%;
}

.columntume img {
  margin-top: -0.5%;
  width: 10%;
}

.columntume p {
  font-size: 1.8rem;
  font-weight: 600;
  color: #3fa9f5;
  margin-bottom: 0;
  margin-left: 1%;
  display: inline-block;
}

.textarea_histpicktit p {
  display: inline-block;
}

.histpicktits1 {
  font-family:  'Fjalla One', sans-serif;
  letter-spacing: -0.01em;
  margin-bottom: 0;font-weight: 600;
}

.histpicktits1 span {
  font-family:  'Fjalla One', sans-serif;
  font-size: 80%;
  font-weight: 600;

}

.textarea_histpicktit {
  margin-top: -0.1em;
}

.histpickleft {
  width: 70%;
}

.histpickright {
  width: 25%;
}

#sec2 {
  height: auto;
padding-bottom: 10%;
}

.bdlin {
  border-top: 1px solid #999;
  padding-bottom: 2%;
}

.columnleft {
  width: 25%;
}

.columnright {
  width: 70%;
}

.textarea_columnlead {
  font-weight: 400;
  text-align: justify;
}

.textarea_columntume {
  font-weight: 600;
  font-size: 2.5rem;
  color: #3fa9f5;
}

.textarea_columntit {
  font-weight: 700;
  color: #000;
  text-align: center;
	margin-bottom:2%;
  letter-spacing: 0.04em;
font-family: 'Noto Serif JP', serif;

}

.columnwrp {
  margin-top: 1%;
  margin-bottom: 8%;
  width: 100%;
  border: 1px solid #999;
  padding: 5% 6% ;

}

#sec1 {
  background-color: #fff;
  padding-bottom: 10%;
  width: 100%;
  height: auto;
}
.textarea_histnav {
  margin-bottom: 0;
  font-size: 1.4rem ;
}

@media screen and (min-width:320px) and (max-width:1050px) {
	.pictsume {
  position: relative;
  margin-bottom: 3%;
		padding-bottom:3%;
		border-bottom:1px solid #333;
}

	.pictitwrp {
  margin-top: 5%;
  margin-bottom: 10%;

}
	.textarea_histlist {
  font-weight: 400;
		padding-left:1.8em;
	text-indent:-1.8em;
		line-height: 1.4em;

}
	.textarea_lh {
  font-size: 2rem;
}

  
  .textarea_histpicklead {
  font-weight: 400;
  line-height: 1.7em;
  text-align: justify;
    margin-bottom: 8%;

}
  .textarea_columnlead {
  font-weight: 400;
  text-align: justify;
    line-height: 1.7em;
}
  .columntume {
  position: relative;
  margin-top: 8%;
  margin-bottom: 3%;
    width: 100%;
}
  .columntume img {
  margin-top: -2%;
		margin-bottom: 2%;
    width: 25%;
}

.columntume p {
  font-size: 2rem;
  font-weight: 600;
  color: #3fa9f5;
  margin-bottom: 0;
  margin-left: 3%;
  display: inline-block;
}
  .textarea_columntit {
  font-weight: 600;
		margin-top: 5%;
  margin-bottom: 5%;
    line-height: 1.5em;
  color: #333;
}
  .columnwrp {
  margin-top: 1%;
  margin-bottom: 5%;
  width: 100%;
  border: 1px solid #999;
  padding: 0% 7% 7% 7%;
    overflow: hidden;

}
  
  
.columnleft {
  width: 90%;
  margin: 0 auto;
  float: none;
}

.columnright {
  width: 88%;
  margin: 5% auto;
  float: none;
}
  
  .bdlin {
display: none;
}
  .histpicktits1 {
  font-family:  'Fjalla One', sans-serif;
  letter-spacing: -0.01em;
  margin-bottom: 0;
		text-align: center;
    font-weight: 600;
}
  .textarea_histpicktit p {
  display: block;
}
  .histpickleft {
  width: 100%;
 margin-bottom: 5%;
}

.histpickright {
  width: 80%;
  margin: 10% auto;
  float: none;

}
  .histpicktits2 {
    margin-top: -0.3em;
  font-size: 2rem;
  font-weight: 600;
		text-align: center;
}
  
  .histlistwrp {
  margin-top: 7%;
  margin-bottom: 7%;
  margin-left: 5%;
  padding-top: 7%;
  padding-bottom: 5%;

  border-left: 1px dotted #333;
}
  
  .textarea_histpicklead_l {
  font-weight: 400;
  line-height: 1.7em;
  text-align: justify;
  width: 100%;
  margin: 0 auto;

}
  .textarea_histnav {
  margin-bottom: 0;
  font-size: 1.6rem ;
}
}


@media screen and (min-width:320px) and (max-width:1050px) {
	.pictsume img {
		width: 25%;
	}
}


@media screen and (min-width:720px) and (max-width:1050px) {
  .columntume img {
  margin-top: -1%;
		margin-bottom: 0%;
    width: 15%;
}
    .histpickleft {
  width: 100%;
 margin-bottom: 0%;
}
    .histpicktits2 {
    margin-top: -0.3em;
  font-size: 2.5rem;
  font-weight: 600;
		text-align: center;
}
  	.textarea_lh {
  font-size: 2.5rem;
}
  	.pictsume img {
		width: 15%;
	}

}


@media screen and (min-width:720px) and (max-width:1050px) {
    .textarea_histpicklead {
  font-weight: 400;
  line-height: 1.7em;
  text-align: justify;
    margin-bottom: 3%;

}
	
.histpickright {
  width: 45%;
}
}

#sec0 {
  width: 100%;
  height: 100vh;
  background-color: #fff;
  
}



  .infobox_infowrp2 {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 30%;
  height: auto;
  transform: translate(-50%, -45%);



}
  .infobox_infowrp23 {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 30%;
  height: auto;
  transform: translate(-50%, -45%);



}


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

  .infobox_infowrp2 {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 70%;
  height: auto;
  transform: translate(-50%, -45%);
  }
	
	  .infobox_infowrp23 {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 70%;
  height: auto;
  transform: translate(-50%, -45%);
  }
  
  }
.sec0_img4 {
  width: 60%;
  margin: 10% auto;
}
.sec23_img4 {
  width: 60%;
  margin: 10% auto;
}

.histtitimg_layer {
  position: absolute;
  width: 32.7%;
  margin-top: -0.15%;
  margin-left: 32%;
  z-index: 100!important;
}
.histtitimg_layer2 {
  position: absolute;
  width: 32.7%;
  margin-top: 1.6%;
  left: 0;
  z-index: 100;
}
.histtitimg_layer3 {
  position: absolute;
  width: 10%;
  
  right:0;
  z-index: 100;
}
.histtitimg_layer4 {
  position: absolute;
  width: 98%;
  margin-top: 1%;
  margin-left: 1%;
  
  z-index: 100!important;
}
.histtitimg_layer5 {
  position: absolute;
  margin-top: 6.5%;
  width: 22%;
  right:10%;
  
  z-index: 100;
}
.histtitimg_layer6 {
  position: absolute;
  margin-top: 14.5%;
  width: 22%;
  right:10%;
  z-index: 100;
}

.histtitimg_base {
  position: relative;
  width: 100%;
  z-index: 50;
}

#luxy {
  z-index: 1000;

}

.trigger_u {
   position: absolute;
  margin-top: 0%;
  height: 200px;
}

#section5 {
	position: relative;
	height: 300px;
}

 #footerwrp {
	 position: relative;
	width: 100%;
	padding-top:5%;
	height: 400px;
	background-color: #fff;
	z-index: 1100;
}

.ftsnk {
	width: 15%;
	margin: 0 auto;
	z-index: 100;
}

.ftsnslist {
	position: relative;
	width: 7%;
	margin: 2% auto;
}
.ftsnslist li {
	width: 35%;
	float: left;
	margin-right: 20%;
}
.ftsnslist li:last-child {
	margin-right: -20%;
}

.notice {
	font-weight: 400;
	font-size: 1.3rem;
	text-align: justify;
	line-height: 1.8em;
	width: 60%;
	margin: 0% auto;
}

.snslist {
	position: relative;
  width: 4%;
  margin: 20px auto;
	z-index: 100;
}
.snslist li {
	float: left;
    width: 29%;
	margin-right: 35%;
}
.snslist li:last-child {
  margin-right: -20%;
}

.notice_img {
	position: absolute;
	right:2%;
	bottom:2%;
	z-index: 100;
	width: 30%;
}

.scroll {
	position: absolute;
	left:1%;
	bottom:2%;
	z-index: 100;
}

@media screen and (min-width:2000px) and (max-width:9999px) {
	
.notice_img {
	position: absolute;
	right:2%;
	bottom:2%;
	z-index: 100;
	width: 25%;
}
}

@media screen and (min-width:1050px) and (max-width:1150px) {
	
.notice_img {
	position: absolute;
	right:2%;
	bottom:2%;
	z-index: 100;
	width: 40%;
}
}

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

	
	  .scroll {
display: none;
}
}



@media screen and (min-width:320px) and (max-width:1050px) {
		.notice_img {
	display: none;
}
.ftsnslist {
	position: relative;
	width: 30%;
	margin: 5% auto;
}
.ftsnslist li {
	width: 40%;
	margin-right: 15%;
	float: left;
}
.ftsnslist li:last-child {
	margin-right: -20%;
}
	.ftsnk {
	width: 50%;
	margin: 5% auto;
	z-index: 100;
}
	.notice {
	font-weight: 400;
	font-size: 1.3rem;
	text-align: justify;
	line-height: 1.8em;
	width: 100%;
	margin: 3% auto;
}
	
  .histtitimg_layer3 {
  position: absolute;
  width: 10%;
  
  right:22%;
  z-index: 100;
}
  .trigger1 {
  position: absolute;
  margin-top: 10%;
  height: 200px;
}

  .scroll {
	position: absolute;
    width: 20%;
	left:40%;
	bottom:10vw;
	z-index: 100;
}
	.snslist {
	position: absolute;
	right:2%;
	margin-top: 2%;
			width: 20%;
	z-index: 100;
}
.snslist li {
	float: left;
	margin-right: 20%;
	width: 35%;
}
.snslist li:last-child {
	margin-right: -40%;
}
	.notice_img {
	position: absolute;
	right:inherit;
	bottom:3%;
	margin-top: 30vw;
	z-index: 100;
	width: 90%;
		margin-left: 3%;
}
	
  .snklogo {
  position: absolute;
  margin-left: 2%;
  margin-top: -5px;
	z-index: 100;
  }
}








.histtitimg_layer_1990_1 {
  position: absolute;
  margin-top: 2.5%;
  margin-left: 2%;
  width: 41%;
  z-index: 100;
}
.histtitimg_layer_1990_2 {
  position: absolute;
  margin-top: 2%;
  margin-left: 30%;
  width: 36%;
  z-index:80;
}

.histtitimg_layer_1990_3-1 {
  position: absolute;
  margin-top: 0%;
  right:0;
  width: 43%;
  z-index:60;
}
.histtitimg_layer_1990_3-2 {
  position: absolute;
  margin-top: 21%;
  margin-left: 30%;
  width: 24%;
  z-index:180;
}
.histtitimg_layer_1990_3-3 {
  position: absolute;
  bottom:0;
  margin-left: 1%;
  width: 8%;
  z-index:80;
}


.histtitimg_layer_1990_4 {
  position: absolute;
  margin-top: 12%;
  right:6%;
  width: 23%;
  z-index:80;
}
.histtitimg_layer_1990_5 {
  position: absolute;
  margin-top: 19%;
  right:6%;
  width: 23%;
  z-index:80;
}

.trigger_u2 {
  position: absolute;
  margin-top: -25%;
}

.hist1990 {
  width: 100%;
  height: auto;
  background-color: #000;
} 

.hist2000 {
  width: 100%;
  height: auto;
  background-color: #000;
}
.hist2023 {
  
  width: 100%;
  height: auto;
  background-color: #fff;

}

@media screen and (min-width:320px) and (max-width:1050px) {
 .hist1990 {
   position: relative;
  width: 170%;
  height: auto;
    margin-left: -33%;
  overflow: hidden;

}
  .hist2000 {
  position: relative;
  width: 170%;
  height: auto;
    margin-left: -33%;
  overflow: hidden;
    background-color: #000;
}
  .hist2023 {
  position: relative;
  width: 170%;
  height: auto;
    margin-left: -33%;
  overflow: hidden;

}
}



@media screen and (min-width:320px) and (max-width:1050px) {
  .histtitimg_layer_1990_1 {
  position: absolute;
  margin-top: 2.5%;
  margin-left: 22%;
  width: 41%;
  z-index: 100;
}
.histtitimg_layer_1990_2 {
  position: absolute;
  margin-top: 2%;
  margin-left: 50%;
  width: 36%;
  z-index:80;
}
}


.histtitimg_layer_2000_1-1 {
  position: absolute;
  width: 50%;
  margin-left: 5%;
  z-index: 100;
}

@media screen and (min-width:320px) and (max-width:1050px) {
  .histtitimg_layer_2000_1-1 {
  position: absolute;
    margin-top: 16vw;
  width: 50%;
  margin-left: 25%;
  z-index: 100;
}
}

.histtitimg_layer_2023_1-1 {
  position: relative;

  width: 100%;
  z-index: 50;
}
.histtitimg_layer_2023_1-2 {
position: absolute;

  width: 100%;
  z-index: 150;
}
.histtitimg_layer_2000_1-2 {
  position: absolute;
  margin-top: 19vw;
  right:14%;
  width: 28%;
  z-index: 100;
}
.histtitimg_layer_2000_2 {
  position: absolute;
  margin-top: 0;
  margin-left:0;
  width: 62%;
  z-index: 80;
}
.histtitimg_layer_2000_3 {
  position: absolute;
  margin-top: 0;
  right:0;
  width: 55.3%;
  z-index: 90;
}
@media screen and (min-width:320px) and (max-width:1050px) {
  .histtitimg_layer_2000_2 {
  position: absolute;
  margin-top: -10%;
  margin-left:0;
  width: 62%;
  z-index: 80;
}
  .histtitimg_layer_2000_3 {
  position: absolute;
  margin-top: 0;
  right:10%;
  width: 45.3%;
  z-index: 90;
}
}

.histtitimg_layer_2000_4-1 {
  position: absolute;
  margin-top: 0;
  right:0;
  width: 50%;
  z-index: 90;
}
.histtitimg_layer_2000_4-2 {
  position: absolute;
  margin-top: 0;
  right:2%;
  width: 14%;
  z-index: 90;
}
.histtitimg_layer_2000_4-3{
  position: absolute;
  margin-top: 22.5vw;
  left:32%;
  width: 25%;
  z-index: 90;
}
.histtitimg_layer_2000_4-4 {
  position: absolute;
  margin-top: 1%;
  left:0;
  width: 20%;
  z-index: 90;
}
.histtitimg_layer_2000_4-5 {
  position: absolute;
  margin-top: 0;
  left:1%;
  bottom:0;
  width: 15%;
  z-index: 90;
}


.trigger_u3 {
  position: absolute;
  margin-top: -10%;
}

.sec3_movimg_a {
  position: absolute;
  width: 50%;
  margin-top:1%;
  margin-left: 25%;
z-index: 180;
	opacity:0.5;
}


.sec3_movimg_c {
	position: absolute;
	margin-top:5.3%;
	width: 51%;
	margin-left: 10%;
    mix-blend-mode:screen;
	z-index: 530;
  opacity:1;
}
.sec3_movimg_c_f {
	position: absolute;
	margin-top:2%;
	width: 59%;
	margin-left: 19%;
    mix-blend-mode:screen;
	z-index: 330;
  opacity:1;
}

.sec3_copywrp {
	position: relative;
	width: 40%;
	margin: 0% auto;
	z-index: 250;
	mix-blend-mode: screen;
}

.sec3_subtit {
	position: relative;
	width: 40%;
	margin: 2% auto;
	margin-bottom: 1%;
	z-index: 350;
}

.sec3_copywrp_l {
	position: relative;
	width: 40%;
	margin: 0 auto;
	z-index: 50;
}


.sec3_overlay {
	position: absolute;
	width: 100%;
	height: 120vh;
	background: url(https://www.snk-corp.co.jp/pre-launch/img/common/05.png), rgba(23, 134, 221, 0.4);
	opacity: 0.8;
	z-index: 10;
}

.textarea_sec4_tit {
	font-weight: 600;
	font-style: italic;
	text-align: center;
	margin-bottom: 3%;
  line-height: 1.3em;
	
}

.blue {
	color:#0080e2;
}
.blue a:link {
  color:#0080e2;
  text-decoration: underline;
}
.blue a:visited {
  color:#0080e2;
  text-decoration: underline;
}
.orange {
	color:#e26500;

}
.orange a:link {
  color:#e26500;
  text-decoration: underline;
}
.orange a:visited {
  color:#e26500;
  text-decoration: underline;
}


.website {
  position: absolute;
  margin-top:0.75%;
  margin-left: 1%;
	width: 10%;
}
.bl_section {
  background-color: #fff;
}


@media screen and (min-width:320px) and (max-width:1050px) {
  .sec3_movimg_c_f {
	position: absolute;
	margin-top:7%;
	width: 70%;
	margin-left: 10%;
    mix-blend-mode:screen;
	z-index: 330;
  opacity:1;
}
.website {
  position: relative;
  right:0;
  margin-top: 2%;
	margin-bottom: 4%;
  margin-left: 3%;
  width: 30%;
}
  .sec3_overlay {
	position: absolute;
	width: 100%;
	height: 114vh;
	background: url(https://www.snk-corp.co.jp/pre-launch/img/common/05.png), rgba(23, 134, 221, 0.5);
	opacity: 0.9;
	z-index: 200;
    margin-top: -5%;
}

  
  .sec3_movimg_a {
  position: absolute;
  width: 90%;
  margin-top:0%;
  margin-left: 2%;
		z-index: 15;
}
  .sec3_copywrp {
	position: relative;
	width: 100%;
	margin: 4% auto;
	z-index: 250;
	mix-blend-mode: screen;
}
  .sec3_subtit {
	position: relative;
	width: 100%;
	margin: 2% auto;
	margin-bottom: 0;
	z-index: 350;
	mix-blend-mode:hard-light;
}
  .sec3_movimg_c {
	position: absolute;
	margin-top:18%;
	width: 71%;
	margin-left: -10%;
    mix-blend-mode:screen;
	z-index: 530;
  opacity:1;
}
}

@media screen and (min-width:720px) and (max-width:1050px) {
	.website {
  position: relative;
  right:0;
  margin-top: 2%;
	margin-bottom: 4%;
  margin-left: 3%;
  width: 20%;
}
}

#sec3 {
  padding-bottom: 10%;
}

.columnimg {
  position: relative;
  margin-bottom: 3%;
}
.columnimg_u {
  position: relative;
  margin-bottom: 3%;
}

#sec4 {
   padding-bottom: 10%;
}



.histtitimg_layer_2023_1-3 {
  position: absolute;
  margin-top: 7%;
margin-left: 33.5%;
  width: 30%;
  z-index: 160;
}
.histtitimg_layer_2023_1-4 {
  position: absolute;
  margin-top: 21vw;
margin-left: 36%;
  width: 25%;
  z-index: 160;
}

.trigger_u4 {
  position: absolute;
  margin-top: -10%;
}
.websitesp {
	display: none;
}

@media screen and (min-width:320px) and (max-width:1050px) {
	.histtitimg_layer_2023_1-3 {
  position: absolute;
  margin-top: 2%;
margin-left: 28.5%;
  width: 40%;
  z-index: 160;
}

	.websitesp {
	display: block;
}
  .columnimg {
  position: relative;
    width: 210%;
    margin-left: -50%;
  margin-bottom: 3%;
}
    .columnimg_u {
  position: relative;
    width: 100%;
  margin-bottom: 3%;
}
  
  .histtitimg_layer_2023_1-4 {
  position: absolute;
  margin-top: 35vw;
margin-left: 31%;
  width: 35%;
  z-index: 160;
}
}


.histimglist {
	position: relative;
	width: 80%;
	margin: 5% auto;
	margin-bottom: 0;
}
.histimglist li {
	width: 23%;
	margin-right: 3%;
	float: left;
}
.histimglist li:last-child {
	margin-right: -30%;
}

@media screen and (min-width:320px) and (max-width:1050px) {
	.histimglist {
	position: relative;
	width: 100%;
	margin: 10% auto;
	margin-bottom: 0;
}
.histimglist li {
	width: 47.5%;
	margin-right: 5%;
	float: left;
	margin-bottom: 5%;
}
.histimglist li:last-child {
	margin-right: -20%;
	
}
	.histimglist li:nth-child(2n) {
	margin-right: -20%;
}
}
	
	
.textarea_websitelink {
	text-align: center;
	margin-bottom: 0;
}

.websitelink {
	position: relative;
	width: 100%;
	margin-top: 0;

}	

.websitelinkwrp {
	position: relative;
	width: 15%;
	margin: 5% auto;
	
}	


	
	@media screen and (min-width:320px) and (max-width:1050px) {
		.textarea_websitelink {
	text-align: center;
	margin-bottom: 0;
}

.websitelink {
	position: relative;
	width: 100%;
	margin-top: 0;

}	

.websitelinkwrp {
	position: relative;
	width: 40%;
	margin: 0 auto;
}	
	}
	
	@media screen and (min-width:720px) and (max-width:1050px) {
         .textarea_m {
    line-height: 1.7em;
    font-size: 2rem;

  }
.textarea_websitelink {
	text-align: center;
	margin-bottom: 0;
}
.websitelink {
	position: relative;
	width: 100%;
	margin-top: 0;

}	

.websitelinkwrp {
	position: relative;
	width: 25%;
	margin: 0 auto;
}	
	}


.mb {
  margin-bottom: 10%;
}

.bgimg {
	width: 100%;
	height: 100vh;
	  position: fixed;
  background: url(https://www.snk-corp.co.jp/pre-launch/img/main/mainback_2x.jpg) center no-repeat;
  background-size: cover;
  z-index: -1;
}



.sec3_blankspace {
  position: relative;
  width: 100vw;
  height: 200px;
  background-color: #fff;
  z-index: 1000;
}

#section6 {
  width: 100%;
  height: auto;

		  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

.textarea_sec6tit {
	position: relative;
 
  font-weight: 600;
  color:#fff;
  text-align: left;
  font-size: 4.2rem;
	z-index: 1200;
}

.textarea_sec6lead {
  position: relative;
  margin-top: 6%;
 
  font-weight: 500;
  color:#fff;
  text-align: left;
  font-size: 1.6rem;
  line-height: 1.9em;
  letter-spacing: 0.1em;
  z-index: 1200;
}
.textarea_sec6lead a {
	cursor: pointer;
	  color:#C1B670;
  font-weight: bold;
	text-decoration: underline;
}

.textarea_sec6lead a:link {
  color:#C1B670!important;
	text-decoration: underline;
}
.textarea_sec6lead a:visited {
  color:#C1B670!important;
	text-decoration: underline;
}
.textarea_sec6lead a:hover {
  color:#C1B670!important;
	text-decoration: underline;
}

#sec23 {
	position: relative;

  width: 100%;
  height: 100vh;
  background-color: #fff;
  

}



#trigger_23 {
	position: absolute;
	margin-top: -10%;

}

.movewrp video {
	position: absolute;
	width: 100%;
		z-index: 900!important;
}

.sec6_infowrp {
	position: relative;
	padding-top:5%;
	padding-bottom:5%;

	width: 50%;
	height: auto;

}


@media screen and (min-width:320px) and (max-width:1050px) {
  .textarea_sec6tit {
	position: relative;
 
  font-weight: 600;
  color:#fff;
  text-align: left;
  font-size: 6vw;
	z-index: 1200;
    text-align: left;
}
  .textarea_sec6lead {
  position: relative;
  margin-top: 7%;
 
  font-weight: 500;
  color:#fff;
  text-align: left;
  font-size: 3.2vw;
  line-height: 1.9em;
  letter-spacing: 0em;
  z-index: 1200;
    text-align: left;
}
	.sec6_infowrp {
	position: relative;
	padding-top:5%;
	padding-bottom:5%;

	width: 100%;
	height: auto;

}

}

.movewrp {
	 position: absolute;
	right:0;
	width: 50%;
	bottom:0;
	z-index: 70;
}

.sec6back {
	position: absolute;
	width: 70%;
	left: 0%;
	z-index: 500;
}

.sec6_infowrpgrd {
position: relative;
	width: 100%;
	height: auto;
	padding-top:5%;
	padding-bottom:5%;
	background: linear-gradient(100deg, rgba(0,128,226,1) 0%,rgba(0,128,226,0.9) 46%,rgba(0,128,226,0.0) 80%); 
}

.trigger17 {
	position: absolute;
  margin-top: 20%;
}
.spbr {
  display: none;
}
@media screen and (min-width:320px) and (max-width:1050px) {
  .sec6_infowrpgrd {

	width: 100%;
	height: auto;
	background: rgba(0,128,226,0.8) ; 
    padding-top:8%;
    padding-bottom:8%;
}
  .spbr {
  display: block;
}
}



.chenge_image {
  position: absolute;
	margin-top: 14%;
  right:-10%;
  width: 100%;
}



#sec00 {
	width: 100vw;
	height: 100vh;
}

@media screen and (min-width:320px) and (max-width:1050px) {
	
.chenge_image {
  position: absolute;
  right:-18%;
  width: 80%;
  text-align: center;
	margin-top: 35%;
	opacity: 0.3;
}

}


.w_wall {
	position: absolute;
	width: 150px;
	height: 150vh;
	background-color: #fff;
	z-index: 200;
}

.leftwall {
	left:0;
}
.rightwall {
	right:0;
}

.sec6titimg {
	position: relative;
	width: 110%;
margin-left: -2%;
}
.textarea_mscap {
  font-size: 1.2rem;
}
.hist {
   position: absolute;
	margin-top: 17%;
  right:-55%;
  width: 180%;
  text-align: center;
}

.sec6_inforight {
	position: relative;
	width: 50%;
}
@media screen and (min-width:320px) and (max-width:1050px) {
	.w_wall {
	position: absolute;
	width: 80px;
	height: 140vh;
	background-color: #fff;
	z-index: 280;
}
	.sec6titimg {
	position: relative;
	width: 115%;
margin-left: -7%;
}
	.textarea_mscap {
  font-size: 2vw;
}
  .hist {
   position: absolute;
	margin-top: 45%;
  right:-35%;
  width: 145%;
  text-align: center;
}

.sec6_inforight {
	position: relative;
	width: 100%;

}

}


.textarea_caption {
  margin-top: 0.5em;
  color:#333;
  font-weight: 500;
}



.nenpyowrp {
	margin-top: 1%;
}

.ml {
	margin-left:0.5%;
}

.sec6titimg_sub {
	margin-top: 2%;
	margin-left: -1%;
}

.js-header {
	position: relative;
	z-index: 1000;
}

.js-nav-content {
	
}

.pbhead {
	position: relative;
	height: 200px;
	width: 100%;
	background:#000;
	margin-bottom: 4%;
	z-index: 1000;
}

.pbheadlogo {
	width: 400px;
	margin: 0 auto;
	padding-top:50px;
}

.textarea_pbhead {
	text-align: center;
	font-weight: 600;
	line-height: 1.6em;
	
}

.pblist {
	position: relative;
	margin-top: 3%;
}

.pblist li {
	float: left;
	width: 23%;
	margin-right: 2.7%;
	
}
.pblist li:last-child {
	margin-right: -20%;
}

.new {
	position: absolute;
	width: 5%;
	margin-top: -1%;
	margin-left: -1%;
}

.secpb_volume {
	background-color: #0082ff;
	padding:1px 15px;
	font-size: 1rem;
	font-weight: 600;
	text-align: center;
	float: left;
	color:#fff;
	margin-right: 1em;
}

.secpb_listdate {
	font-size: 1.2rem;
	color:cornflowerblue;
	font-weight: 600;
	
}

.secpb_list_textarea {
	margin-top: 0.5em;
	font-weight: 500;
	font-size: 1.5rem;
	line-height: 1.5em;
	color:#000;
}

.mt10 {
	margin-top: 2%;
}

.pbimg {
		padding-bottom: 5%;
}

#playback {
	position: relative;
	padding-bottom:5%;
}

@media screen and (min-width:320px) and (max-width:1050px) {
	.pblist {
	position: relative;
	margin-top: 3%;
}

.pblist li {
	float: left;
	width: 47.5%;
	margin-right: 6%;
	margin-bottom: 5%;
	
}
.pblist li:last-child {
	margin-right: 0%;
}
	.pblist li:nth-child(2n) {
	margin-right: -20%;
}
}

.contbox {
	margin-top: 1%;
	border:#999 solid 1px;
	padding:6% 8%;
}

.textarea_colhead {
	font-size: 3rem;
	font-weight: 600;
	margin-bottom: 0;
	margin-top: 0;

}

.textarea_colsubhead {
	position: relative;
	font-size: 2.1rem;
	font-weight: 700;
	margin-bottom: 0;
	margin-top: 0;
}

.textarea_collead {
	margin-top: 1em;
	font-size: 1.7rem;
	font-weight: 500;
	line-height: 1.6em;
}

.pbvol_b {
	position: absolute;
	background-color: #0082ff;
	padding:5px 15px;
	color:#fff;
	font-weight: 600;
	text-align: center;
	width:100px;
	margin-top: 9px;
	right:0;
}

.pbcoltitimg {
	position: relative;
}

.imglist {
	position: relative;
}

.imglist li {
	float: left;
	width: 22.5%;
	margin-right: 3%;
}
.imglist li:last-child {
	margin-right: -20%;
	
}


.kokodake {
	font-size: 110%;
	font-weight: 600;
}

.imgcap {
	font-weight: 500;
	font-size: 1.2rem;
}
@media screen and (min-width:320px) and (max-width:1050px) {
	.imglist {
	position: relative;
}

.imglist li {
	float: left;
	width: 47%;
	margin-right: 5%;
	margin-bottom: 5%;
}
.imglist li:last-child {
	margin-right: 0%;
	
}
	.imglist li:nth-child(2n) {
	margin-right: -20%;
	
}


.kokodake {
	font-size: 110%;
	font-weight: 600;
}

.imgcap {
	font-weight: 500;
	font-size: 1.2rem;
}
	
	.textarea_colsubhead {
	position: relative;
	font-size: 2.1rem;
		line-height: 1.5em;
	font-weight: 700;
	margin-bottom: 0;
	margin-top: 0;
}
}
.bttbtn {
	position: relative;
	width: 20%;
	margin: 10%	 auto;
}

.prevbtn {
	position: absolute;
	left:0;
}
.nextbtn {
	position: absolute;
	right:0;
}

.textarea_pn {
	font-weight: 600;
	
}
@media screen and (min-width:320px) and (max-width:1050px) {
	.textarea_pn {
	font-weight: 600;
	font-size: 2rem;
		
	
}
	.bttbtn {
	position: relative;
	width: 50%;
	margin: 15%	 auto;
}
  .snslist {
	position: relative;
  width: 20%;
  margin: 20px auto;
	z-index: 100;
}
.snslist li {
	float: left;
    width: 35%;
	margin-right: 35%;
}
.snslist li:last-child {
  margin-right: -25%;
}

}
.credit {
	text-align: center;
	font-weight: 400;
	font-size: 1.2rem;
}

.portalright {
  position: relative;
  width: 50%;
  height: 82vh;
  background-image: url(https://www.snk-corp.co.jp/pre-launch/img/mainback_garou.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  
}

.portalleft {
  position: relative;
   width: 50%;
  height: 82vh;
  background-image:url(https://www.snk-corp.co.jp/pre-launch/img/mainback_ms.jpg);
  background-repeat: no-repeat;
   background-size: cover;
  background-position: center center;
}

#portalwrp {
  position: relative;
}

.portallogo {
  width: 100%;
}

.portalleft {
  
}

#portalbottom {
  position: relative;
  height: auto;
  background-color:black;
  padding-top:1%;
  padding-bottom:1%;
  width: 100%;
  margin-bottom: 0.5%;
}

.portalbottomcopy {
  width: 50%;
  margin: 0 auto;
}

.headerwrp {
  position: relative;
  height: 25px;
  width: 100%;
  background-color: #fff;
}

.textarea_headlink {
  position: absolute;
  margin-top: 5px;
  right:1%;
  color:#999;
  z-index: 100;
  font-size: 1rem;
}
.textarea_headlink a:link {
  text-decoration: none;
  color:#999;
}
.textarea_headlink a:visited {
  text-decoration: none;
  color:#999;
}
.textarea_headlink a:hover {
  text-decoration: none;
  color:#999;
}

@media screen and (min-width:320px) and (max-width:1050px) {
  .portalright {
  position: relative;
  width: 50%;
  height: 72vh;
  background-image: url(https://www.snk-corp.co.jp/pre-launch/img/mainback_garou.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  
}

.portalleft {
  position: relative;
   width: 50%;
  height: 72vh;
  background-image:url(https://www.snk-corp.co.jp/pre-launch/img/mainback_ms.jpg);
  background-repeat: no-repeat;
   background-size: cover;
  background-position: center center;
}
  .portalbottomcopy {
  width: 90%;
  margin: 5% auto;
}
}
.portalft {
  background-color: #fff;
  padding-top:5px;
  padding-bottom:5px;
  height: auto;
}


.loading {
  margin-top: 0;
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 5800;
}