/* font-family: garamond-premier-pro-display, serif;
font-weight: 300;
font-style: normal;

font-family: garamond-premier-pro-display, serif;
font-weight: 400;
font-style: normal; */

/* @font-face {
  font-family: "Noto Serif JP";
  src: url("../font/NotoSerifCJKjp-Regular.otf") format("OpenType");
} */

/* html {
  font-size: 62.5%;
} */

#breadcrumb .cateList{
  display: none;
}

.footer_color_change{
  display: none;
}

@media only screen and (min-width: 768px) {
  #Contents{
    padding-top: 12.9rem;
  }
  .header.off{
    visibility: hidden;
    opacity: 0;
    z-index: -100;
    transition: 1s;
  }
}


@media screen and (max-width: 767px){
  /* html {
      font-size: calc(10* (100vw / 2100)) !important;
  } */
  #Contents{
    padding-top: calc(50 * (100vw / 750));
  }
  .header .btn-menu .border-t,
  .header .btn-menu .border-m,
  .header.open .btn-menu .border-m:after,
  .header .btn-menu .border-b{
    background: var(--baceColor);

  }
  #Header .header-logo img,
  #Header .search img,
  #Header .cart img,
  #Header .btn-search img,
  #Header .btn-cart img,
  .header .header-logo img,
  .header .search img,
  .header .cart img,
  .header .btn-search img,
  .header .btn-cart img {
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);
  }

  main.main-area {
    padding: 0;
  }

}


#issue105{
  display: block;
  width: 100%;
  max-width: 2100px;
  margin: 0 auto;
  background: #fff;
  font-size: 2.2rem;
  font-family: "garamond-premier-pro-display", serif;
  font-weight: 400;
  letter-spacing: 0.1em;
  font-style: normal;
  font-feature-settings: "palt";
  overflow: hidden;
  text-align: center;
}

@media only screen and (max-width: 767px) {
  #issue105{
    font-size: calc(24* (100vw / 750));
  }
}

#issue105 li{
  list-style: none;
  display: inline-block;
}
#issue105 a{
  display: block;
}

#issue105 img{
  display: inline-block;
  width: 100%;
  height: auto;
}
#issue105 .imgOuter{
  background: #fff;
  position: relative;
  transition: opacity 1.5s;
}


/*================================
  共通
=================================*/
#issue105 .flexArea{
  display: flex;
  width: 100%;
}

.number{
  font-weight: 400;
  letter-spacing: 0.02em;
}

.content_price{
  flex-wrap: wrap;
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.06em;
}


@media only screen and (min-width: 768px) {
  #issue105 .spOnly{
    display: none;
  }
  #issue105 .flexAreaPc{
    display: flex;
    width: 100%;
  }
  #issue105 .gridArea{
    display: grid;
    width: 100%;
  }
  #issue105 .w76{
    width: 76rem;
  }
  #issue105 .number{
    font-size: 3.7rem;
  }
  #issue105 .look{
    font-size: 3.5rem;
  }
  #issue105 .content_price{
    margin-top: 2rem;
    column-gap: 0.49rem;
    justify-content: center;
  }
  #issue105 .credit__wrap{
    margin-top: 5.6rem;
  }
  #issue105 .imgLink{
    background: #fff;
    position: relative;
    transition: opacity 1.5s;
  }
}

@media only screen and (max-width: 767px) {
  #issue105 .pcOnly{
    display: none;
  }
  #issue105 .flexAreaSp{
    display: flex;
    width: 100%;
  }
  #issue105 .content_img{
    margin-bottom: calc(20* (100vw / 750));
  }
  #issue105 .number{
    font-size: calc(53* (100vw / 750));
  }
  #issue105 .look{
    font-size: calc(50* (100vw / 750));
    padding-right: calc(7*(100vw / 750));
  }
  #issue105 .content_price a:nth-child(2) {
    margin-left: calc(4*(100vw / 750));
  }
  #issue105 .content_price a:first-child {
    margin-right: calc(5*(100vw / 750));
  }
  #issue105 .credit__wrap{
    width: calc(669*(100vw / 750));
    /* width: calc(667.26* (100vw / 750)); */
    margin-top: calc(73* (100vw / 750));
    margin-right: auto;
    margin-left: auto;
    justify-content: space-between;
    align-items: flex-end;
  }
  #issue105 .content_price{
    justify-content: flex-end;
    row-gap: calc(17*(100vw / 750));
    letter-spacing: 0.05em;
    font-weight: 400;
  }

}

/*--------------------------------
  mv
--------------------------------*/
#issue105 .heading{
  margin-right: auto;
  margin-left: auto;
}

@media only screen and (min-width: 768px) {
  #issue105 .heading{
    width: 170rem;
    margin-bottom: 18rem;
  }
}
@media only screen and (max-width: 767px) {
  #issue105 .heading{
    width: 100%;
    margin-bottom: calc(90* (100vw / 750));
  }
}
/*--------------------------------
  look
--------------------------------*/


/* #issue105 .section{
  position: relative;
  margin: auto;
} */
@media only screen and (min-width: 768px) {
  #issue105 .section{
    margin-bottom: 24rem;
  }
}

@media only screen and (max-width: 767px) {
  #issue105 .section{
    width: 100%;
    margin-bottom: calc(235* (100vw / 750));

  }
}
/* ========== ▼ sec01 ▼ ========== */
@media only screen and (min-width: 768px) {
  #issue105 .sec01{
    grid-template-rows: repeat(3, auto);
  }
  #issue105 .sec01 .content01{
    order: 1;
    width: 154rem;
    justify-content: space-between;
    margin-right: auto;
    margin-left: auto;
  }
  #issue105 .sec01 .content02{
    order: 3;
    width: 194rem;
    margin-right: auto;
    margin-left: auto;
  }
  #issue105 .sec01 .credit__wrap{
    order: 2;
    margin-bottom: 9.5rem;
  }
  #issue105 .sec01 .look{
    padding-right: 0.63rem;
  }
}
@media only screen and (max-width: 767px) {
  #issue105 .sec01 .content_price{
    width: calc(386.29* (100vw / 750));
    padding-top: calc(6*(100vw / 750));
  }
  #issue105 .sec01 .credit__wrap{
    align-items: flex-start;
  }

  #issue105 .sec01 .look {
    padding-right: calc(7*(100vw / 750));
  }
}
/* ========== ▼ sec02 ▼ ========== */
@media only screen and (min-width: 768px) {
  #issue105 .sec02{
    width: 100%;
    grid-template-columns: 93.8rem 12.2rem 40rem 7.8rem auto;
    grid-template-rows: 37.95rem 56rem 24.05rem auto;
  }
  #issue105 .sec02 .content_img01{
    width: 106rem;
    grid-column: 1 / 3;
    grid-row: 1 / 4;
    transition: opacity 800ms 300ms cubic-bezier(0.37, 0.18, 0.3, 0.93);
  }
  #issue105 .sec02 .content_img02{
    width: 60rem;
    grid-column: 2 / 5;
    grid-row: 3 / 5;
    transition: opacity 800ms 1300ms cubic-bezier(0.37, 0.18, 0.3, 0.93);
  }
  #issue105 .sec02 .content_img03{
    width: 64rem;
    height: 80rem;
    grid-column: 4 / 6;
    grid-row: 2 / 4;
    transition: opacity 800ms 800ms cubic-bezier(0.37, 0.18, 0.3, 0.93);

  }
  #issue105 .sec02 .credit__wrap{
    position: relative;
    bottom: -0.2rem;
    grid-column: 5 /6;
    grid-row: 4 / 5;
    align-self: flex-end;
    justify-self: baseline;
    text-align: justify;
    margin-left: 5.8rem;
    margin-top: 0;
  }
  #issue105 .sec02 .content_price{
    justify-content: flex-start;
    margin-left: 0.2rem;
  }
  #issue105 .sec02 .look{
    padding-right: 0.6rem;
  }
}
@media only screen and (max-width: 767px) {
  #issue105 .sec02 {
    margin-bottom: calc(226*(100vw / 750));
  }
  #issue105 .sec02 .content_img01{
    margin-bottom: calc(20*(100vw / 750));
  }
  #issue105 .sec02 .content_img02{
    margin-bottom: calc(20*(100vw / 750));
  }
  #issue105 .sec02 .content_img03{
    margin-bottom: calc(20*(100vw / 750));
  }
  #issue105 .sec02 .content_price {
    padding-bottom: calc(17*(100vw / 750));
  }
}

/* ========== ▼ sec03 ▼ ========== */
@media only screen and (min-width: 768px) {
  #issue105 .sec03{
    width: 194rem;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: end;
    margin-right: 0;
    margin-left: auto;
  }
  #issue105 .sec03 .content02 {
    padding-bottom: 5.3rem;
  }
  #issue105 .sec03 .content01 .content_img{
    width: 96rem;
  }
  #issue105 .sec03 .content02 .content_img{
    width: 66rem;
  }
  #issue105 .sec03 .credit__wrap{
    text-align: left;
  }
  #issue105 .sec03 .content_price{
    justify-content: flex-start;
  }
  #issue105 .credit__wrap
  #issue105 .sec03 .content_price{
    justify-content: flex-start;
  }

  #issue105 .sec03 .look{
    padding-right: 0.6rem;
  }

}


@media only screen and (max-width: 767px) {
  #issue105 .sec03 .content_price{
    width: calc(384.89* (100vw / 750));
    padding-top: calc(19*(100vw / 750));
  }
  #issue105 .sec03 .credit__wrap{
    align-items: center;
    margin-top: calc(60*(100vw / 750));
  }
  #issue105 .sec03 .number {
    padding-bottom: calc(5*(100vw / 750));
  }
}
/* ========== ▼ sec04 ▼ ========== */
@media only screen and (min-width: 768px) {
  #issue105 .sec04 {
    width: 154rem;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 25.7rem;
  }
  #issue105 .sec04 .content01{
    justify-content: space-between;
  }
  #issue105 .sec04 .look{
    padding-right: 0.45rem;
  }
  #issue105 .sec04 .credit__wrap {
    margin-top: 5.7rem;
  }

}

@media only screen and (max-width: 767px) {
  #issue105 .sec04 {
    margin-bottom: calc(228*(100vw / 750));
  }
  #issue105 .sec04 .credit__wrap{
    align-items: center;
    margin-top: calc(70*(100vw / 750));
  }
}


/*================ AllBtn ================*/
#issue105 .allBtnWrap{
  justify-content: center;
  margin-right: auto;
  margin-left: auto;
}

#issue105 .allBtnCont{
  letter-spacing: 0.02em;
  font-style: normal;
  line-height: 1;
}
#issue105 .btnLiner{
  background-color: #000;
  height: 1px;
}
@media only screen and (min-width: 768px) {
  #issue105 .allBtnWrap{
    margin-bottom: 26rem;
  }
  #issue105 .allBtnCont{
    font-weight: 300;
    font-size: 2.6rem;
  }
  #issue105 .btnLiner{
    margin: 1.5rem auto 0;
  }
  #issue105 .active{
    width: 13rem;
  }
}
@media only screen and (max-width: 767px) {
  #issue105 .allBtnWrap{
    margin-bottom: calc(204* (100vw / 750));
  }
  #issue105 .allBtnCont{
    font-weight: 400;
    font-size: calc(32* (100vw / 750));
  }

  #issue105 .btnLiner{
    margin: calc(15* (100vw / 750)) auto 0;
  }
  #issue105 .active{
    width: calc(150* (100vw / 750));
  }
}
@media only screen and (max-width: 560px) {
  .btnLiner{
    width: calc(150 * (100vw / 750));
    transform: scale(0, 1);
  }
  .active{
    transform: scale(1, 1);
  }
}
/*================ js-fadeIn ================*/
#issue105 .js-fadeIn{
  opacity: 0;
  transition: 2s;
  transform: 0;
}

#issue105 .js-scrollIn{
  opacity: 1;
}
#issue105 .itemBtn{
  opacity: 0;
  transition: 1s;
}


#issue105 .liner.done + .itemBtn{
  opacity: 1;
}
/*================ Liner ================*/
.liner{
  width: 0%;
  transition: all 1s ease;
}