
.dummy{
  width: 100%;
  height: 747px;
  background-color: slategray;
}
.basketball_content img{
  width: 100%;
}
/* カミングスーン */
.img_box.comingsoon {
  position: relative;
  z-index: 0;
}
.img_box.comingsoon .cs_box{
  position: relative;
  z-index: 0;
}
.img_box.comingsoon .cs_box::before{
  content: "";
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1;
}
.img_box.comingsoon .cs_text{
  position: absolute;
  top: 41%;
  left: 0;
  right: 0;
  text-align: center;
  color: #fff;
  font-size: 4.5em;
  z-index: 2;
}
.cs_date_test{
  color: #fff;
  font-size: 0.5em;
  padding-left: 0.5em;
}

*{
  text-decoration: none;
  margin: 0;
  padding: 0;
}
section{
  width: 100%;
  background-color: #090505;
}
.bg_black{
  background-color: #090505;
}
.bold_text{
  font-weight: 600;
  line-height: 0.8;  
  color: #fff;
  font-family: "Hiragino Sans", sans-serif;
}
.text{
  color: #fff;
  line-height: normal;
  font-size: 16px;
  letter-spacing: 0.09em;
  line-height: 1.3;
  font-family: "Hiragino Sans", sans-serif;
  text-align: center;
}
.section_box{
  width: 75%;
  margin: 0 auto;
  max-width: 1000px;
}

.h2{
  font-family: "Rajdhani", serif;
  font-size: clamp(10%,5vw,46px);
  font-weight: 600;
  color: #fff;
  letter-spacing: 0.04em;
  line-height: 0.8;
  text-align: center;
}
.h3{
  font-family: "Rajdhani", serif;
  font-size: clamp(10%,7vw,85px);
  font-weight: 600;
  color: #fff;
  letter-spacing: 0.04em;
  line-height: 0.8;
  padding-bottom: 28px;
  text-align: center;
}

.btn{
  color: #fff;
  display: block;
  width: 54%;
  padding: 0.7em 0px;
  border: 2px solid #fff;
  margin: 0 auto;
  text-align: center;
  font-size: 20px;
  max-width: 450px;
}
footer{
  margin-top: 0!important;
}

.mt-48{
  margin-top: 48px;
}
.pt-0{
  padding-top: 0;
}

/*------------------------------------------------------------------
  PC
------------------------------------------------------------------*/
/* main_view */
.main_view{
  background-color: #090505;
  background-image: url(https://media.aws.locondo.jp/reebokstatic/common/basketball/img/mainv_pc.jpg);
  background-position: right 23%;
  background-size: contain;
  background-repeat: no-repeat;
  padding-top: calc(22px + 175px);
  margin-top: -20px;
  padding-bottom: 193px;
  margin-top: -21px;
}



.main_text{
  width: 82%;
  margin: 0 auto;
}

.h1{
  font-family: "Rajdhani", serif;
  font-size: clamp(10%,7vw,85px);
  font-weight: 600;
  color: #fff;
  letter-spacing: 0.04em;
  line-height: 0.8;
  padding-bottom: 28px;
  width: 36%;
}
.main_text .bold_text{
  padding-bottom: 18px;
  font-size: clamp(20px,2vw,32px);
  letter-spacing: 0.06em;
}
.main_text .bold_text.fs_middle{
  font-size: 25px;
  color: #e9dbc1;
}
.main_text .text{
    width: 54%;
    line-height: 1.3;
    font-family: "kozuka-gothic-pr6n", sans-serif;
    text-align: left;
}
.main_text .text.subtitle{
  font-size: 18px;
}





.btn_area{
  margin: 100px 0;
}
.btn_list{
  display: flex;
  justify-content: space-between;
}
.btn_list .btn_item{
  width: calc(100%/3 - 20px);
}
.btn_list .btn{
  width: 100%;
  transition: 0.2s ease-in-out;
  position: relative;
}
.btn_list .btn:hover{
  transition: 0.2s ease-in-out;
  background-color: #fff;
  color: #000;
}

.btn_list .btn .new_label{
  background-color: #fff;
  color: #000;
  padding: 0.3em 0.8em 0.25em;
  position: absolute;
  top: -13px;
  left: -12px;
  font-size: 0.8em;
  line-height: 1;
  font-weight: 500;
  border: solid 2px #000;
  transition: 0.2s ease-in-out;
}
.btn_list .btn:hover .new_label{ 
  background-color: #000;
  color: #fff;
  border: solid 2px #fff;
  transition: 0.2s ease-in-out;
}





/*---------------------------------------
  NEW ITEM
-----------------------------------------*/

.newitem_img_area{
  /* display: flex; */
  width: 100%;
  /* justify-content: space-around; */
  margin-bottom: 28px;
}
.newitem_img_area .img_box{
  width: calc(100%/3 - 10px);
}
.newitem_img_area .slick-slide{
  margin: 0 1vw;
}
.newitem_img_area .slick-slide {
  height: auto;
}


.new_item{
  padding-top: 47px;
  padding-bottom: 109px;
}
.new_item .h2{
  margin-bottom: 22px;
}
.newitem_list {
  width: 81%;
  margin: 0 auto;
}
.new_item .item{
  padding-bottom: 1px;
}
.newitem_list.--add_list .img_box{
  margin-top: 5em;
}
.newitem_list.--add_list .newitem_add_list .img_box{
  margin-top: 0;
}
.newitem_list .img_box{
  width: 67%;
  margin: 0 auto;
  padding-bottom: 9px;
  margin-bottom: 82px;
  position: relative;
  padding-top: 15px;
}
.newitem_list .img_box img{
  width: 100%;
  height: auto;
}

.newitem_list .img_box::before,
.newitem_list .img_box::after{
  content: "";
  position: absolute;
  height: 27%;
  width: 29%;
}
.newitem_list .img_box::before{
  top: 0;
  right: -8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;

}
.newitem_list .img_box::after{
  bottom: 0;
  left: -11px;
  border-bottom: 2px solid #fff;
  border-left: 2px solid #fff;
}

.new_item .text_box{
  width: 99%;
  margin-bottom: 48px;
}

.new_item .text{
  letter-spacing: 0.022em;
  margin-bottom: 26px;
}
.newitem_list .btn{
  width: 64%;
}

.newitem_list .slick-dots{
  bottom: auto;
  /* top: calc(43vw); */
  top: calc(2vw + 556px);
}
.newitem_list.--add_list .slick-dots{
/* top: calc(6vw + 556px); */
/* top: max(34vw, 632px); */
top: max(32.6vw, 657px);
}
.newitem_list .slick-dots li.slick-active button:before {
  color: #fff;
  opacity: 1;
}
.newitem_list .slick-dots li button:before {
  color: #5e5e5e;
  opacity: 1;
  font-size: 12px;
}
.newitem_list .slick-prev,
.newitem_list .slick-next {
  top: 24%;
}
.newitem_list.--add_list .slick-prev,
.newitem_list.--add_list .slick-next {
  top: 38%;
}
.newitem_list .slick-prev:before,
.newitem_list .slick-next:before {
  content: "";
  display: block;
  height: 20px;
  width: 20px;
}
.newitem_list .slick-prev:before{
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: rotate(-136deg);
}
.newitem_list .slick-next:before{
  border-top: 1px solid #fff;
  border-left: 1px solid #fff;
  transform: rotate(136deg);
}

.new_item .slick-slide {
  height: auto;
}

/*---------------------------------------
  introducing
-----------------------------------------*/
.introducing .section_box{
  padding-bottom: 125px;
}
.introducing .text{
  padding-bottom: 10px;
}
.introducing .img_box img{
  width: 100%;
}
/*---------------------------------------
  new_technology
-----------------------------------------*/
.new_technology .img_box{
  margin-bottom: 98px;
}
.new_technology .img_box img{
  width: 100%;
}

.new_technology .section_box{
  padding-bottom: 95px;
}

/*---------------------------------------
  gallery
-----------------------------------------*/
.gallery .h2{
  margin-bottom: 30px;
}
.gallery_grid{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  /* padding: 0 30px; */
  padding-bottom: 100px;
}
.gallery_grid .gallery_item{
  width: calc(100% / 3);
  /* width: calc(100% / 4); */
  /* height: calc((100% - 50px) / 6); */
  overflow: hidden;
  margin-bottom: -2px;
}
.gallery_grid .gallery_item img{
  object-fit: cover;
  width: 100%;
  height: 100%;
  transition: .3s ease-out;
}
.gallery_grid .gallery_item img:hover{
  opacity: 1;
  transform: scale3d(1.1, 1.1, 1);
  transition: .3s ease-out;
  transition-property: opacity, transform, filter, stroke-dashoffset;
}
/* .gallery_grid .gallery_item:nth-child(n+7){
  display: none;
} */
.gallery_grid .gallery_item:nth-last-child(-n+2) {
  display: none;
}

/* 1�b�Ԃ����ăt�F�[�h�C�� */
.fadeIn1s {
  animation-name: fadeIn1s;
  animation-delay: 0.8s;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  transform: translateY(0);
  opacity: 0;
}
@keyframes fadeIn1s {
  0% {
  }
  100% {
      transform: translateY(-50px);
      opacity: 1;
  }
}
.scroll_up {
  transition: 0.8s ease-in-out;
  transform: translateY(30px);
  opacity: 0;
}
.scroll_up.on {
  transform: translateY(0);
  opacity: 1.0;
}

.visial_pc{
  display: inline;
}
.visial_sp{
  display: none;
}
.visial_md{
  display: none;
}
.visial_sp_important{
  display: none !important;
}
/*------------------------------------------------------------------
  dots
------------------------------------------------------------------*/
@media screen and (max-width: 1300px) {
  .newitem_list .slick-dots {
    top: calc(45vw);
}
.newitem_list.--add_list .slick-dots{
  top: max(49vw, 520px);
  }
}


/*------------------------------------------------------------------
  SP
------------------------------------------------------------------*/
@media screen and (max-width: 767px) {
  .visial_sp_important{
    display: block !important;
  }
  .visial_pc{
    display: none;
  }
  .visial_sp{
    display: inline;
  }
  .visial_md{
    display: none;
  }
  .h1{
    font-size: clamp(10%,15vw,85px);
    width: 73%;
  }
  .section_box {
    width: 90%;
  }
  .btn {
    width: 87%;
    font-size: 16px;
    border: 1px solid #fff;
  }
  .text{
    font-size: 13px;
  }
  .h2 {
    font-size: clamp(10%,8vw,50px);
  }
  .h3 {
    font-size: clamp(10%,13vw,85px);
  }

/* main_view */
.main_view{
  background-image: none;
  padding: 0;
}
.main_view .innner_SP{
  background-image: url(https://media.aws.locondo.jp/reebokstatic/common/basketball/img/mainv_sp.jpg);
  background-position: center bottom;
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: 100vw;
  margin-bottom: 50px;
}
.main_text .bold_text {
  font-size: 15px;
}
.main_text .text {
  width: 100%;
  text-align: center;
}
.main_text {
  width: 90%;
  margin-top: 95px;
}

.btn_area{
  margin-top: 10px;
  margin-bottom: 58px;
}

.btn_list{
  flex-direction: column;
}
.btn_list .btn_item{
  width: 100%;
  margin-bottom: 33px;
}


.newitem_list .btn{
  width: 99%;
}

.newitem_list {
  width: 95%;
}
.newitem_list .img_box {
  width: 100%;
}
.newitem_list .slick-dots {
  bottom: auto;
  /* top: calc(96vw); */
  top: calc(90vw + 3%);
}
.newitem_list.--add_list .slick-dots {
  top: calc(106vw + 3%);
}
.newitem_list .img_box::before, .newitem_list .img_box::after {
  display: none;
}
.newitem_list .slick-prev, .newitem_list .slick-next {
  top: 18%;
}
.newitem_list .slick-dots li button:before {
  font-size: 8px;
}
.newitem_list .slick-prev {
  left: -17px;
}
.newitem_list .slick-next {
  right: -17px;
}

.introducing .section_box {
  padding-bottom: 45px;
}
.new_technology .section_box{
  width: 100%;
}

.gallery .section_box{
  width: 95%;
}
.gallery_grid {
  padding: 0;
  padding-bottom: 28px;
}

.gallery_grid .gallery_item {
  width: calc((100%) / 2);
  /* height: calc((100vw - 50px) / 3); */
}
.gallery_grid .gallery_item:nth-child(n+7){
  display: block;
}
.gallery_grid .gallery_item:nth-last-child(-n+2){
  display: block;
}


}



@media screen and (min-width: 2000px) {
  /* 映画館で閲覧してるそこのお前へ */
  .newitem_list.--add_list .slick-dots{
    top: max(78%, 657px);
  }
}




.newitem_list.--add_list .slick-prev, .newitem_list.--add_list .slick-next{
  top: 0;
  bottom: 0;
  margin: auto;
}

@media screen and (max-width: 767px) {
  .main_text .bold_text.fs_middle {
    font-size: 20px;
  }
}

.text_box.center .text{
  text-align: center;
}
.mb28{
  margin-bottom: 48px;
}


/* アーカイブ欄追加 */
.archive_item_list{
  display: flex;
  flex-wrap: wrap;
}
.archive_item_list .items{
  width: calc(100% / 3 - 10px);
  margin: 0 5px;
  margin-bottom: 10px;
}
.archive_item_list .items img{
  border-radius: 10px;
  width: 100%;
}
.items .text{
  margin-top: 5px;
}
@media screen and (max-width: 767px) {
  .archive_item_list .items{
    width: calc(96% / 2 - 5px);
  }
  .archive_item_list{
    justify-content: space-between;
  }
  .newitem_list.--add_list .img_box{
    margin-top: 2em;
    margin-bottom: 32px;
  }
  .new_item .h2{
    margin-bottom: 0;
  }
  .newitem_list.--add_list .slick-dots {
        top: calc(101vw + 3%);
    }
    .text_box.center .text{
      text-align: left;
    }
    .new_item {
      padding-top: 5px;
      padding-bottom: 9px;
    }

}

/* LT追加 */
.LT_ul{
  display: flex;
  justify-content: space-around;
  margin-bottom: 30px;
  
}
.LT_ul .items{
  width: calc(80%/2 - 5px);
}
.LT .h2 {
  margin-bottom: 30px;
}
.LT .text {
  margin-bottom: 28px;
}
.LT .section_box {
    padding-bottom: 95px;
}
.LT .img_box{
  width: 65%;
  margin: 0 auto;
  margin-bottom: 28px;
}
.LT .h3{
  text-align: center;
}
@media screen and (max-width: 767px) {
  .LT .img_box{
    width: 100%;
  }
  .LT .section_box {
    padding-bottom: 15px;
  }
  .LT_ul .items {
    width: calc(100% / 2 - 5px);
  }

}