@import url("https://use.typekit.net/bnf7jzd.css");

@font-face {
  font-family: "classical-garamond-bt";
  src: url(../fonts/classical_garamond_bt.ttf) format("truetype"), url(../fonts/classical_garamond_bt.woff) format("woff");
  }

/* ==========================================================================
    Typograpgy
   ========================================================================== */
   @media (max-width: 767px) {
    .lp * {
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
    }
  }
  html {
    font-size: 62.5%;
  }

  * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  img,
  video,
  svg {
    width: 100%;
    height: auto;
  }

  /* for pc*/

  .main_container {
    margin: 0 auto;
    /*margin-top: 60px;*/
    width: 100%;
    font-family: toppan-bunkyu-mincho-pr6n, serif;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    line-height: 2;
    letter-spacing: 0.12em;
    color: #343434;
    font-feature-settings: "palt";
    text-align: center;
    position: relative;
  }

  .heading{
    margin:0 auto;
    margin-bottom: 96px;
  }

  .heading_img{
    width: 900px;
    margin:0 auto;
    margin-bottom: 47px;
  }

  .heading_ttl{
    font-size: 28px;
    line-height: 2;
    letter-spacing: 0.1em;
    margin-bottom: 45px;
  }

  /*1段目*/

  .sec01{
    margin-bottom: 93px;
  }

  .content_img_list{
    width: 810px;
    display: flex;
    margin:0 auto;
    margin-bottom: 54px;
  }

  .content_img{
    width: 390px;
    margin:0 auto;
  }

  .img2{
    margin-left: 30px;
  }

  .txt1{
    margin-bottom: 49px;
  }

  /*2段目*/

  .sec02{
    width: 1200px;
    margin:0 auto;
    margin-bottom: 96px;
    border-bottom:2px #c5c5c5 solid;
  }

  .sec02 .price{
    padding-bottom: 92px;
  }

  /*3段目*/
  .sec03{
    margin-bottom: 147px;
  }

  .content_list{
    width: 758px;
    display: flex;
    margin:0 auto;
  }

  .content_list_inner{
    width: 329px;
    margin:0 auto;
  }

  .gender{
    font-family: trajan-sans-pro, sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 17px;
    line-height: 1.647;
    margin-bottom: 20px;
    text-align: left;
  }

  .product_img{
    width: 329px;
    margin:0 auto;
    margin-bottom: 20px;
  }

  .list2{
    margin-left: 100px;
  }

  .color{
    width: 28px;
    margin-bottom: 23px;
    text-align: right;
  }

  .color_list{
    display: flex;
    justify-content: space-between;
    margin-bottom: 23px;
  }

  .content_list .content_list_inner .content_product_list .color{
    margin-left: auto;
  }

  .grey{
    width: 10px;
    height: 10px;
    background-color: #595268;
  }

  .beige{
    width: 10px;
    height: 10px;
    background-color: #b18770;
  }

  .product_name{
    text-align: right;
  }

  .all_item{
    width: 460px;
    margin:0 auto;
  }



.sp_only {
      display: none;
  }

  .pc_only{
    display: block;
  }











  /* ====== TABLET ===== */
  @media screen and (max-width: 1280px) and (min-width:751px){
    .main_container {
      font-size: calc(14* (100vw/1280));
    }

    .heading{
      margin-bottom: calc(96* (100vw/1280));
    }

    .heading_img{
      width: calc(900* (100vw/1280));
      margin-bottom: calc(47* (100vw/1280));
    }

    .heading_ttl{
      font-size: calc(26* (100vw/1280));
      margin-bottom: calc(45* (100vw/1280));
    }

    /*1段目*/

    .sec01{
      margin-bottom: calc(93* (100vw/1280));
    }

    .content_img_list{
      width: calc(810* (100vw/1280));
      margin-bottom: calc(54* (100vw/1280));
    }

    .content_img{
      width: calc(390* (100vw/1280));
    }

    .img2{
      margin-left: calc(30* (100vw/1280));
    }

    .txt1{
      margin-bottom: calc(49* (100vw/1280));
    }

    /*2段目*/

    .sec02{
      width: calc(1050* (100vw/1280));
      margin-bottom: calc(96* (100vw/1280));
      border-bottom: calc(2* (100vw/1280)) #343434 solid;
    }

    .sec02 .price{
      padding-bottom: calc(92* (100vw/1280));
    }

    /*3段目*/
    .sec03{
      margin-bottom: calc(147* (100vw/1280));
    }

    .content_list{
      width: calc(758* (100vw/1280));
    }

    .content_list_inner{
      width: calc(329* (100vw/1280));
    }

    .gender{
      font-size: calc(17* (100vw/1280));
      margin-bottom: calc(20* (100vw/1280));
    }

    .product_img{
      width: calc(329* (100vw/1280));
      margin-bottom: calc(20* (100vw/1280));
    }

    .list2{
      margin-left: calc(100* (100vw/1280));
    }

    .color{
      width: calc(28* (100vw/1280));
      margin-bottom: calc(23* (100vw/1280));
    }

    .color_list{
      margin-bottom: calc(23* (100vw/1280));
    }

    .grey{
      width: calc(10* (100vw/1280));
      height: calc(10* (100vw/1280));
    }

    .beige{
      width: calc(10* (100vw/1280));
      height: calc(10* (100vw/1280));
    }

    .all_item{
      width: calc(460* (100vw/1280));
    }

  }






  /* ====== SP ===== */
@media only screen and (max-width: 750px) {
.sp_only {
    display: block!important;
  }

.pc_only {
    display: none!important;
  }

  #Contents {
    width: 100%;
    /* background-image: url(../img/sp.jpg); */
    background-size: 100%;
    background-position-x: center;
    background-position-y:-176px;
    background-repeat: no-repeat;
    color: #343434!important;
  }

  .bredlist.lp {
    line-height: 5.33333vw;
    font-size: 2.66667vw;
    margin: 3.33333vw auto;
    width: 92.592%;
    text-align: left;
    padding: 0;
  }

  .main_container {
    font-size: calc(24* (100vw/750));
  }

  .heading{
    margin-bottom: calc(92* (100vw/750));
  }

  .heading_img{
    width: calc(750* (100vw/750));
    margin-bottom: calc(67* (100vw/750));
  }

  .heading_ttl{
    font-size: calc(38* (100vw/750));
    line-height: 1.789;
    font-weight: 200;
    margin-bottom: calc(43* (100vw/750));
  }

  /*1段目*/

  .sec01{
    margin-bottom: calc(90* (100vw/750));
  }

  .content_img_list{
    width: calc(630* (100vw/750));
    display: block;
    margin:0 auto;
    justify-content: none;
    margin-bottom: calc(70* (100vw/750));
  }

  .content_img{
    width: calc(630* (100vw/750));
    margin:0 auto;
  }

  .img2{
    margin-left: 0;
    margin-top: calc(55* (100vw/750));
  }

  .txt1{
    margin-bottom: calc(57* (100vw/750));
  }

  /*2段目*/

  .sec02{
    width: calc(700* (100vw/750));
    margin-bottom: calc(123* (100vw/750));
    border-bottom: calc(2* (100vw/750)) #7d7d7d solid;
  }

  .sec02 .price{
    padding-bottom: calc(88* (100vw/750));
  }

  /*3段目*/
  .sec03{
    margin-bottom: calc(141* (100vw/750));
  }

  .content_list{
    width: calc(397* (100vw/750));
    display: block;
  }

  .content_list_inner{
    width: calc(397* (100vw/750));
  }

  .gender{
    font-size: calc(30* (100vw/750));
    line-height: 0.933;
    margin-bottom: calc(45* (100vw/750));
  }

  .product_img{
    width: calc(397* (100vw/750));
    margin-bottom: calc(28* (100vw/750));
  }

  .list2{
    margin-left: 0;
    margin-top: calc(96* (100vw/750));
  }

  .color{
    width: calc(56* (100vw/750));
    margin-bottom: calc(28* (100vw/750));
  }

  .color_list{
    display: flex;
    justify-content: space-between;
    margin-bottom: calc(28* (100vw/750));
  }

  .content_list .content_list_inner .content_product_list .color{
    margin-left: auto;
  }

  .grey{
    width: calc(20* (100vw/750));
    height: calc(20* (100vw/750));
    background-color: #595268;
  }

  .beige{
    width: calc(20* (100vw/750));
    height: calc(20* (100vw/750));
    background-color: #b18770;
  }

  .all_item{
    width: calc(570* (100vw/750));
  }

}











/* fade */
.fade {
  transition-property: opacity, transform;
  transition-duration: 1.5s;
  opacity: 0;
  transform: translateY(1.5rem);
}

.fade.onView {
  opacity: 1;
  transform: translateY(0);
}