@charset "utf-8";


@media only screen and (max-width: 1200px) {

  .back-image {}

  .slick-slider img {}

  .header-text_contents {}

  .header-text_contents p {
    font-size: 24px;
    padding: 15px;
  }

  section {
    top: 0vw;
  }

  section+svg {
    margin-top: 0;
  }

  .main-items {
    width: 27vw;
    top: 12vh;
    left: 5vw;
  }

  .desc_contents_box .desc_content {
    display: block;
    overflow: hidden;
  }

  .desc_contents_box .desc_content figure.pc {
    display: none !important;
  }

  .desc_contents_box .desc_content figure.sp {
    display: block !important;
  }

  .desc_contents_box .desc_content img {
    max-width: 100%;
  }

  .desc_point-contents img {
    max-width: 100%;
  }

  #convenient-situaition .situation-box .maincontents-area::before,
  #convenient-situaition .situation-box .maincontents-area,
  #convenient-situaition .situation-box .maincontents-area::after {
    background-size: 70% 100%;
    width: 100%;
    min-height: 200px;
  }

  #convenient-situaition .situation-box .maincontents-area::after {
    min-height: 120px;
  }

  #lineup .main-contents {
    width: 100vw;
  }

  #lineup .lineup-titlearea {
    height: 50vw;
  }

  .products-box .product-desc {
    min-height: 7.5rem;
  }

  .products-box .button-area {
    justify-content: space-around;
    gap: 0;
  }


  .product-desc-title h2 {
    font-size: 27px;
  }

  #Recommend .main-contents {
    width: 90vw;
  }

}


/* --------------- 以下、段階調整 ---------------*/
@media screen and (max-width: 1900px) {
  header {
    margin-bottom: -50vh;
  }
  #ProductDesc .desc_features {
    height: 30rem;
  }
}
@media screen and (max-width: 1700px) {
  header {
    margin-bottom: -32vh;
  }
  #ProductDesc .desc_features {
    height: 26rem;
  }
}
@media screen and (max-width: 1500px) {
  #ProductDesc .desc_features {
    height: 22rem;
  }
}
@media screen and (max-width: 1300px) {
  #ProductDesc .desc_features {
    height: 19rem;
  }
}
@media screen and (max-width: 1200px) {
  header {
    margin-bottom: -30vh;
  }
}
@media screen and (max-width: 1100px) {
  header {
    margin-bottom: -20vh;
  }
  #ProductDesc .desc_features {
    height: 16rem;
  }
}
@media screen and (max-width: 1000px) {
  header {
    margin-bottom: -15vh;
  }
  #ProductDesc .desc_features {
  	height: 14rem;
  }
}
@media screen and (max-width: 900px) {
  header {
    margin-bottom: -6vh;
  }
  #ProductDesc .desc_features {
  	height: 12rem;
  }
}
@media screen and (max-width: 800px) {
  header {
    margin-bottom: -4vh;
  }
  #ProductDesc .desc_features {
    height: 10rem;
  }
}