@charset "UTF-8";
.header.off{
  visibility: hidden;
  opacity: 0;
  z-index: -100;
  transition: 1s;
}
.header .header-logo {
  display: none;
}


html {
  font-size: calc(10* (100vw / 2100));
}

/*******************************
MR241107OUTER
*******************************/
#MR241107OUTER{
  display: block;
  width: 100%;
  box-sizing: border-box;
  font-family: "apparat-light", sans-serif;
  font-weight: 400;
  font-style: normal;
}

#MR241107OUTER{
  margin-top: -16rem;
  position: relative;
  z-index: 0;
}

#MR241107OUTER *{box-sizing: border-box;}


/*******************************
img setting
*******************************/
#MR241107OUTER .imgOuter{
  display: block;
  width: 100%;
  height: auto;
}

#MR241107OUTER .imgOuter > .outer,
#MR241107OUTER .imgOuter picture,
#MR241107OUTER .imgOuter img{
  display: block;
  width: 100%;
  height: auto;
}



/*******************************
fadeInSetting
*******************************/
#MR241107OUTER .fadeInBlock{
  opacity: 0;
  transition: opacity 1s ease-in;
}

#MR241107OUTER .fadeInBlock.view{
  opacity: 1;
}

/* zoomOut **/
#MR241107OUTER .fadeInBlock.zoomOut{
  opacity: 0;
}

#MR241107OUTER .fadeInBlock.zoomOut.view{opacity: 1;}

#MR241107OUTER .fadeInBlock.zoomOut > .imgOuter{
  overflow: hidden;
}
#MR241107OUTER .fadeInBlock.zoomOut > .imgOuter img{
  transform-origin: center;
  transform: scale(1.2);
  transition: transform 2s ease;
}

#MR241107OUTER .fadeInBlock.zoomOut.view > .imgOuter img{
  transform: scale(1);
}

/* downImg **/
#MR241107OUTER .fadeInBlock.downImg{
  opacity: 1;
}
#MR241107OUTER .fadeInBlock.downImg > .imgOuter{
  overflow: hidden;
  clip-path: inset(0 0 100% 0);
  transition: clip-path 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-delay: 0.5s;
}

#MR241107OUTER .fadeInBlock.downImg.view > .imgOuter{
  clip-path: inset(0 0 0 0);
}


/*fadeInList *****************/
#MR241107OUTER .fadeInList{
  overflow: hidden;
}

#MR241107OUTER .fadeInList > div{
  opacity: 0;
  /*transform: translateX(-100%);*/
  transition: transform 2s ease,opacity 2s ease;
}

#MR241107OUTER .fadeInList > div.view{
  opacity: 1;
  transform: translateX(0);
}


/*******************************
mvBlock
*******************************/
#MR241107OUTER .mvBlock{
  display: block;
  width: 100%;
  height: auto;
}

#MR241107OUTER .mvBlock > .outer,
#MR241107OUTER .mvBlock picture,
#MR241107OUTER .mvBlock img{
  display: block;
  width: 100%;
  height: auto;
}


#MR241107OUTER .mainTTL{
  display: block;
  padding-top: 12rem;
  font-family: "apparat-light", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: center;
}

#MR241107OUTER .mainTTL > span:nth-of-type(1){
  display: block;
  font-size: 7.8rem;
  line-height: 1;
  letter-spacing: -0.01em;
  font-feature-settings: 'palt';
}

#MR241107OUTER .mainTTL > span:nth-of-type(1) > picture{
  display: block;
  width: 20.76641428571429%;
  margin: 0 auto;
}
#MR241107OUTER .mainTTL > span:nth-of-type(1) > picture > img{display: block; width: 100%; height: auto;}


#MR241107OUTER .mainTTL > span:nth-of-type(2){
  display: block;
  /*
  margin-top: 2.5rem;
  */
  margin-top: 4.6rem;
  font-size: 4.2rem;
  line-height: 1;
  letter-spacing: 0.04em;
  font-feature-settings: 'palt';
}

#MR241107OUTER .mainTTL > span:nth-of-type(2) > picture{
  display: block;
  width: 13.03754285714286%;
  margin: 0 auto;
}
#MR241107OUTER .mainTTL > span:nth-of-type(2) > picture > img{display: block; width: 100%; height: auto;}


#MR241107OUTER .mainTTL.fadeInBlock{opacity: 1;}

#MR241107OUTER .mainTTL.fadeInBlock > span{
  opacity: 0;
  transition: opacity 1s ease;
}
#MR241107OUTER .mainTTL.fadeInBlock > span:nth-of-type(2){
  transition-delay: 0.5s; 
}

#MR241107OUTER .mainTTL.fadeInBlock.view > span{
  opacity: 1;
}




/*******************************
bar
*******************************/
#MR241107OUTER .bar.fadeInBlock{
  display: block;
  width: 100%;
  padding: 19.9rem 0 0;
  opacity: 1;
}

#MR241107OUTER .bar > span{
  display: block;
  width: 0;
  height: 1px;
  margin: 0 auto;
  opacity: 0;
  background: #000000;
  transition: all 1s linear;
}

#MR241107OUTER .bar.view > span{
  width: 10rem;
  opacity: 1;
}

/*******************************
creditLinks
*******************************/
#MR241107OUTER .secTTL{
  display: block;
  width: 100%;
  margin: 0 auto 12.8rem;
  font-family: "apparat-light", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: center;
  color: #000000;
  overflow: hidden;
}

#MR241107OUTER .secTTL.fadeInBlock{
  opacity: 1;
}

#MR241107OUTER .secTTL > span:nth-of-type(1){
  display: block;
  font-size: 3.8rem;
  line-height: 1;
  letter-spacing: 0.04em;
  font-feature-settings: 'palt';
}

#MR241107OUTER .secTTL > span:nth-of-type(2){
  display: block;
  /*
  margin-top: 3.5rem;
  */
  margin-top: 4.8rem;
  font-size: 4.9rem;
  line-height: 1;
  letter-spacing: 0.01em;
  font-feature-settings: 'palt';
  opacity: 0;
}

#MR241107OUTER .secTTL.fadeInBlock > span{
  opacity: 0;
  transition: opacity 1s ease;
}
#MR241107OUTER .secTTL.fadeInBlock > span:nth-of-type(2){
  transition-delay: 0.5s; 
}

#MR241107OUTER .secTTL.fadeInBlock.view > span{
  opacity: 1;
}


#MR241107OUTER .secTTL > span > picture{
  display: block;
  margin: 0 auto;
}
#MR241107OUTER .secTTL > span > picture > img{display: block; width: 100%; height: auto;}

/*******************************
creditLinks
*******************************/
#MR241107OUTER .creditArea{
  display: block;
  padding-top: 4.1rem;
}

#MR241107OUTER .creditArea.fadeInBlock{opacity: 1;}

#MR241107OUTER .creditLinks{
  display: block;
  white-space: nowrap;
  text-align: left;
}

#MR241107OUTER .creditLinks > a,
#MR241107OUTER .creditLinks > span{
  display: inline-block;
  white-space: nowrap;
  font-family: "apparat-light", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.6rem;
  letter-spacing: 0.02em;
  line-height: 1;
  color: #000000;
  text-decoration: none;
  text-decoration-skip-ink: none;
}

#MR241107OUTER .creditLinks > a:not(:last-child)::after,
#MR241107OUTER .creditLinks > span:not(:last-child)::after{
  content: '/';
  display: inline-block;
  padding: 0 0.4em 0 0.5em;
}

#MR241107OUTER .creditLinks > a > span,
#MR241107OUTER .creditLinks > span > span{
  display: inline-block;
  padding-right: 0.4em;
}


/*******************************
sectionWrap
*******************************/
#MR241107OUTER #sectionWrap{
  position: relative;
}

/*******************************
sec01
*******************************/
#MR241107OUTER #sec01{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding: 19.9rem 0 39.7rem;
  background: #FFFFFF;
  position: sticky;
  z-index: 1;
}

#MR241107OUTER #sec01 .secTTL > span:nth-of-type(1) > picture{
  width: 1.51450952380952%;
}
#MR241107OUTER #sec01 .secTTL > span:nth-of-type(2) > picture{
  width: 24.78413333333333%;
}



#MR241107OUTER #sec01 .img01{
  display: block;
  width: 48.57142857142857%;
  margin: 0 auto 0 8rem;
  position: relative;
  z-index: 2;
}

#MR241107OUTER #sec01 .creditArea{
  width: 48.57142857142857%;
  margin: 0 auto 0 8rem;
  position: relative;
  z-index: 2;
}

#MR241107OUTER #sec01 .img0203wrap{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  width: 64.76190476190476%;
  margin: -19.7rem 5rem 0 auto;
  position: relative;
  z-index: 1;
}

#MR241107OUTER #sec01 .img0203wrap .img02{
  order: 2;
  width: 51.47058823529412%;
}

#MR241107OUTER #sec01 .img0203wrap .img03{
  order: 1;
  width: 42.64705882352941%;
  margin-top: 68.1rem;
}


/*******************************
sec02
*******************************/
#MR241107OUTER #sec02{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding: 20rem 0 39.7rem;
  background: #959DA7;
  position: sticky;
  z-index: 2;
}

#MR241107OUTER #sec02 .secTTL{color: #FFFFFF;}
#MR241107OUTER #sec02 .secTTL > span:nth-of-type(2){
  margin-top: 4.7rem;
  transform: translateX(0.2rem);
}

#MR241107OUTER #sec02 .secTTL > span:nth-of-type(1) > picture{
  width: 1.86374761904762%;
}
#MR241107OUTER #sec02 .secTTL > span:nth-of-type(2) > picture{
  width: 31.13290476190476%;
}


#MR241107OUTER #sec02 .img01{
  display: block;
  width: 47.61904761904762%;
  margin: 0 auto 0 auto;
}


#MR241107OUTER #sec02 .img0203wrap{
  display: block;
  width: 60.95238095238095%;
  margin: 0 auto;
  /*padding: 25rem 0 25rem;*/
  padding: calc(50dvh - 40rem) 0 calc(50dvh - 40rem);
  padding: max(50dvh - 40rem, 4rem) 0 max(50dvh - 40rem, 4rem);
}


#MR241107OUTER #sec02 .img0203wrap .img02{
  position: sticky;
  /*top: 25rem;*/
  top: max(50dvh - 40rem, 4rem);
  width: 50%;
  z-index: 2;
}


#MR241107OUTER #sec02 .img0203wrap .img03{
  position: sticky;
  top: 80rem;
  width: 50%;
  z-index: 1;
  margin: 0 auto 0 calc(50% - 1px);
}


#MR241107OUTER #sec02 .img0203wrap .img02.fadeInBlock,
#MR241107OUTER #sec02 .img0203wrap .img03.fadeInBlock{opacity: 1;}

#MR241107OUTER #sec02 .img0203wrap .img02 picture,
#MR241107OUTER #sec02 .img0203wrap .img03 picture{
  width: 100%;
  padding-bottom: 125%;
  position: relative;
}

#MR241107OUTER #sec02 .img0203wrap .img02 picture > img,
#MR241107OUTER #sec02 .img0203wrap .img03 picture > img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}


#MR241107OUTER #sec02 .img04{
  display: block;
  width: 40%;
  margin: 0 auto 0 auto;
}


#MR241107OUTER #sec02 .creditArea{
  width: 100%;
}

#MR241107OUTER #sec02 .creditLinks{
  text-align: center;
}


#MR241107OUTER #sec02 .creditLinks > a{color: #FFFFFF;}

/*******************************
sec03
*******************************/
#MR241107OUTER #sec03{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding: 20rem 0 39.7rem;
  background: #FFFFFF;
  position: sticky;
  z-index: 3;
}

#MR241107OUTER #sec03 .secTTL{margin-bottom: 14rem;}

#MR241107OUTER #sec03 .secTTL > span:nth-of-type(1) > picture{
  width: 1.91257619047619%;
}

#MR241107OUTER #sec03 .secTTL > span:nth-of-type(2){
  transform: translateX(0.2rem);
}

#MR241107OUTER #sec03 .secTTL > span:nth-of-type(2) > picture{
  width: 15.59802857142857%;
}

#MR241107OUTER #sec03 .img01020304Wrap{
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
  gap: 0 0.47619047619048%;
  width: 100%;
  margin-bottom: 25rem;
}

#MR241107OUTER #sec03 .img01020304Wrap > div{
  flex-shrink: 1;
  width: 100%;
}

#MR241107OUTER #sec03 .img05{
  width: 47.61904761904762%;
  margin: 0 auto;
}


#MR241107OUTER #sec03 .creditArea{
  width: 100%;
}

#MR241107OUTER #sec03 .creditLinks{
  text-align: center;
}


/*******************************
sec04
*******************************/
#MR241107OUTER #sec04{
  display: block;
  width: 100%;
  padding: 19.8rem 0 30rem;
  background: #959DA7;
  position: sticky;
  z-index: 4;
}

#MR241107OUTER #sec04 .secTTL{
  color: #FFFFFF;
  margin-bottom: 12.6rem;
}

#MR241107OUTER #sec04 .secTTL > span:nth-of-type(1) > picture{
  width: 1.9722380952381%;
}
#MR241107OUTER #sec04 .secTTL > span:nth-of-type(2) > picture{
  width: 18.89499523809524%;
}

#MR241107OUTER #sec04 .img0102Wrap{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  width: 80%;
  margin: 0 auto;
  transform: translateX(1.78571428571429%);
}

#MR241107OUTER #sec04 .img0102Wrap .img01{
  order: 1;
  width: 38.0952380952381%;
}

#MR241107OUTER #sec04 .img0102Wrap .img02{
  order: 2;
  width: 57.14285714285714%;
  margin-top: 28.5rem;
}


#MR241107OUTER #sec04 .img0102Wrap .creditArea{
  order: 3;
  width: 100%;
}

#MR241107OUTER #sec04 .img0102Wrap .creditLinks{
  text-align: right;
}

#MR241107OUTER #sec04 .creditLinks > a{color: #FFFFFF;}


/*******************************
sectionUnder
*******************************/
#MR241107OUTER .sectionUnder{
  display: block;
  width: 100%;
  padding: 25rem 0 25rem;
}

#MR241107OUTER .sectionUnder .btnAllItem{
  display: block;
  text-align: center;
}

#MR241107OUTER .sectionUnder .btnAllItem > a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
  font-family: "apparat-light", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.2rem;
  letter-spacing: 0.01em;
  line-height: 1;
  color: #000000;
  position: relative;
  padding-bottom: 1.7rem;
}

#MR241107OUTER .sectionUnder .btnAllItem > a::after{
  content: '';
  display: block;
  width: 13rem;
  height: 1px;
  background: #000000;
  position: absolute;
  right: calc(50% - 13rem / 2);
  bottom: 0;
}


/*******************************
overRide
*******************************/
#MR241107OUTER .spView{display: none!important;}







