html{
  font-size: 62.5%;
}

@media screen and (min-width: 768px) and (max-width: 1280px){
  html {
    font-size: calc((10 * (100vw / 1400)));
  }
}

@media screen and (max-width: 767px) {
	html{
		font-size: calc(10 * (100vw / 750));
	}
}


#contAll{
  font-family: 'Noto Sans', 'noto-sans', 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: calc(12 * (100vw / 750));
  line-height: 2.08;
  letter-spacing: 0.03em;
  color: #000;
  text-align: center;
  width: 100%;
  margin: calc(22 * (100vw / 750)) auto calc(184 * (100vw / 750));
}

#contAll .en {
  font-family: "usual", 'Noto Sans', 'noto-sans', 'Noto Sans JP', sans-serif !important;
  font-weight: 400;
  letter-spacing: 0;
}

/*** Responsive ***/
#contAll .pcOnly{
  display: none;
}

/*** Picture ***/
#contAll img{
  width: 100%;
  height: auto;
}
#contAll picture{
  display: block;
  width: 100%;
  height: auto;
}
#contAll a{
  width: 100%;
  height: 100%;
  display: block;
  text-decoration: none;
}

/*** Hover ***/
#contAll a:hover{
  transition: 0.5s;
  opacity: 0.6;
}
#contAll a img:hover{
  transition: 0.5s;
  opacity: 0.6;
}

/*** MainVisual ***/
#contAll .mvWrap{
  margin: calc(23 * (100vw / 375)) auto 0;
}
/*** TxtWrap ***/
#contAll .mvWrap .txtWrap h3{
  font-size: calc(31 * (100vw / 375));
  font-weight: 600;
  line-height: 1.194;
  letter-spacing: normal;
  text-align: center;
  color: #000;
}
#contAll .mvWrap .txtWrap p{
  font-size: calc(10 * (100vw / 375));
  line-height: 2;
  letter-spacing: normal;
  margin: calc(11 * (100vw / 375)) auto 0;
}
/*** ImgWrap ***/
#contAll .mvWrap .imgWrap{
  width: calc(328 * (100vw / 375));
  position: relative;
  margin: calc(23 * (100vw / 375)) auto 0;
}
#contAll .mvWrap .imgWrap::before,
#contAll .mvWrap .imgWrap::after{
  display: block;
  font-size: calc(10 * (100vw / 375));
  font-weight: 600;
  line-height: 2;
  text-align: left;
  position: absolute;
  bottom: calc(-25 * (100vw / 375));
}
#contAll .mvWrap .imgWrap::before{
  font-family: 'usual';
  content: "COORDINATE -";
  letter-spacing: 0;
  left: 0;
}
#contAll .mvWrap .imgWrap::after{
  font-family: 'Noto Sans', 'noto-sans', 'Noto Sans JP', sans-serif;
  content: "10";
  letter-spacing: 0.03em;
  left: calc(77 * (100vw / 375));
}

/*** LeadFst ***/
#contAll .mvWrap .leadFst{
  font-size: calc(12 * (100vw / 375));
  font-weight: 500;
  line-height: 2.25;
  letter-spacing: 0.03em;
  margin: calc(62 * (100vw / 375)) auto 0;
}

/*** ContWrap ***/
#contAll .contWrap{
  margin: 0 auto 0;
}
#contAll .contWrap{
  position: relative;
}
#contAll .contWrap .cont01{
  margin: calc(97 * (100vw / 750)) auto 0;
}
#contAll .contWrap .cont02{
  margin: calc(57 * (100vw / 750)) auto 0;
}
#contAll .contWrap .cont03{
  margin: calc(55 * (100vw / 750)) auto 0;
}
/*** border ***/
#contAll .borderWrap{
  width: calc(312 * (100vw / 375));
  margin: auto;
  position: relative;
  padding: 0 0 calc(33 * (100vw / 375));
}
#contAll .itemName .fadeBorderLeft{
  position: absolute;
  left: 0;
  height: 1px;
  margin: 0 auto;
  background: #000;
  transition: 1s;
}

/*** ItemName ***/
#contAll .itemName h3{
  font-family: usual, sans-serif;
  font-style: normal;
  font-size: calc(16.2 * (100vw / 375));
  letter-spacing: 0;
  line-height: 1.42;
  text-align: center;
}
#contAll .itemName h3 span{
  font-weight: 400;
}
#contAll .itemName p{
  font-size: calc(13 * (100vw / 375));
  line-height: 2.31;
  letter-spacing: 0.03em;
}
#contAll .itemName .en{
  font-weight: 600;
  display: inline-block;
}
#contAll .cont01 .itemName p{
  margin: calc(18 * (100vw / 375)) auto 0;
}
#contAll .cont02 .itemName p{
  margin: calc(27 * (100vw / 375)) auto 0;
}
#contAll .cont03 .itemName p{
  margin: calc(30 * (100vw / 375)) auto 0;
}

/*** itemWrap ***/
#contAll .itemWrap ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto;
}
#contAll .cont01 .itemWrap{
  margin: calc(32 * (100vw / 375)) auto 0;
}
#contAll .cont01 .itemWrap ul{
  width: calc(616 * (100vw / 750));
}
#contAll .cont01 .itemWrap li{
  width: calc(196 * (100vw / 750));
}
#contAll .cont02 .itemWrap{
  margin: calc(35 * (100vw / 375)) auto 0;
}
#contAll .cont02 .itemWrap ul{
  width: calc(563 * (100vw / 750));
}
#contAll .cont02 .itemWrap li{
  width: calc(176 * (100vw / 750));
}
#contAll .cont03 .itemWrap{
  margin: calc(32 * (100vw / 375)) auto 0;
}
#contAll .cont03 .itemWrap ul{
  width: calc(492 * (100vw / 750));
}
#contAll .cont03 .itemWrap li{
  width: calc(222 * (100vw / 750));
}
#contAll .cont03 .itemWrap li:nth-child(3),
#contAll .cont03 .itemWrap li:nth-child(4){
  margin: calc(14 * (100vw / 375)) auto 0;
}

/*** Lead ***/
#contAll .leadTxt{
  font-size: calc(12 * (100vw / 375));
  font-weight: inherit;
  line-height: 2.08;
  letter-spacing: 0.01em;
  margin: calc(15 * (100vw / 375)) auto 0;
}
#contAll .leadTxt span{
  font-weight: 500;
}

/*** SlideWrap ***/
#contAll .slideWrap{
  position: relative;
  padding: 0 0 calc(52 * (100vw / 375));
}
/*** Slider ***/
#contAll .modelSlider{
  margin: calc(72 * (100vw / 375)) auto 0;
}
#contAll .modelSlider.slick-initialized {
  display: block;
}
#contAll .modelSlider .slick-slide {
  position: relative;
  width: calc(289 * (100vw / 375));
  display: block;
  padding: 0 calc(11 * (100vw / 375));
}
/*** TaxtWrap ***/
#contAll .taxWrap{
  font-size: calc(13 * (100vw / 375));
  letter-spacing: 0.03em;
  line-height: 1.72;
  text-align: left;
}
#contAll .taxWrap .taxTxt{
  font-weight: 400;
}
#contAll .taxWrap .taxNumb{
  font-weight: 500;
}
#contAll .cont01 .taxWrap{
  margin: calc(18.5 * (100vw / 375)) auto 0 calc(54 * (100vw / 375));
}
#contAll .cont02 .taxWrap{
  margin: calc(20.5 * (100vw / 375)) auto 0 calc(54 * (100vw / 375));
}
#contAll .cont03 .taxWrap{
  margin: calc(19.5 * (100vw / 375)) auto 0 calc(54 * (100vw / 375));
}
/*** sizeTxt ***/
#contAll .sizeTxt{
  font-family: 'Noto Sans', 'noto-sans', 'Noto Sans JP', sans-serif;
  font-size: calc(12 * (100vw / 375));
  font-stretch: normal;
  font-style: normal;
  line-height: 2.5;
  letter-spacing: 0.03em;
  text-align: left;
  color: #000;
  position: absolute;
  bottom: 0;
  left: calc(54 * (100vw / 375));
}
#contAll .sizeEn{
  font-weight: 600;
}
#contAll .sizeNumb{
  font-family: 'Noto Sans', 'noto-sans', 'Noto Sans JP', sans-serif;
  font-weight: 700;
}
/*** viewAll ***/
#contAll .viewAll{
  font-family: usual, sans-serif;
  letter-spacing: 0;
  font-style: normal;
  margin: calc(67 * (100vw / 375)) auto 0;
  padding: 0 0 calc(2 * (100vw / 375));
  display: inline-block;
  font-size: calc(13 * (100vw / 375));
}

#contAll .viewAll a{
  font-weight: 600;
}

#contAll .viewAll .fadeBorderLeft{
  height: 1px;
  background: #000;
  margin: 0 auto;
  transition: 1s;
}

.footer .footer-nav .pagetop {
  padding-top: calc(45 * (100vw / 750));
  margin: 0 calc(40 * (100vw / 750)) calc(91 * (100vw / 750));
}

@media screen and (min-width: 768px) {
  /*** Responsive ***/
  #contAll .spOnly{
    display: none;
  }

  #contAll .pcOnly{
    display: block;
  }

  #contAll{
    margin: 12rem auto -3.6rem;
  }

  /*** MainVisual ***/
  #contAll .mvWrap{
    padding: 4rem 0 0;
    margin: 11rem auto 0;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  /*** TxtWrap ***/
  #contAll .mvWrap .txtWrap{
    margin: -5.1rem 0 0;
  }
  #contAll .mvWrap .txtWrap h3{
    font-size: 4.5rem;
    line-height: 1.2em;
  }
  #contAll .mvWrap .txtWrap p{
    font-size: 1.4rem;
    margin: 2.5rem auto 0;
  }
  /*** ImgWrap ***/
  #contAll .mvWrap .imgWrap{
    width: 60.9rem;
    margin: 0 9.6rem 0 6.5rem;
  }
  #contAll .mvWrap .imgWrap::before,
  #contAll .mvWrap .imgWrap::after{
    font-size: 1.7rem;
    line-height: 1.06;
    top: -3.7rem;
    height: fit-content;
  }
  #contAll .mvWrap .imgWrap::before{
    left: 22.6rem;
  }
  #contAll .mvWrap .imgWrap::after{
    left: 35.6rem;
  }
  /*** LeadFst ***/
  #contAll .mvWrap .leadFst{
    font-size: 1.8rem;
    line-height: 2.5;
    text-align: left;
    margin: -5.5rem 4.7rem 0 0;
  }

  /*** ContWrap ***/
  #contAll .contWrap{
    width: 160rem;
  }
  #contAll .contWrap .cont01{
    margin: 11.2rem auto 0;
    position: relative;
  }
  #contAll .contWrap .cont02{
    margin: 14rem auto 0;
    position: relative;
  }
  #contAll .contWrap .cont03{
    margin: 14rem auto 0;
    position: relative;
  }

  /*** border ***/
  #contAll .borderWrap{
    width: auto;
    margin: 0;
    padding: 0;
  }
  #contAll .fadeBorderLeft{
    height: 1px;
    background: #000;
    transition: 1s;
    position: absolute;
    top: 0;
    left: 0;
  }

  /*** ItemName ***/
  #contAll .itemName{
    margin: 0 auto;
  }
  #contAll .itemName h3{
    font-size: 2.5rem;
    line-height: 1.8;
  }
  #contAll .cont01 .itemName h3{
    padding: 13.7rem 0 0;
  }
  #contAll .cont02 .itemName h3{
    padding: 14rem 0 0;
    line-height: 1.6;
  }
  #contAll .cont03 .itemName h3{
    padding: 13.7rem 0 0;
  }
  #contAll .itemName p{
    font-size: 1.8rem;
    letter-spacing: 0.03em;
    line-height: 1.6;
  }
  #contAll .cont01 .itemName p{
    margin: 3.5rem auto 0;
  }
  #contAll .cont02 .itemName p{
    margin: 5.4rem auto 0;
  }
  #contAll .cont03 .itemName p{
    margin: 5.4rem auto 0;
  }
  /*** itemWrap ***/
  #contAll .cont01 .itemWrap{
    margin: 4.6rem auto 0;
  }
  #contAll .cont02 .itemWrap{
    margin: 5.6rem auto 0;
  }
  #contAll .cont03 .itemWrap{
    margin: 4.4rem auto 0;
  }

  /*** itemWrap ***/
  #contAll .cont01 .itemWrap ul{
    width: 70rem;
  }
  #contAll .cont01 .itemWrap li{
    width: 18.7rem;
  }
  #contAll .cont02 .itemWrap ul{
    width: 60rem;
  }
  #contAll .cont02 .itemWrap li{
    width: 17.4rem;
  }
  #contAll .cont03 .itemWrap ul{
    width: 101.1rem;
  }
  #contAll .cont03 .itemWrap li{
    width: 21.7rem;
  }
  #contAll .cont03 .itemWrap li:nth-child(3),
  #contAll .cont03 .itemWrap li:nth-child(4){
    margin: 0;
  }

  /*** Lead ***/
  #contAll .leadTxt{
    font-size: 1.7rem;
    letter-spacing: 0.03em;
    line-height: 2.3;
    margin: 2.8rem auto 0;
  }

  /*** SlideWrap ***/
  #contAll .cont01 .slideWrap{
    padding: 0 0 6.5rem;
  }
  #contAll .cont02 .slideWrap{
    padding: 0 0 6.7rem;
  }
  #contAll .cont03 .slideWrap{
    padding: 0 0 6.5rem;
  }
  /*** Slider ***/
  #contAll .modelSlider{
    position: relative;
    width: 69rem;
    margin: 11.5rem auto 0;
  }
  #contAll .modelSlider .slick-slide {
    position: relative;
    width: 48.4rem;
    display: block;
    padding: 0 2.2rem;
  }
  #contAll .backArrow,
  #contAll .nextArrow{
    position: absolute;
    width: 1.75rem;
    height: 2.24rem;
    appearance: none;
    outline: none;
    border: none;
    z-index: 3;
    top: 68.8rem;
  }
  #contAll .backArrow{
    background-image: url(../img/arrowR.svg);
    left: 21.1rem;
  }
  #contAll .nextArrow{
    background-image: url(../img/arrowL.svg);
    right: 21.1rem;
  }
  #contAll .cont03 .backArrow{
    left: 5.1rem;
  }
  #contAll .cont03 .nextArrow{
    right: 5.1rem;
  }

  /*** TaxtWrap ***/
  #contAll .taxWrap{
    font-size: 1.8rem;
    letter-spacing: 0em;
    display: inline-flex;
    justify-content: space-between;
  }
  #contAll .taxWrap.spOnly{
    display: none!important;
  }
  #contAll .cont01 .taxWrap,
  #contAll .cont02 .taxWrap,
  #contAll .cont03 .taxWrap{
    margin: 0 auto;
    position: absolute;
    bottom: 0;
  }
  #contAll .cont01 .taxWrap{
    left: 45.7%;
  }
  #contAll .cont02 .taxWrap{
    left: 46.1%;
  }
  #contAll .cont03 .taxWrap{
    left: 44.7%;
  }
  /*** sizeTxt ***/
  #contAll .sizeTxt{
    font-size: 1.8rem;
    line-height: 1.6;
    letter-spacing: 0.03em;
    position: relative;
    left: 0;
    text-align: center;
    width: 100%;
    margin: 3.7rem auto 0;
  }

  /*** viewAll ***/
  #contAll .viewAll{
    font-size: 2rem;
    margin: 16rem auto 0;
    padding: 0 0 0.2rem;
    display: inline-block;

  }

  #contAll .viewAll .fadeBorderLeft{
    position: relative;
    margin: 1.1rem auto 0;
  }
  .footer .pagetop{
    border-top: 1px solid #707070;
    border-bottom: none;
    margin: 4.9rem auto 1.5rem;
    text-align: right;
    padding-top: 2rem;
    padding-bottom: 0;
  }
}

/*** fadeIn ***/
#contAll .fadeIn{
  opacity: 0;
  transition: all 1s ease;
  transition-delay: 0.3s;
}
#contAll .scrollIn{
  opacity: 1;
  transform: translateX(0);
  transform: translateY(0);
}


/*** border ***/
#contAll .onHide{
  width: 0%;
}
#contAll .onHide.onView{
  width:100%;
}
#contAll .fadeBorderLeft{
  transition: all 1.5s linear ease;
}
#contAll .viewAll .onView{
  width: calc(76 * (100vw / 375));
}

@media screen and (min-width: 768px) {
  #contAll .viewAll .onView{
    width: 12rem;
  }
}

/*** popout ***/
#contAll .popout{
  overflow: hidden;
  opacity: 0;
}
#contAll .popout.onView{
  opacity: 1;
}
#contAll .popout.onView span{
  position: relative;
  animation: popanime 0.5s ease-out forwards;
}
#contAll .itemName .popout.onView span .en{
  animation: popanime 0s ease-out forwards;
}

@keyframes popanime {
  from {
    bottom: -4rem;
  }
  to {
    bottom: 0;
  }
}