html {
  font-size: 62.5%;
}
@media only screen and (max-width: 1400px) and (min-width: 767px) {
  html {
    font-size: 0.7142857143vw;
  }
}
@media screen and (max-width: 1400px) {
  .win .F0718 .c__sec {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  #breadcrumb .cateList {
    display: flex;
    flex-wrap: wrap;
    margin-top: 0 !important;
    text-align: left;
  }
}
@font-face {
  font-family: "Noto Serif JP", serif;
  font-weight: 400;
  src: url("../font/NotoSerifCJKjp-Regular.otf");
}
@font-face {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  src: url("../font/NotoSerifCJKjp-Medium.otf");
}
@font-face {
  font-family: "Noto Serif JP", serif;
  font-weight: 600;
  src: url("../font/NotoSerifJP-SemiBold.otf");
}


/********************* common_all *********************/
.F0718 {
  --main_color: #58595b;
  --sub_color: #000000;
  --font_en: "petersburg-web", serif;
  --font_jp: "Noto Serif JP", serif;
}
.F0718 > section {
  margin-inline: auto;
}
.F0718 img {
  width: 100%;
  height: auto;
}
.F0718 .font_jp {
  font-family: var(--font_jp);
  font-weight: 400;
  font-feature-settings: "palt";
}
.F0718 .font_en {
  font-family: var(--font_en);
  font-weight: 400;
  font-style: normal;
}
@media screen and (min-width: 768px) {
  .F0718 .sp_only {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .F0718 .pc_only {
    display: none;
  }
}
/********************* common_all *********************/

/********************* firstview *********************/
.F0718 .fv {
  width: 120rem;
}
.F0718 .fv_lead {
  margin-top: 5.7rem;
  font-size: 1.3rem;
  line-height: 2;
  letter-spacing: 0.16em;
  text-align: center;
  color: var(--main_color);
}
@media screen and (max-width: 767px) {
  .F0718 .fv {
    width: calc(750*100vw/750);
  }
  .F0718 .fv_lead {
    margin-top: calc(107*100vw/750);
    font-size: calc(26*100vw/750);
    letter-spacing: 0.12em;
  }
}
/********************* firstview *********************/

/********************* common_contents *********************/
.F0718 .c__sec {
  position: relative;
  width: 140rem;
}
.F0718 .c__fl {
  display: flex;
  justify-content: space-between;
}
.F0718 .c__ttl {
  position: absolute;
  display: flex;
  color: var(--sub_color);
  letter-spacing: 0.02em;
  z-index: 2;
}
.F0718 .c__ttl > h2 > span {
  display: block;
}
.F0718 .c__ttl > h2 > span:nth-child(1) {
  font-size: 3.4rem;
  line-height: 0.9687096774;
  text-align: center;
}
.F0718 .c__ttl > h2 > span:nth-child(2) {
  margin-top: -1.2rem;
  font-size: 7.5rem;
  line-height: 1.2169117647;
}
.F0718 .c__ttl > h3 {
  margin-top: 4.5rem;
  margin-left: 0.6rem;
  font-size: 5rem;
  line-height: 1.2;
}
.F0718 .c__lead {
  margin-top: 3.4rem;
  font-size: 1.2rem;
  line-height: 2;
  letter-spacing: 0.16em;
  color: var(--main_color);
}
.F0718 .c__credit {
  font-size: 1.2rem;
  line-height: 1.75;
  letter-spacing: 0.02em;
  color: var(--main_color);
}
.F0718 .c__credit > p {
  display: inline-block;
}
@media screen and (max-width: 767px) {
  .F0718 .c__sec {
    width: calc(750*100vw/750);
  }
  .F0718 .c__ttl > h2 > span:nth-child(1) {
    font-size: calc(52*100vw/750);
    line-height: 0.9615384615;
  }
  .F0718 .c__ttl > h2 > span:nth-child(2) {
    margin-top: calc(-17*100vw/750);
    font-size: calc(108*100vw/750);
    line-height: 1.2259259259;
  }
  .F0718 .c__ttl > h3 {
    margin-top: calc(75.5*100vw/750);
    margin-left: calc(6*100vw/750);
    font-size: calc(64*100vw/750);
  }
  .F0718 .c__lead {
    margin-top: calc(48*100vw/750);
    width: calc(650*100vw/750);
    margin-inline: auto;
    font-size: calc(24*100vw/750);
    letter-spacing: 0.12em;
    text-align: justify;
  }
  .F0718 .c__credit {
    margin-top: calc(39*100vw/750);
    font-size: calc(22*100vw/750);
  }
  .F0718 .c__credit > p > span {
    display: inline-block;
  }
}
/********************* common_contents *********************/

/********************* section_01 *********************/
.F0718 .c__sec-01 {
  margin-top: 9.1rem;
  padding-top: 9.2rem;
}
.F0718 .c__sec-01 .c__ttl {
  top: 0rem;
  left: 34.8rem;
}
.F0718 .c__sec-01 .c__fl {
  margin-top: 4rem;
  flex-direction: column;
  gap: 4rem;
}
.F0718 .c__sec-01 .c__wrap {
  position: relative;
  display: flex;
  align-items: flex-end;
  margin-top: -13.4rem;
  margin-left: 82rem;
}
.F0718 .c__sec-01 .c__img-01 {
  width: 70rem;
  margin-inline: auto;
}
.F0718 .c__sec-01 .c__img-02 {
  width: 78rem;
  margin-left: 12rem;
}
.F0718 .c__sec-01 .c__img-03 {
  width: 32rem;
  height: 48rem;
}
.F0718 .c__sec-01 .c__desc {
  width: 49.2rem;
  margin-inline: auto;
}
.F0718 .c__sec-01 .c__credit {
  margin-bottom: -0.4rem;
  margin-left: 2rem;
}
.F0718 .c__sec-01 .c__credit > p {
  display: block;
}
@media screen and (max-width: 767px) {
  .F0718 .c__sec-01 {
    margin-top: calc(140*100vw/750);
    padding-top: calc(137*100vw/750);
  }
  .F0718 .c__sec-01 .c__ttl {
    top: calc(3.5*100vw/750);
    left: calc(45*100vw/750);
  }
  .F0718 .c__sec-01 .c__fl {
    margin-top: calc(60*100vw/750);
    gap: calc(0*100vw/750);
  }
  .F0718 .c__sec-01 .c__wrap {
    display: block;
    margin-top: calc(0*100vw/750);
    margin-left: calc(0*100vw/750);
  }
  .F0718 .c__sec-01 .c__img-01 {
    width: calc(650*100vw/750);
    margin-inline: auto;
    margin-right: 0;
  }
  .F0718 .c__sec-01 .c__img-02 {
    width: calc(600*100vw/750);
    margin-top: calc(60*100vw/750);
    margin-left: calc(0*100vw/750);
  }
  .F0718 .c__sec-01 .c__img-03 {
    width: calc(320*100vw/750);
    height: calc(480*100vw/750);
    margin-top: calc(20*100vw/750);
    margin-left: calc(380*100vw/750);
  }
  .F0718 .c__sec-01 .c__desc {
    width: calc(330*100vw/750);
  }
  .F0718 .c__sec-01 .c__credit {
    margin-top: calc(42*100vw/750);
    margin-bottom: calc(0*100vw/750);
    margin-left: calc(50*100vw/750);
  }
  .F0718 .c__sec-01 .c__credit > p{
    display: inline-block;
  }
}
/********************* section_01 *********************/

/********************* section_02 *********************/
.F0718 .c__sec-02 {
  margin-top: 11.7rem;
  padding-top: 9.1rem;
}
.F0718 .c__sec-02 .c__ttl {
  top: 0rem;
  right: 25rem;
}
.F0718 .c__sec-02 .c__img-01 {
  width: 87rem;
  margin-inline: auto;
}
.F0718 .c__sec-02 .c__img-02 {
  width: 53rem;
  height: 85rem;
}
.F0718 .c__sec-02 .c__img-04 {
  width: 42rem;
}
.F0718 .c__sec-02 .c__desc {
  width: 48.2rem;
  margin-top: 4rem;
  margin-left: 44.9rem;
}
.F0718 .c__sec-02 .c__wrap {
  display: flex;
  justify-content: space-between;
  margin-top: 4rem;
  padding-inline: 22rem;
}
.F0718 .c__sec-02 .c__lead {
  margin-top: 3.4rem;
  text-align: center;
}
.F0718 .c__sec-02 .c__credit {
  margin-top: 2rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .F0718 .c__sec-02 {
    margin-top: calc(145*100vw/750);
    padding-top: calc(139*100vw/750);
  }
  .F0718 .c__sec-02 .c__ttl {
    top: calc(6*100vw/750);
    right: calc(88*100vw/750);
  }
  .F0718 .c__sec-02 .c__ttl > h3 {
    margin-top: calc(75*100vw/750);
    margin-left: calc(16*100vw/750);
  }
  .F0718 .c__sec-02 .c__img-01 {
    width: calc(640*100vw/750);
    margin-inline: auto;
    margin-left: 0;
  }
  .F0718 .c__sec-02 .c__img-02 {
    width: calc(395*100vw/750);
    height: calc(645*100vw/750);
  }
  .F0718 .c__sec-02 .c__img-04 {
    width: calc(335*100vw/750);
  }
  .F0718 .c__sec-02 .c__desc {
    width: calc(310*100vw/750);
    margin: calc(60*100vw/750) auto;
  }
  .F0718 .c__sec-02 .c__wrap {
    margin-top: calc(0*100vw/750);
    padding-inline: calc(0*100vw/750);
  }
  .F0718 .c__sec-02 .c__lead {
    margin-top: calc(47*100vw/750);
    text-align: justify;
  }
  .F0718 .c__sec-02 .c__credit {
    margin-top: calc(43*100vw/750);
    margin-left: calc(50*100vw/750);
    text-align: left;
  }
}
/********************* section_02 *********************/

/********************* section_03 *********************/
.F0718 .c__sec-03 {
  margin-top: 11.8rem;
}
.F0718 .c__sec-03 .c__ttl {
  top: 88.3rem;
  left: 54.5rem;
}
.F0718 .c__sec-03 .c__ttl > h3 {
  margin-left: 1rem;
}
.F0718 .c__sec-03 .c__img-01 {
  width: 65rem;
  height: 97.5rem;
  margin-left: 65rem;
}
.F0718 .c__sec-03 .c__img-03 {
  width: 95rem;
  margin: 4rem auto 0;
}
.F0718 .c__sec-03 .c__wrap {
  margin-top: 10.1rem;
}
.F0718 .c__sec-03 .c__desc {
  width: 52.2rem;
  margin: 10.1rem auto 0;
}
.F0718 .c__sec-03 .c__lead {
  margin-top: 3.4rem;
  text-align: center;
}
.F0718 .c__sec-03 .c__credit {
  margin-top: 2rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .F0718 .c__sec-03 {
    margin-top: calc(153*100vw/750);
  }
  .F0718 .c__sec-03 .c__ttl {
    top: calc(765*100vw/750);
    left: calc(47*100vw/750);
  }
  .F0718 .c__sec-03 .c__ttl > h3 {
    margin-left: calc(10*100vw/750);
  }
  .F0718 .c__sec-03 .c__img-01 {
    width: calc(600*100vw/750);
    height: calc(900*100vw/750);
    margin-inline: auto;
  }
  .F0718 .c__sec-03 .c__img-03 {
    width: calc(750*100vw/750);
    margin: calc(0*100vw/750) auto 0;
  }
  .F0718 .c__sec-03 .c__wrap {
    margin-top: calc(0*100vw/750);
  }
  .F0718 .c__sec-03 .c__desc {
    width: calc(390*100vw/750);
    margin: calc(140*100vw/750) auto calc(60*100vw/750);
  }
  .F0718 .c__sec-03 .c__lead {
    margin-top: calc(47*100vw/750);
    text-align: justify;
  }
  .F0718 .c__sec-03 .c__credit {
    margin-top: calc(43*100vw/750);
    margin-left: calc(50*100vw/750);
    text-align: left;
  }
}
/********************* section_03 *********************/

/********************* section_04 *********************/
.F0718 .c__sec-04 {
  margin-top: 11.8rem;
}
.F0718 .c__sec-04 .c__ttl {
  top: 48.9rem;
  right: 10.1rem;
}
.F0718 .c__sec-04 .c__ttl > h2 > span:nth-child(1) {
  font-size: 3.1rem;
  line-height: 0.9687096774;
}
.F0718 .c__sec-04 .c__ttl > h2 > span:nth-child(2) {
  font-size: 6.8rem;
  line-height: 1.2169117647;
}
@media screen and (min-width: 768px) {
  .F0718 .c__sec-04 .c__ttl > h2 > span:nth-child(2) {
    margin-top: -1rem;
  }
}
.F0718 .c__sec-04 .c__ttl > h3 {
  margin-top: 3.8rem;
}
.F0718 .c__sec-04 .c__img-01 {
  width: 81rem;
  margin-inline: auto;
}
.F0718 .c__sec-04 .c__img-02 {
  width: 41.5rem;
  height: 75rem;
}
.F0718 .c__sec-04 .c__img-04 {
  width: 47.5rem;
}
.F0718 .c__sec-04 .c__desc {
  width: 47.2rem;
  margin-top: 4rem;
  margin-left: 9.2rem;
}
.F0718 .c__sec-04 .c__wrap {
  display: flex;
  justify-content: space-between;
  margin-top: 4rem;
  padding-inline: 25rem;
}
.F0718 .c__sec-04 .c__lead {
  margin-top: 3.4rem;
  text-align: center;
}
.F0718 .c__sec-04 .c__credit {
  margin-top: 2rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .F0718 .c__sec-04 {
    margin-top: calc(150*100vw/750);
  }
  .F0718 .c__sec-04 .c__ttl {
    flex-direction: row-reverse;
    top: calc(455*100vw/750);
    right: calc(35*100vw/750);
  }
  .F0718 .c__sec-04 .c__ttl > h2 > span:nth-child(1) {
    font-size: calc(52*100vw/750);
    line-height: 0.9615384615;
  }
  .F0718 .c__sec-04 .c__ttl > h2 > span:nth-child(2) {
    font-size: calc(108*100vw/750);
    line-height: 1.2259259259;
  }
  .F0718 .c__sec-04 .c__ttl > h3 {
    margin-top: calc(75.5*100vw/750);
    text-align: right;
    margin-right: calc(16*100vw/750);
  }
  .F0718 .c__sec-04 .c__img-01 {
    width: calc(680*100vw/750);
    margin-left: 0;
  }
  .F0718 .c__sec-04 .c__img-02 {
    width: calc(335*100vw/750);
    height: calc(600*100vw/750);
  }
  .F0718 .c__sec-04 .c__img-04 {
    width: calc(395*100vw/750);
  }
  .F0718 .c__sec-04 .c__desc {
    width: calc(310*100vw/750);
    margin: calc(183*100vw/750) auto calc(60*100vw/750);
  }
  .F0718 .c__sec-04 .c__wrap {
    margin-top: calc(0*100vw/750);
    padding-inline: calc(0*100vw/750);
  }
  .F0718 .c__sec-04 .c__lead {
    margin-top: calc(47*100vw/750);
    margin-left: calc(50*100vw/750);
    text-align: justify;
  }
  .F0718 .c__sec-04 .c__credit {
    margin-top: calc(43*100vw/750);
    margin-left: calc(50*100vw/750);
    text-align: left;
  }
}
/********************* section_04 *********************/

/********************* section_05 *********************/
.F0718 .c__sec-05 {
  margin-top: 11.5rem;
  padding-top: 14.5rem;
}
.F0718 .c__sec-05 .c__ttl {
  top: 0.3rem;
  left: 13.8rem;
}
.F0718 .c__sec-05 .c__ttl > h2 > span:nth-child(1) {
  font-size: 3.1rem;
  line-height: 0.9687096774;
}
.F0718 .c__sec-05 .c__ttl > h2 > span:nth-child(2) {
  font-size: 6.8rem;
  line-height: 1.2169117647;
}
@media screen and (min-width: 768px) {
  .F0718 .c__sec-05 .c__ttl > h2 > span:nth-child(2) {
    margin-top: -1rem;
  }
}
.F0718 .c__sec-05 .c__ttl > h3 {
  line-height: 1.2;
  margin-top: 3.6rem;
  margin-left: 1rem;
}
.F0718 .c__sec-05 .c__img-01,
.F0718 .c__sec-05 .c__img-02 {
  width: 75rem;
  margin-inline: auto;
}
.F0718 .c__sec-05 .c__img-02 {
  margin-top: 2rem;
}
.F0718 .c__sec-05 .c__img-03 {
  width: 90rem;
  margin-inline: auto;
}
.F0718 .c__sec-05 .c__desc {
  width: 50.6rem;
  margin-block: 4rem;
  margin-left: 42rem;
}
.F0718 .c__sec-05 .c__lead {
  margin-top: 3.4rem;
  text-align: center;
}
.F0718 .c__sec-05 .c__credit {
  margin-top: 2.1rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .F0718 .c__sec-05 {
    margin-top: calc(147*100vw/750);
    padding-top: calc(214*100vw/750);
  }
  .F0718 .c__sec-05 .c__ttl {
    top: calc(2*100vw/750);
    left: calc(49*100vw/750);
  }
  .F0718 .c__sec-05 .c__ttl > h2 > span:nth-child(1) {
    font-size: calc(52*100vw/750);
    line-height: 0.9615384615;
  }
  .F0718 .c__sec-05 .c__ttl > h2 > span:nth-child(2) {
    font-size: calc(108*100vw/750);
    line-height: 1.2259259259;
  }
  .F0718 .c__sec-05 .c__ttl > h3 {
    margin-top: calc(77*100vw/750);
    margin-left: calc(11*100vw/750);
  }
  .F0718 .c__sec-05 .c__img-01 {
    width: calc(640*100vw/750);
    margin-right: 0;
  }
  .F0718 .c__sec-05 .c__img-02 {
    width: calc(625*100vw/750);
    margin-top: calc(20*100vw/750);
    margin-left: 0;
  }
  .F0718 .c__sec-05 .c__img-03 {
    width: calc(750*100vw/750);
  }
  .F0718 .c__sec-05 .c__desc {
    width: calc(300*100vw/750);
    margin: calc(60*100vw/750) auto;
  }
  .F0718 .c__sec-05 .c__lead {
    margin-top: calc(47*100vw/750);
    text-align: justify;
  }
  .F0718 .c__sec-05 .c__credit {
    margin-top: calc(43*100vw/750);
    margin-left: calc(50*100vw/750);
    text-align: left;
  }
}
/********************* section_05 *********************/

/********************* endview *********************/
.F0718 .ev {
  width: 110rem;
  margin-top: 13.6rem;
  border-bottom: 1px solid var(--sub_color);
}
.F0718 .ev_btn {
  font-size: 2rem;
  line-height: 1;
  letter-spacing: 0.02em;
  color: var(--sub_color);
  text-align: center;
}
.F0718 .ev_btn > a {
  padding-block: 0.4rem;
  border-bottom: 3px double var(--main_color);
}
.F0718 .ev_staff {
  margin-block: 14.8rem 13.8rem;
  font-size: 1.2rem;
  line-height: 1.5;
  letter-spacing: 0.02em;
  color: var(--main_color);
  text-align: center;
}
@media screen and (max-width: 767px) {
  .F0718 .ev {
    width: calc(750*100vw/750);
    margin-top: calc(160*100vw/750);
    border-bottom: 0px solid var(--sub_color);
  }
  .F0718 .ev_btn {
    font-size: calc(40*100vw/750);
  }
  .F0718 .ev_btn > a {
    padding-block: calc(8*100vw/750);
  }
  .F0718 .ev_staff {
    margin-block: calc(170*100vw/750) calc(152*100vw/750);
    font-size: calc(24*100vw/750);
    line-height: 1.75;
  }
}
/********************* endview *********************/

/********************* scroll animation *********************/
.F0718 .c__img {
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.F0718 .c__img > a {
  display: block;
  width: 100%;
  height: 100%;
}

.F0718 .c__img figure:nth-child(1) {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0rem;
  left: 0rem;
  z-index: 2;
  transition: ease-in, 1000ms;
}
.F0718 .c__img figure:nth-child(2) {
  position: relative;
  width: 100%;
  height: 100%;
  top: 0rem;
  left: 0rem;
  z-index: -2;
}




.F0718 figure a {
  display: block;
  width: 100%;
  height: 100%;
}
.F0718 figure[class^="js-slide"] span {
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  top: 0rem;
  left: 0rem;
  z-index: -1;
}
.F0718 figure[class^="js-slide"] span::before {
  position: absolute;
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  top: 0rem;
  left: 0rem;
  background-color: #fff;
  z-index: 1;
}

/********************* scroll animation *********************/

/********************* common animation *********************/
.F0718 .fade img {
  opacity: 0;
  will-change: transform;
  transition: ease-in, opacity 1000ms, -webkit-transform 1000ms;
  transition: ease-in, opacity 1000ms, transform 1000ms;
  transition: ease-in, opacity 1000ms, transform 1000ms, -webkit-transform 1000ms;
  transform: translate3d(0, 0, 0);
}
.F0718 .fade figure[class^="js-slide"] img {
  opacity: 0;
  will-change: transform;
  transition: ease-in, 1000ms;
  transform: translate3d(0, 0, 0);
}
.F0718 .fade.active img,
.F0718 .fade.active figure[class^="js-slide"] img {
  opacity: 1;
}
/********************* common animation *********************/