/* ===============================================### 
共通設定
###=============================================== */
#issue106{
  --font-ja: "sawarabi-gothic", sans-serif;
  --font-en: "Times New Roman", Times, serif;
  --font-color: #000;
  overflow: hidden;
}

:where(#issue106) img{
  width: 100%;
  height: auto;
}

#breadcrumb .cateList{
  display: none;
}

main.main-area {
  padding: 0;
}

/* ===========### PC版用設定 ###=========== */
@media only screen and (min-width: 768px) {
  #Contents{
    padding-top: 0;
  }
  
  .header .header-logo{
    display: none;
  }

  .header.off{
    visibility: hidden;
    opacity: 0;
    z-index: -100;
    transition: 1s;
  }
}

@media screen and (min-width: 768px) {
  #issue106 .pc-visible{
    display: block;
  }

  #issue106 .sp-visible{
    display: none;
  }
}

/* ===========### SP版用設定 ###=========== */
@media screen and (max-width: 767px) {
  #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%);
  }

  #Header .btn-menu.open .border-m,
  .header .btn-menu.open .border-m {
    background-color: #000!important;
  }
  
  #Header .btn-menu .border > span,
  .header .btn-menu .border > span {
    background-color: #fff;
  }

  #Contents{
    padding-top: calc(50 * (100vw / 750));
  }

  #issue106 .pc-visible{
    display: none;
  }

  #issue106 .sp-visible{
    display: block;
  }
}


/* ===============================================### 
アニメーション設定
###=============================================== */
/*** fade-in ***/
#issue106 .js-fade-mv {
  opacity: 0;
  transition: 1.5s;
}

#issue106 .js-fade-in {
  opacity: 0;
  transition: 1.5s;
}

#issue106 .js-fade-up {
  transition: 0.8s ease-in-out;
  transform: translateY(30px);
  opacity: 0;
}

#issue106 .js-fade-mv.show,
#issue106 .js-fade-in.show {
  opacity: 1;
}

#issue106 .js-fade-up.show {
  transform: translateY(0);
  opacity: 1.0;
}


/************** line-animation **************/
#issue106 .js-line-anime{
  width: 0%;
  transition: all 1s ease;
}


/* ===========### responsive ###=========== */
@media screen and (min-width: 768px) {
  #issue106 .js-fade-up-pc {
    transition: 0.8s ease-in-out;
    transform: translateY(30px);
    opacity: 0;
  }

  #issue106 .js-fade-up-pc.show {
    transform: translateY(0);
    opacity: 1.0;
  }

  /*** slide-in ***/
  #issue106 .js-slide-in-rtl-pc {
    -webkit-transition: 0.8s ease-in-out;
    -moz-transition: 0.8s ease-in-out;
    -o-transition: 0.8s ease-in-out;
    transition: 0.8s ease-in-out;
    transform: translateX(30px);
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
  }

  #issue106 .js-slide-in-ltr-pc {
    -webkit-transition: 0.8s ease-in-out;
    -moz-transition: 0.8s ease-in-out;
    -o-transition: 0.8s ease-in-out;
    transition: 0.8s ease-in-out;
    transform: translateX(-30px);
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
  }

  #issue106 .js-slide-in-rtl-pc.show,
  #issue106 .js-slide-in-ltr-pc.show {
    transform: translateX(0);
    opacity: 1.0;
  }

  #issue106 .content04 .content__item02 .js-slide-in-ltr-pc{
    transition-delay: 0.4s;
  }
}

@media screen and (max-width: 767px) {
  #issue106 .js-fade-up {
    transition: 0.8s ease-in-out;
    transform: translateY(30px);
    opacity: 0;
  }

  #issue106 .js-fade-in-sp {
    opacity: 0;
    transition: 1.5s;
  }

  #issue106 .js-fade-in-sp.show {
    opacity: 1;
  }

  /*** slide-in ***/
  #issue106 .js-slide-in-rtl-sp {
    -webkit-transition: 0.8s ease-in-out;
    -moz-transition: 0.8s ease-in-out;
    -o-transition: 0.8s ease-in-out;
    transition: 0.8s ease-in-out;
    transform: translateX(30px);
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
  }

  #issue106 .js-slide-in-ltr-sp {
    -webkit-transition: 0.8s ease-in-out;
    -moz-transition: 0.8s ease-in-out;
    -o-transition: 0.8s ease-in-out;
    transition: 0.8s ease-in-out;
    transform: translateX(-30px);
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
  }

  #issue106 .js-slide-in-rtl-sp.show,
  #issue106 .js-slide-in-ltr-sp.show {
    transform: translateX(0);
    opacity: 1.0;
  }
}


/* ===============================================### 
MV
###=============================================== */
#issue106 .mv{
  width: 100%;
}

/************** text **************/
#issue106 .mv__text{
  margin-top: 10.7rem;
  font-family: var(--font-ja);
  font-weight: 500;
  font-style: normal;
  font-size: 1.9rem;
  line-height: 2;
  letter-spacing: 0.05em;
  text-align: center;
  color: var(--font-color);
  font-feature-settings: "palt";
}

/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  /************** text **************/
  #issue106 .mv__text{
    margin-top: calc(118 * (100vw / 750));
    font-size: calc(23 * (100vw / 750));
    letter-spacing: 0;
  }
}



/* ===============================================### 
コンテンツ共通設定
###=============================================== */
/************** flex **************/
#issue106 .flex-wrapper{
  display: flex;
  justify-content: space-between;
  align-items: end;
  flex-direction: row;
}

/************** credit **************/
#issue106 .credit{
  font-family: var(--font-en);
  font-size: 1.8rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  white-space: nowrap;
}

#issue106 .credit span{
  display: inline-block;
  margin-inline: 0.5rem;
}

#issue106 .credit span.sp-visible{
  display: none;
}


/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  /************** flex **************/
  #issue106 .flex-wrapper{
    flex-direction: column;
  }

  /************** credit **************/
  #issue106 .credit{
    font-size: calc(24 * (100vw / 750));
    letter-spacing: 0.045em;
  }

  #issue106 .credit span{
    margin-inline: calc(8 * (100vw / 750));
  }

  #issue106 .credit span.sp-visible{
    display: inline-block;
  }

  #issue106 .credit span.pc-visible{
    display: none;
  }
}



/* ===============================================### 
コンテンツ01
###=============================================== */
#issue106 .content01{
  width: 156rem;
  margin-top: 15.2rem;
  margin-inline: auto;
}

/************** grid **************/
#issue106 .content01 .grid-wrapper{
  display: grid;
  grid-template-columns: 57.9rem 20rem 27.8rem 8.3rem 42rem;
  grid-template-rows: 79.4rem 22.8rem 20.7rem 9.5rem 50.5rem;
}

#issue106 .content01 .grid__item01{
  grid-column: 1/3;
  grid-row: 1/3;
}

#issue106 .content01 .grid__item02{
  grid-column: 5/6;
  grid-row: 2/5;
}

#issue106 .content01 .grid__item03{
  grid-column: 2/4;
  grid-row: 4/6;
}

/************** text **************/
#issue106 .content01 .credit{
  margin-top: 2.5rem;
}

/************** image **************/
#issue106 .content01 .content__item01 .content__image{
  width: 78rem;
}

#issue106 .content01 .content__item02 .content__image{
  width: 42rem;
}

#issue106 .content01 .content__item03 .content__image{
  width: 48rem;
}


/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  #issue106 .content01{
    width: calc(750 * (100vw / 750));
    margin-top: calc(119 * (100vw / 750));
  }

  #issue106 .content01 .content__item02{
    margin-top: calc(83 * (100vw / 750));
    margin-left: calc(211 * (100vw / 750));
  }

  #issue106 .content01 .content__item03{
    margin-top: calc(79 * (100vw / 750));
    margin-right: auto;
    margin-left: calc(40 * (100vw / 750));
  }


  /************** grid **************/
  #issue106 .content01 .grid-wrapper{
    display: block;
  }

  /************** text **************/
  #issue106 .content01 .credit{
    letter-spacing: 0.03em;
    margin-top: calc(32 * (100vw / 750));
  }

  /************** image **************/
  #issue106 .content01 .content__item01 .content__image{
    width: calc(750 * (100vw / 750));
  }

  #issue106 .content01 .content__item02 .content__image{
    width: calc(540 * (100vw / 750));
  }

  #issue106 .content01 .content__item03 .content__image{
    width: calc(580 * (100vw / 750));
  }
}



/* ===============================================### 
コンテンツ02
###=============================================== */
#issue106 .content02{
  width: 169rem;
  margin-top: 28.9rem;
  margin-inline: auto;
}

/************** grid **************/
#issue106 .content02 .grid-wrapper{
  display: grid;
  grid-template-columns: 74rem 16rem 5.1rem 55rem 19rem;
  grid-template-rows: 54.9rem 20.3rem 35.7rem 36.6rem 25.3rem;
  margin-left: -1.5rem;
}

#issue106 .content02 .grid__item01{
  grid-column: 3/5;
  grid-row: 1/3;
}

#issue106 .content02 .grid__item02{
  grid-column: 4/6;
  grid-row: 4/6;
}

#issue106 .content02 .grid__item03{
  grid-column: 1/2;
  grid-row: 2/5;
}

/************** text **************/
#issue106 .content02 .credit{
  margin-bottom: -0.5rem;
  margin-left: -0.3rem;
  text-align: right;
}

/************** image **************/
#issue106 .content02 .content__item01 .content__image{
  width: 60rem;
}

#issue106 .content02 .content__item02 .content__image{
  width: 50rem;
}

#issue106 .content02 .content__item03 .content__image{
  width: 74rem;
}


/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  #issue106 .content02{
    width: calc(750 * (100vw / 750));
    margin-top: calc(235 * (100vw / 750));
  }

  #issue106 .content02 .content__item02{
    margin-top: calc(80 * (100vw / 750));
  }

  #issue106 .content02 .content__item03{
    margin-top: calc(80 * (100vw / 750));
    margin-right: calc(51 * (100vw / 750));
  }

  /************** grid **************/
  #issue106 .content02 .grid-wrapper{
    display: block;
    margin-left: 0;
  }

  /************** text **************/
  #issue106 .content02 .credit{
    margin-top: calc(33 * (100vw / 750));
    margin-bottom: 0;
    margin-left: 0;
  }

  /************** image **************/
  #issue106 .content02 .content__item01 .content__image{
    width: calc(660 * (100vw / 750));
  }

  #issue106 .content02 .content__item02 .content__image{
    width: calc(580 * (100vw / 750));
  }

  #issue106 .content02 .content__item03 .content__image{
    width: calc(700 * (100vw / 750));
  }
}



/* ===============================================### 
コンテンツ03
###=============================================== */
#issue106 .content03{
  width: 158rem;
  margin-top: 30.6rem;
  margin-inline: auto;
}

/************** grid **************/
#issue106 .content03 .grid-wrapper{
  display: grid;
  grid-template-columns: 48.8rem 29.1rem 14.8rem 19.2rem 46rem;
  grid-template-rows: 77.4rem 11.9rem 65rem 32.6rem 24.9rem;
  margin-left: -0.9rem;
}

#issue106 .content03 .grid__item01{
  grid-column: 4/6;
  grid-row: 4/6;
}

#issue106 .content03 .grid__item02{
  grid-column: 1/3;
  grid-row: 3/5;
}

#issue106 .content03 .grid__item03{
  grid-column: 2/5;
  grid-row: 1/2;
}

/************** text **************/
#issue106 .content03 .credit{
  text-align: right;
}

/************** image **************/
#issue106 .content03 .content__item01 .content__image{
  width: 46rem;
}

#issue106 .content03 .content__item02 .content__image{
  width: 78rem;
}

#issue106 .content03 .content__item03 .content__image{
  width: 62rem;
}

/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  #issue106 .content03{
    width: calc(750 * (100vw / 750));
    margin-top: calc(239 * (100vw / 750));
  }

  #issue106 .content03 .content__item01{
    margin-left: calc(230 * (100vw / 750));
  }

  #issue106 .content03 .content__item02{
    margin-top: calc(80 * (100vw / 750));
  }

  #issue106 .content03 .content__item03{
    margin-top: calc(84 * (100vw / 750));
    margin-left: calc(131 * (100vw / 750));
  }

  /************** grid **************/
  #issue106 .content03 .grid-wrapper{
    display: block;
    margin-left: 0;
  }

  /************** text **************/
  #issue106 .content03 .credit{
    margin-top: calc(30 * (100vw / 750));
    text-align: left;
  }

  /************** image **************/
  #issue106 .content03 .content__item01 .content__image{
    width: calc(520 * (100vw / 750));
  }

  #issue106 .content03 .content__item02 .content__image{
    width: calc(750 * (100vw / 750));
  }

  #issue106 .content03 .content__item03 .content__image{
    width: calc(620 * (100vw / 750));
  }
}


/* ===============================================### 
コンテンツ04
###=============================================== */
#issue106 .content04{
  width: 100%;
  margin-top: 29.9rem;
}

/************** grid **************/
#issue106 .content04 .grid-wrapper{
  display: grid;
  grid-template-columns: 77.3rem 44.7rem 30rem 1.8rem 56rem;
  grid-template-rows: 85.8rem 12.1rem 70rem;
}

#issue106 .content04 .grid__item01{
  grid-column: 1/3;
  grid-row: 1/2;
}

#issue106 .content04 .grid__item02{
  grid-column: 5/6;
  grid-row: 3/4;
}

#issue106 .content04 .grid__item03{
  grid-column: 2/4;
  grid-row: 3/4;
}

/************** text **************/
#issue106 .content04 .credit{
  margin-bottom: -0.4rem;
  margin-left: -0.4rem;
  text-align: right;
}

/************** image **************/
#issue106 .content04 .content__item01 .content__image{
  width: 121.8rem;
}

#issue106 .content04 .content__item02 .content__image{
  width: 56rem;
}

#issue106 .content04 .content__item03 .content__image{
  width: 56rem;
}


/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  #issue106 .content04{
    width: calc(750 * (100vw / 750));
    margin-top: calc(236 * (100vw / 750));
  }

  #issue106 .content04 .content__item02{
    margin-top: calc(78 * (100vw / 750));
    margin-left: calc(151 * (100vw / 750));
  }

  #issue106 .content04 .content__item03{
    margin-top: calc(80 * (100vw / 750));
  }

  /************** flex **************/
  #issue106 .content04 .flex-wrapper{
    flex-direction: column-reverse;
    align-items: center;
  }

  /************** grid **************/
  #issue106 .content04 .grid-wrapper{
    display: block;
  }

  /************** text **************/
  #issue106 .content04 .credit{
    margin-top: calc(34 * (100vw / 750));
    margin-bottom: 0;
    text-align: center;
  }

  /************** image **************/
  #issue106 .content04 .content__item01 .content__image{
    width: calc(750 * (100vw / 750));
  }

  #issue106 .content04 .content__item02 .content__image{
    width: calc(600 * (100vw / 750));
  }

  #issue106 .content04 .content__item03 .content__image{
    width: calc(750 * (100vw / 750));
  }
}



/* ===============================================### 
コンテンツ05
###=============================================== */
#issue106 .content05{
  width: 138rem;
  margin-top: 29.9rem;
  margin-inline: auto;
}

/************** grid **************/
#issue106 .content05 .grid-wrapper{
  display: grid;
  grid-template-columns: 62rem 16rem 60rem;
  grid-template-rows: 52rem 25.3rem 55.1rem;
  margin-left: 5rem;
}

#issue106 .content05 .grid__item01{
  grid-column: 1/2;
  grid-row: 1/2;
}

#issue106 .content05 .grid__item02{
  grid-column: 3/4;
  grid-row: 2/4;
}


/************** text **************/
#issue106 .content05 .credit{
  margin-top: 2.7rem;
}

#issue106 .content05 .credit span{
  margin-inline: 0.3rem;
}

/************** image **************/
#issue106 .content05 .content__item01 .content__image{
  width: 62rem;
}

#issue106 .content05 .content__item02 .content__image{
  width: 59.8rem;
}


/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  #issue106 .content05{
    width: calc(750 * (100vw / 750));
    margin-top: calc(234 * (100vw / 750));
  }

  #issue106 .content05 .content__item02{
    margin-top: calc(80 * (100vw / 750));
    margin-left: calc(151 * (100vw / 750));
  }


  /************** grid **************/
  #issue106 .content05 .grid-wrapper{
    display: block;
    margin-left: 0;
  }

  /************** text **************/
  #issue106 .content05 .credit{
    margin-top: calc(32 * (100vw / 750));
  }

  #issue106 .content05 .credit span{
    margin-inline: calc(8 * (100vw / 750));
  }

  /************** image **************/
  #issue106 .content05 .content__item01 .content__image{
    width: calc(660 * (100vw / 750));
  }

  #issue106 .content05 .content__item02 .content__image{
    width: calc(600 * (100vw / 750));
  }
}



/* ===============================================### 
コンテンツ06
###=============================================== */
#issue106 .content06{
  width: 103.5rem;
  margin-top: 25.4rem;
  margin-inline: auto;
}

/************** grid **************/
#issue106 .content06 .grid-wrapper{
  display: grid;
  grid-template-columns: 31.6rem 44.1rem 27.1rem;
  grid-template-rows: 94.6rem 8.2rem 65.5rem;
  margin-left: -1.6rem;
}

#issue106 .content06 .grid__item01{
  grid-column: 1/3;
  grid-row: 1/2;
}

#issue106 .content06 .grid__item02{
  grid-column: 2/4;
  grid-row: 3/4;
}


/************** text **************/
#issue106 .content06 .credit{
  margin-bottom: -0.4rem;
  text-align: right;
}

/************** image **************/
#issue106 .content06 .content__item01 .content__image{
  width: 75.8rem;
}

#issue106 .content06 .content__item02 .content__image{
  width: 52rem;
}

/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  #issue106 .content06{
    width: calc(750 * (100vw / 750));
    margin-top: calc(240 * (100vw / 750));
  }

  #issue106 .content06 .content__item02{
    margin-top: calc(79 * (100vw / 750));
    margin-right: auto;
    margin-left: calc(149 * (100vw / 750));
  }

  /************** flex **************/
  #issue106 .content06 .flex-wrapper{
    flex-direction: column-reverse;
    align-items: normal;
  }

  /************** grid **************/
  #issue106 .content06 .grid-wrapper{
    display: block;
    margin-left: 0;
  }

  /************** text **************/
  #issue106 .content06 .credit{
    letter-spacing: 0.03em;
    margin-top: calc(32 * (100vw / 750));
    margin-bottom: 0;
    margin-right: calc(46 * (100vw / 750));
  }

  /************** image **************/
  #issue106 .content06 .content__item01 .content__image{
    width: calc(750 * (100vw / 750));
  }

  #issue106 .content06 .content__item02 .content__image{
    width: calc(560 * (100vw / 750));
  }
}


/* ===============================================### 
リンクエリア
###=============================================== */
#issue106 .allBtnWrap{
  justify-content: center;
  margin-top: 25.7rem;
  margin-bottom: 21rem;
  margin-inline: auto;
}

#issue106 .allBtnWrap.flex-wrapper{
  justify-content: center;
  margin-right: auto;
  margin-left: auto;
} 

#issue106 .allBtnCont{
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 2.4rem;
  letter-spacing: 0.02em;
  font-style: normal;
  line-height: 1;
}
#issue106 .btnLiner{
  margin: 1.5rem auto 0;
  background-color: #000;
  height: 1px;
}

#issue106 .active{
  width: 13rem;
}

@media only screen and (max-width: 767px) {
  #issue106 .allBtnWrap{
    margin-top: calc(217 * (100vw / 750));
    margin-bottom: calc(204* (100vw / 750));
  }

  #issue106 .allBtnWrap.flex-wrapper{
    align-items: center;
  }

  #issue106 .allBtnCont{
    font-weight: 400;
    font-size: calc(28 * (100vw / 750));
  }

  #issue106 .btnLiner{
    margin: calc(15* (100vw / 750)) auto 0;
  }
  #issue106 .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);
  }
}